본문 바로가기

전체 글

(57)
2022년 1월 19일 개발일지 오늘 면접을 보았는데요 , 제가 면접을 보고 대답을 잘 하지못했던부분 , 그리고 면접을 보았던 회사가 vue.js를 사용하는 회사여서 바로 vue.js 로 무엇인가를 빌드해보며 배워야겠다는 생각이들어서 , vue에대해 공부를 하겠습니다 . 그 전에 뷰에대해서 공부를했었는데 , 다시 처음부터 하도록 하겠습니다 . Vue -CLI - awesome tool for generating and building Vue apps - Features include Babel , TypeScript , ESLint , PostCSS & more - Includes dev server with hor reload - Includes Vue UI tool to manage your app in a graphical int..
2022년 1월 18일 개발일지 서비스 개발을 위한 PM에 대해 공부! Software Development LifeCycle 소프트웨어 계획 , 개발 , 시험 , 배포과정 요구사항 분석 -> 설계 -> 구현 -> 테스트 -> 유지 및 보수 Models build & fix : 일단 만들고 고치는 모델 Prototype : 최소한의 요구사항 분석후 프로토타입을 제작하여 고객의 요구를 개발에 적극적으로 도입 . 고객 평가가 중요한 프로덕트에 도입하는 모델 . Waterfall : 요구사항 분석 -> 설계 -> 구현 -> 운영이 순차적으로 진행 , 대규모 팀에 적합 . 각 단계를 완료하기 전까지 다음단계로 넘어가지 않음 . / 대기업에서 많이 사용 Spiral : 목표설정 -> 위험분석 -> 개발 및 검증 -> 고객평가 / 다음단계수립을 ..
2022년 1월 17일 개발일지 this에서 apply , bind , call 에 대해 공부하였습니다 . 우선 this를 전역에서 호출하게 되면 , this는 window객체 , 즉 전역객체를 반환하게 됩니다 . const obj = { name : hoyeoun } const say = function(lang){ console.log(`Hello my name is ${this.name} , i am living in ${city}`) } say('seoul') // hello my name is , i am living in seoul say.call(obj ,'seoul') // hello my name is hoyeoun , i am living in seoul say.apply(obj,['seoul'] ) // hello ..
2022년 1월 16일 개발일지 자바스크립트 코어 개념에 대해서 공부 ! 오늘은 this를 중점적으로 공부했습니다 . this의 용법 우선 this는 어디서 호출되었는지에 따라 결정됩니다 , 렉시컬스코프는 함수가 어디서 정의되었는지에따라 상위 스코프가 결정되는것이니 둘이 헷갈리지 않도록 해야겠습니다 . 1. 전역범위에서 this는 전역객체를 가르킵니다 . ( window 객체 ) 2. 일반 함수에서 사용될시 전역객체를 가리킵니다 . 3. 객체에 속한 메서드에서 사용될때 그 메서드의 객체 ( 점 앞에 명시된 객체 ) 를 가르킵니다 . 4. 객체의 속한 메서드의 내부함수에서 사용될땐 전역객체를 가르킵니다 . 5. 생성자에서 사용될때 생성자로 인해 생성된 새로운 객체를 가르킵니다 . 화살표 함수와 일반 함수의 차이점 일반함수 1. 일반함수는..
2022년 1월 15일 개발일지 자바스크립트 메모리에 대해 조금 희미해져서 다시 공부하려고 합니다 . 자바스크립트 런타임 자바스크립트 런타임엔 여러가지 요소가 있습니다 우선 자바스크립트 엔진이 있고 , 브라우저에서 제공하는 webAPI가 있습니다 , 그리고 콜백큐가 있습니다 . 자바스크립트 엔진에는 힙과 콜 스택이 있고 , 힙에는 객체가 저장되고 콜 스택에는 실행될 함수가 스택 자료구조형으로 쌓입니다 . webAPI에는 DOM객체 , console객체 , fetchAPI등이 있으며 , 콜백큐에는 각종 이벤트 콜백들이 있고 , 이 이벤트가 실행될시 자바스크립트 엔진 콜 스택에 이벤트루프가 이벤트콜백들을 콜백큐에서 꺼내어 밀어넣게 되는데 , 이 행위는 콜스택이 비어있을때에만 실행 됩니다 . 화살표 함수와 일반함수의 차이점 - 화살표함수는 ..
2022년 1월 14일 개발일지 면접 계획이 잡혀서 면접 질문에 대해서 공부를 하였습니다! 브라우저 렌더링 원리 (https://d2.naver.com/helloworld/59361) - 1. DOM, CSSOM생성: 가장 첫번째 단계로 서버로부터 받은 HTML, CSS를 다운받는다 → 단순한 텍스트인 HTML, CSS파일을 Object Model로 만든다. HTML은 DOM으로, CSS는 CSSOM으로 만들어진다. (html이 여기서 파싱된다) DOM Tree와 CSSOM Tree가 만들어진다 2. Render Tree생성: DOM Tree와 CSSOM Tree가 만들어졌으면 그 다음으로는 이 둘을 이용하여 Render Tree를 생성한다. 렌더트리에는 스타일 정보가 설정되어있고, 실제 화면에 표현되는 노드들로 구성된다. 3. Lay..
2022년 1월 13일 개발일지 어제에 이어 리액트 공부를 합니다 MobX에 대해서 공부 ! 저는 보통 redux를 사용하고 redux를 사용하기 편하게 해주는 redux-toolkit 을 사용하는데 , 이번에 MobX도 배워보기로 했습니다 . MobX의 특징 - 데코레이터를 적극활용합니다 - TypeScript 가 Base인 라이브러리입니다. - Redux와 마찬가지로 , 스토어에 필요한 부분과 리액트에 필요한 부분이 있습니다. - 리덕스와 다르게 단일 스토어를 강제하지 않습니다 . MobX의 흐름 이벤트 -> Actions ---------> observable state ---------> computed values ----------> side Effects(render) update notify trigger MobX를 쓰는..
2022년 1월 12일 개발일지 개인프로젝트 집중을 좀 해서 블로그에 신경 쓰지 못했네요 . 오늘은 리액트 공부를 하기전에 깃 훅에대해서 조금 공부해봤습니다 . 깃 훅 (Git Hook) 이란 ? git 에서 제공하는 프로세스 ( 커밋 , 푸쉬 , 리베이스 등 ) 의 전이나 후 이벤트를 후킹하여 특정 액션을 실행하는 스크립트를 git hook이라고 합니다 . 여러가지 깃 훅들 - applypatch-msg - pre-applypatch - post-applypatch - pre-commit - prepare-commit-msg - commit-msg - post-commit - pre-rebase - post-checkout - post-merge - pre-receive - post-update - pre-auto-gc - post-..