# 코드 분할 Code Spliting 과거 : 대부분 React 앱들은 Webpack, Rollup과 같은 툴을 사용해 번들링(Bundling)합니다. 이렇게 하면 HTML 웹 페이지에 JavaScript를 쉽게 추가할 수 있기 때문입니다. 번들된 앱은 모든 JavaScript가 한 곳에 있기 때문에 페이지를 설정하는 데 필요한 호출 수가 적은 링크 태그 하나만 필요하게 됩니다. 모던 웹 이전의 웹 JavaScript 코드는 최소한의 수준으로 작성되었기 때문입니다. 코드 분할 아이디어 : 번들을 나눈 뒤 필요한 코드만 불러오면 어떨까? 번들이 거대해지는 것을 방지하기 위한 좋은 해결 방법은 번들을 물리적으로 나누는 것입니다. 코드 분할은 런타임 시 여러 번들을 동적으로 만들고 불러오는 것으로, Webp..

# 단축키 더보기 기본 단축키 복사하기 : Command + C 붙여넣기 : Command + V 잘라내기 : Command + X 복제하기 : Command + D 혹은 Option 누른 상태로 드래그 여러 요소 동시에 선택하기 : Shift 누른 상태로 클릭 그룹으로 묶기 : Command + G 프레임으로 묶기 : Command + Option + G 그룹, 프레임 해제하기 : Command + Shift + G 간격 측정하기 : 요소를 선택한 상태에서 Option 누르고 다른 요소에 마우스 올려놓기 오토 레이아웃 오토 레이아웃 추가하기 오토 레이아웃 적용할 요소 선택 → Shift + A 오토 레이아웃 적용할 요소 선택 → Design 탭 Auto layout 에서 + 버튼 선택 오토 레이아웃 제..

# UI UI(User Interface, 사용자 인터페이스)는 사람들이 컴퓨터와 상호 작용하는 시스템을 의미합니다. 보통 UI라고 하면 떠오르는 화면상의 그래픽 요소 외에도, 키보드, 마우스 등의 물리적 요소도 컴퓨터와 상호 작용하기 위한 시스템이므로 UI라고 볼 수 있습니다. # GUI GUI(Graphical User Interface, 그래픽 사용자 인터페이스) GUI는 사용자가 그래픽을 통해 컴퓨터와 정보를 교환하는 작업 환경을 말합니다. GUI의 예시는 우리가 보는 운영체제(Window, Mac OS)의 화면, 혹은 애플리케이션 화면이 있습니다. 프론트엔드 개발자로서의 UI는 대부분 이 GUI를 의미합니다. # UX UX(User Experience, 사용자 경험)의 사전적 의미는 사용자가 어..