# What I learned

ahuuae

UI/UX의 중요성과 함께 프로덕트 규모가 많이 커지고 프론트엔드에서 수행하는 역할이 늘어났다.즉,관리하는 상태가 많아지고 상태관리의 필요성이 중요해졌다. #2. 상태란? 주어

ahuuae

신규 프로젝트를 진행하기 위해 서버와 데이터를 주고받기 위해 HTTP 통신을 해야하는법을 알아야 했다. 그 중 Axios를 통해 HTTP 통신하는 방법에 대해 알고 싶어서 찾아봤다. 주요 HTTP 통신방법 왜 React에서 주로 Axios를 이용해 통신하는

ahuuae

REST는 Representational State Transfer라는 용어의 약자로서 2000년도에 로이 필딩 (Roy Fielding)의 박사학위 논문에서 최초로 소개되었다. 로이 필딩은 HTTP의 주요 저자 중 한 사람으로 그

ahuuae

1Express란 Node.js의 프레임워크이다. 자바스크립트 프레임워크로 React, 자바 프레임워크로 Spring 등등이 있는 것처럼 Express는 Node.js를 빠르고 간결하게 사용할 수 있게 해준다. 2. Express의 특징E

ahuuae

Node.js는 Javascript의 runtime 이다.runtime이란? 프로그램이 실행될 때, 그 프로그램이 동작하는 곳이다.기존의 Javascript 런타임은 크롬, 사파리 같은 웹 브라우저였다. 그런데 Node.js의 등장으로 웹 브

ahuuae

자바스크립트에서는 짧은 시간에 유저 입력 등의 이벤트가 많이 일어나는 경우 화면이 끊길 수 있다. 그래서 이런 경우 특별한 최적화가 필요하다.대표적인 예가 바로 자동완성이다. 구글에 검색어를 입력하면 한 글자가 바뀔 때마다 실시간으로 업데이트하면서 추천 검색어를 띄워줘

ahuuae

react는 16.3 버전부터 정식적으로 ContextAPI를 지원하고 있다.일반적으로 부모와 자식간 props를 전달해 state를 변화시키는 것과는 달리 ContextAPI는 컴포넌트 간 간격이 없다.즉, 컴포넌트를 건너뛰고 다른 컴포넌트에서 state, funct

ahuuae

useState의 대체할 수 있는 함수다. useReducer는 State(상태)를 관리하고 업데이트하는 Hook인 useState를 대체할 수 있는 Hook이다. 다시 말해, useReducer는 

ahuuae

공부하면서 얻은 Hooks Tip!두 번째 인자(배열)의 값이 없어서 componentDidMount의 경우에만 실행된다.첫 렌더링 때 실행된다고 생각하면 된다.첫 렌더링 때 실행되는 componentDidMount를 플래그변수로 막고 그 이후(componentDidU

ahuuae

async & await 은 기존의 비동기처리 방식의 문제점들을 보완하면서도 사용법이 훨씬 간단하다.이처럼 async 를 사용하면 promise 코드를 훨씬 직관적으로 나타낼 수 있다.함수에 async만 붙이면 자동으로 promise 객체로 인식되고, return값은 

ahuuae

자바스크립트는 싱글 스레드 기반의 언어 이고, 자바스크립트 엔진은 하나의 호출 스택만을 사용한다.이는 요청이 동기적으로 처리되어 한 번에 한 가지 일만 처리할 수 있음 을 의미한다.만약 네트워크 요청과 같은 비동기 함수가 동기적으로 이루어지는 함수로 만들어졌다면 네트워

ahuuae

자바스크립트는 비동기 처리를 위한 하나의 패턴으로 콜백 함수를 사용한다. 하지만 전통적인 콜백 패턴은 콜백 헬로 인해 가독성이 나쁘고 비동기 처리 중 발생한 에러의 처리가 곤란하며 여러 개의 비동기 처리를 한번에 처리하는 데도 한계가 있다.ES6에서는 비동기 처리를 위

ahuuae

클로저(closure)는 자바스크립트에서 중요한 개념 중 하나다. 클로저는 자바스크립트 고유의 개념이 아니라 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어(Functional Programming language: 얼랭(Erlnag), 스칼라(Scala), 하스켈

ahuuae

자바스크립트의 함수는 호출될 때, 매개변수로 전달되는 인자값 이외에, arguments 객체 와 this를 암묵적으로 전달 받는다.Java에서의 this 는 인스턴스 자신(self)을 가리키는 참조변수이다. this가 객체 자신에 대한 참조 값을 가지고 있다는 뜻이다.

ahuuae

실행 컨텍스트(execution context)는 실행할 코드에 제공할 환경 정보들을모아놓은 객체로, 자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는개념이다.실행 컨텍스트는 자바스크립트 코드가 실행되는 환경이다. 모든 JavaScript 코드는 실행 컨텍

ahuuae

"use strict" 혹은 'use strict' 는 단순한 문자열처럼 생겼다. 하지만 이 문구가 스크립트 최상단에 오면 스크립트 전체가 “모던한” 방식으로 동작하게된다."use strict"는 평범한 JavaScript에 몇가지 변경이 일어나게 한다.기존에는 조용히

ahuuae

TDZ(Temporal Dead Zone)를 해석하면 "일시적 사각지대"다.첫 번째 코드 인스턴스 생성 후 클래스 선언두 번째 코드 함수 호출 후 함수 선언위 두개의 코드를 실행해보면 두 번째 코드는 정상적으로 작동 하지만 첫 번째 코드를 작동시키면ReferenceEr

gimminjae

예시 코드내 전역일로부터 지금까지 얼마나 시간이 흘렀는지 계산해보았다.결과를 보니..벌써 1년 20일이 흘렀다.여기서 주의할 점은 getDays는 1년 20일의 기간 차이를 일로 환산해 385일을 반환하는 것이 아닌 1년 0월 20일 중 day의 값만 반환한다는 것을

gimminjae

여행을 DAMDA 프로젝트는 여행계획을 세우는 서비스이기 때문에 날짜, 시간 등의 데이터를 당연히 사용한다.이걸 계기로 자바의 날짜, 시간 데이터 클래스인 LocalDateTime, LocalDate, LocalTime 등 을 살펴보려한다.날짜와 시간 정보가 모두 필요

gimminjae

Spring Boot를 사용하는 사람이라면, 스프링 컨트롤러에서 model로 html에 정보드을 넘겨주고 html에서 그 정보들을 사용하게 할 것이다.난 프로젝트를 하면서 model에서 넘겨준 정보들을 javascript에서 사용해야 하는 경우가 많이 있었다.그래서 질