개발로그

오늘 한 일 내일 윤아씨와 약속이 있기 때문에 전에 받았던 소스를 분석해보고자 급 Vue.js 공부를 시작했다. Vuex에 대해 검색하다가 인프런에 있는 캡틴판교님의 Vue.js 완벽 가이드 강의를 급 결제함. 강의 듣기 전, Vuex 공식문서를 일단 한 번 읽어보기로 함. 공부 내용 Vuex Vuex는 Vue.js를 위한 상태 관리 저장소이다. 한마디로 모든 컴포넌트가 접근 가능한 상태값이 저장되어 있는 전역 저장소! 이것은 반응형이라서 저장소 내의 상태가 변경되면 해당 상태를 의존하는 컴포넌트들이 모두 업데이트 된다. 이것에는 5가지 핵심 컨셉이 있다. 1. State Vuex는 단일 상태 트리로서 하나의 어플리케이션에는 하나의 상태 저장소만 존재한다. 저장소에 접근할 때는 'store.state.상..

오늘 한 일 노마드 코더 아카데미 를 하루만에 완강했다. 그림판 비슷한 것을 만들어 보는 실습이라서 태그를 나름 깊이 있게 다뤄보았다. canvas태그에서 context를 가져와야 픽셀을 컨트롤(?) 할 수 있다. getContext("2d") 형식으로 가져옴. beginPath() - 패스 초기화 moveTo(x, y) - 좌표 초기화 lineTo(x, y) - 초기화된 좌표로부터 해당 좌표까지 선을 잇는다. (실제로 그려지는 것은 아님) stroke() - 실제로 화면에 선을 그리는 함수 strokeStyle, fillStyle, lineWidth 등의 속성으로 색이나 굵기 등을 변경할 수 있다. 강의에서는 마우스를 움직일때 마다 (mousemove) 패스와 좌표를 초기화 했는데, 마우스 클릭 시점 ..

JavaScript Engine 이란? 자바스크립트 엔진은 자바스크립트 코드를 해석하고 실행하는 인터프리터다. (한 번에 모든 코드를 해석하는 것은 컴파일방식, 한 줄 한 줄 동시통역처럼 해석하는 것은 인터프리트방식) HTML과 CSS를 분석해서 화면을 그려주는 렌더링 엔진(Rendering Engine) 과는 다르다. 자바스크립트를 실행하는 환경(주로 web 또는 node.js)에서 자바스크립트 코드를 해석하여 실행하는 도구다. 자바스크립트 엔진은 크게 3가지 분류로 나눌 수 있다. Stack Heap Queue 여기에 추가로 이벤트 루프(Event Loop)가 들어가게 된다. Stack call stack은 함수(요청)가 호출될 때 마다 요청들을 순차적으로 쌓아두고 처리한다. 자료구조에서의 스택처럼 ..

이 글은 한재엽님의 블로그 글 신입 프론트엔드 개발자가 되려면 무엇을 학습해야 하나요? 를 바탕으로 하되, 제 기준과 생각을 추가하여 작성하였습니다. 하루에 이론공부 2시간(용어 학습 또는 CS지식 등 실습을 제외한 공부), 실습 4시간을 목표로 한다. 모든 용어나 명세 등은 키워드만 듣고도 설명할 수 있는 수준으로 충분히 이해될 때 까지 학습한다. (외우는것 X) #1 언어 및 웹문서(Document) 관련 공부 1. HTML/CSS HTML/CSS 기본 - 명세 읽기 웹 접근성 크로스 브라우징 이슈 (정의와 특징적인 이슈 또는 내가 경험했던 이슈) CSS 방법론 CSS Grid Layout CSS Media Query CSS3 Animation / Transition CSS 전처리기 (사용 이유, 역..