본문 바로가기

오늘 한 일을 기록하자/TIL

(31)
210303_TIL... MVC Design Patterns memo : 책 추천 > 클린 아키텍쳐, 클린코드, head first Design pattern, GoF의 디자인 패턴 오늘한 일 Sequelize ORM 설치 Sequelize - Migrations 설치 cli 로 모델 만들기 스키마 -> Migrations 사용법 Model Basic - Data Types ( String / Boolean / Number / Date) Model Querying - SELECT / INSERT / UPDATE / DELETE MOdel Querying - Finders (findAll / findByPk / findOne / findOrCreate) Controller 구현 Http Status Code Redirect (예. bit.ly 서비스) 오늘 느낀점 ..
210223_TIL... Redux 오늘 한 일 Redux 란? Redux 가 필요한 이유 action, reducer, store 개념과 사용법 Redux(리덕스) 란? Redux 는 Javascript app 을 예측가능한 state container 이다. 다시말해, Redux 는 애플리케이션에서 정교한 상태 관리를 구현하는 데 도움이되는 라이브러리 중 하나이다. Redux 가 필요한 이유 React 로 프로젝트를 진행하면 각각의 Component 는 local state 를 가지게 되고, 어플리케이션은 global state 를 가지게 된다. 1) local state 의 전달이 어렵다 React 의 경우 props 를 이용해 전달하기 방식이기 때문에 프로젝트의 규모가 커지고, Component 의 수가 늘어나게 된다면 state ..
210128_TIL... bind() 오늘한 일 코드 리뷰를 할 때 마다 this, call, apply, bind 만 나오면 멈칫멈칫 했다. 그래서 오늘 확실히 개념을 잡고 싶어 다시 사용법, 예제를 보면서 공부했다. 오늘 느낀점 bind() 메소드가 호출되면 새로운 함수를 생성합니다. 받게되는 첫 인자의 value 로는 this 키워드를 설정하고, 이어지는 인자들은 바인드된 함수의 인수에 제공됩니다. bind() 는 call() 과 유사하게 this 및 인자를 바인딩하나, 당장 실행하는 것이 아닌 바인딩된 함수를 리턴하는 함수이다. case 1 : 이벤트 핸들러 bind 는 이벤트 핸들러에서 이벤트 객체 대신 다른 값을 전달하고자 할 때 유용하다. 클릭하세요 let btn = document.querySelector('#btn') btn..
210119_TIL.. 자료구조(Stack, Queue) 오늘한 일 Data Structure_1 Stack, Queue 개념 이해와 코드로 구현해보기 자료 구조의 모양을 추상적으로 표현해보기(그림) 스택과 재귀호출의 연관성에 대한 학습 Javascript 에서 Stack, Queue 자료구조가 가지고 있는 property 와 method 찾기 Stack Stack(스택)은 가장 나중에 삽입된 데이터가 먼저 삭제되는 특성의 자료형을 추상화한 것이다. LIFO(Last In First Out), 후입선출 ex) 식상에서 식판을 쌓는 것, 책을 위로 쌓아 놓는 것, 벽돌을 샇아 올리는 것, 프링글스 통 안에 감자칩 우리가 프링글스 통안에 든 감자칩을 먹기 위해서는 가장 위에 있는 감자칩부터 꺼낸다. => LIFO 구조이다. 이 처럼 Stack 은 한쪽 끝에서만 자..
210114_TIL.. OOP에 대하여 오늘한 일 Object Oriented Programing 개념, 특징 Javascript 에서의 OOP 방법 OOP 란 객체지향언어를 사용하는 프로그램을 말한다( 절차지향적언어). 대표적으로 객체지향언어로는 'Java'가 있고, 절차지향적언어에는 'c'가 있다. 1. 객체 객체지향언어에서는 모든게 객체이다. 즉, 프로그램을 구성하는 모든 요소(변수, 함수, 키워드 등)가 객체이다. "객체지향이란 실세계를 직접적이고 직관적으로 모델링할 수 있는 패러다임" ... 객체란 인간의 인지 능력을 이용해 식별 가능한 경계를 가진 모든 사물을 의미한다. - "객체 지향의 사실과 오해" [조영호] 객체 지향 프로그래밍(OOP: object-oriented programming)은 우리가 살고 있는 실제 세계가 객체(..
210113_TIL 오늘한 일 pair HA TEST code reviwe ESlint 설치와 적용 this 개념 정리 Array.prototype. 오늘 느낀점 pair분이 푼 코드를 보면서 사람의 생각은 절만 틀린게 없고, 다르구나를 느꼈다. '저런식으로도 풀 수 있구나'란 생각을 많이 했다. 내 코드와 비교하면서 겸손해지는 계기가 되기도 한것 같다.. ESlint 를 설치하고 700개가 넘는 error 가 났다. .eslintrc.json 에서 "env" 부분에 "mocha" : true 로 바꾸니 error 가 확 줄었다. "rules" 에 있던 "semi" 와 "quotes" 도 옵션으로 뺄 수 있다. this 는 어떻게 실행되는지에 따라 결정된다. function 키워드를 쓰는 순간 this 는 달라진다. cal..
201209_TIL 오늘한 일 Javascript 고차함수 coplit 문제풀이(1 ~ 22번) 고차함수란? array.filter() 와 array.map() 함수 표현식(function expression)과 함수 선언식(function declaration) declarative(선언형) vs imperative(명령형) 오늘 느낀점 고차함수란 1. 함수를 인자(argument)로 받는 함수 / 2. 함수를 리턴하는 함수(커리함수) / 3. 함수를 인자로 받고, 함수를 리턴하는 경우 이때, 인자(argument)로 전달되는 함수를 콜백 함수(callback function)이라고 한다. 함수 선언식과 함수 표현식의 가장 큰 차이점은 호이스팅이다. 함수 선언식의 호이스팅은 코드의 유지 보수 측면에서 좋지 않을 수 있다...
201203_TIL 오늘한 일 twittler 기능 개선(함수 추가) tweet 한 날짜 인간 친화적인 방식으로 표현(ex. 1년전, 1달전, 1일전, 1시간전, 1분전, 1초전, 방금전) 'check new tweet' 버튼을 눌렀을 때 날짜도 랜덤으로 보이게 하기 오늘 느낀점 현재 시간을 기준으로 tweet 한 시간을 빼서 표현했다(new Date() - new Date(writeday)). 이 값을 이용해 if 처리했다. function prinitTimeBefore(wrday) { let today = new Date(); let writeday = new Date(wrday); let timeBef; // 년도 if(today.getFullYear() > writeday.getFullYear()) { timeBef..