본문 바로가기

전체 글

(596)
JSX (Section 3) 참고> velopert.com/3626 1. React를 사용하면 웹 애플리케이션에서 사용하는 UI를 재사용 가능한 컴포넌트로 분리하여 작성하기 때문에 프로젝트의 유지보수성을 우수하게 해줌 2. import 구문: 파일에서 JSX를 사용하려면, 현재 파일에 필요한 React Component를 꼭 import 해야 함. 3. webpack은 빌드시 파일의 확장자에 따라 다른 작업을 자동으로 해줌 -> CSS 파일을 불러오면 메인 프로젝트에서 사용한 프로젝트를 한 파일에 모두 결합해줌 -> JavaScript 파일을 불러오면 모든 코드들이 제대로 로딩되게끔 순서를 설정하고 하나의 파일로 합쳐줌. -> svg처럼 따로 설정되지 않은 확장자의 경우 그냥 파일로 불러오고 나중에 사본을 만들어 그 경로를 받아옴...
React 프로젝트 시작하기 (Section 2) 참고> velopert.com/3621 1. React를 제대로 쓰려면 Node, yarn, Webpack, Babel 등의 도구를 설치해야 함. -> 입문자에겐 좀 어려운 과정이어서 페이스북에서 create-react-app 도구를 제공해줌. 2. Webpack을 사용하는 이유: 여러 개의 JSX 파일로 나뉜 React 컴포넌트를 한개로 결합하기 위해 사용. 3. Babel을 사용하는 이유: JSX를 비롯한 새로운 JavaScript 문법들을 사용하기 위해 사용.
React 란 (Section 1) 참고> velopert.com/3612 1. 요즘 웹은 단순한 웹 페이지가 아니라 웹 애플리케이션. -> 브라우저 상으로 자연스러운 흐름을 통한 많은 것을 할 수 있음. 2. 사용자와의 인터랙션이 별로 없는 웹사이트라면 프론트엔드 라이브러리를 굳이 쓸 필요 없이 직접 만들면 됨. -> But, 인터랙션이 많아지고 프로젝트 규모가 커지면 라이브러리가 꼭 필요 3. 대표적인 JavaScript 라이브러리로 Angular, Ember, Backbone, Vue, React 등이 있음 -> 라이브러리들마다 저마다의 특성이 있음 4. Angular -> 라우터, HTTP 클라이언트 등 웹 프로젝트에서 필요한 대부분의 도구들이 내장 -> Angular 1은 나온지 오래되서 많은 기업에서 이미 사용중임 -> Angu..
빨간색 버튼 만들기 (Section 65) 1. Owner Draw 기술: Windows 운영체제가 개발자로 하여금 컨트롤의 색상을 자신이 원하는 색상으로 변경할 수 있도록 지원해주는 기술 -> 컨트롤의 'Owner Draw' 속성을 True로 하면 해당 컨트롤은 스스로 그림을 그리지 않음. -> 컨트롤이 다시 그려져야 할 때마다 WM_DRAWITEM 메시지를 대화 상자로 보내서 사용자가 직접 그릴 수 있도록 함
Notify 메시지 (Section 63) 참고> blog.naver.com/tipsware/221144458154 1. Notify 메시지: 자식 Window에 일어난 사건을 부모 Window에게 알리기 위해 전달하는 메시지 ex) 부모 Window내의 자식 Widnow인 버튼을 클릭했을 때 부모가 그 이벤트를 알고 싶을 때 2. Windows 기본 컨트롤은 비교적 단순한 작업만 수행하기 때문에 WM_COMMAND 메시지로 Notify를 하면 됨 3. Windows 운영체제가 발전하면서 컨트롤들이 점점 복잡해졌고, WM_COMMAND 메시지로는 Notify 정보를 저장할 수 없게 되어 WM_NOTIFY 메시지가 새롭게 추가됨 4. 컨트롤마다 Notify 정보가 다르기 때문에 C 언어의 포인터 문법을 OOP의 다형성 개념과 비슷하게 사용함. 그래..
데이터 타입 (Section 32) 참고> opentutorials.org/course/743/6579 1. 데이터 타입은 원시 데이터 타입과 참조 데이터 타입(Wrapper 객체)으로 나뉨
표준 내장 객체의 확장 (Section 30) 참고> opentutorials.org/course/743/6475 1. Javascript 내장 객체의 prototype에 사용자 정의 함수를 추가할 수 있음. ex) Array.prototype.random = new function() {...}
prototype (Section 29) 참고> opentutorials.org/course/743/6573 1. prototype chain: child에서 최상위 parent로 prototype 이 chain처럼 연결되는 방식.