Today's Dev Log

Written by@orongee22

GitHubVelog

[Javascript] ES6 문법 정리하기!

1. ES6? ES6 let, const 전개 문법 spread 비구조화 할당문법 클래스 문법 promise, async, await for-of? 화살표 함수 - this 2. let, const 로 선언했을 때의 scope관련 문제점을 타파하기 위해 제시된 변수 선언법 var : 함수형 스코프를 가짐 let, const 블록 스코프를 가짐. let 지…

[ReactJS] Hooks?

Hooks 리액트 구버전에서는 클래스 컴포넌트에서만! state 관리랑 라이프사이클 등을 사용할 수 있었음. 그런데 버전이 업데이트 되면서 함수형 컴포넌트에서도 기능들을 사용할 수 있게 만들어줌. 그것이 바로 Hooks! , 등등등 여러가지… useState 말 그대로 state 관리를 use한다는 거임. 첫번째 인자로 초깃값을 설정한 뒤에, 두번째 인…

[ReactJS] Redux란?

Redux? 컴포넌트가 많이 나뉠수록 복잡해지는 state값을 관리해주는 라이브러리. 상태변화값들을 스토어에 담아 직접 주입하는 식으로 처리하기 때문에 글로벌한 상태 관리가 가능하다. 하나의 어플리케이션 안에는 하나의 스토어만 가능 state값은 무조건 읽기 전용 리듀서는 반드시 순수함수. 항상 똑같은 값을 내보내야함. (Math.random() X) 액…

[ReactJS] 리덕스 모듈 쪼개기

액션 타입 2. 액션 생성함수 3. 리듀서 가 들어있는 자바스크립트 파일 리덕스 모듈 만들기 modules라는 디렉토리 안에 counter / todo 모듈 파일을 생성하기. modules/counter.js : modules/todo.js : 루트 리듀서 생성한 리덕스 모듈은 두개. 따라서 리듀서 또한 두개가 내보내짐. 한 프로젝트 내 리듀서가 여러개일…

spring boot 프로젝트 생성 시, could not download javadoc 에러

스프링 부트를 사용하려고 spring starter project를 이용하여 프로젝트를 생성하려고 했다. 그런데! could not download javadoc… 어쩌구 에러창과 함께 라이브러리 설치도 끝마치지 않고 프로젝트가 생성되어 버리는 이상한 문제가…ㅠㅠ 메이븐 관련 오류인 것 같아 검색해보니 해결 방법은 아주 간단했다. 에 있는 reposit…

[ReactJS] 2. 리액트 이벤트 핸들링

자바스크립트의 이벤트 연결과 달리 함수 그대로 값을 넣어 전달함. (화살표 함수 형태) 이벤트는 반드시 DOM요소에 직접 설정 이름은 camelCase로 작성

[React] 3. 리액트 라이프사이클

리액트 컴포넌트는 수명 주기란 것이 존재한다. 그리고 수명 주기는 크게 세 가지로 분류됨. 컴포넌트가 페이지에 새로 렌더링 될 때 - 마운트 컴포넌트가 업데이트될 때 - 업데이트 컴포넌트가 페이지에서 사라질 때 - 언마운트 라이프사이클 종류 마운트 constructor(props) 컴포넌트를 만들 때, 가장 처음으로 실행되는 생성자 메소드. 의 기본값을 …

[JavaScript] this의 정체

this?? 함수가 호출될 때, 전달받은 인자값에서 암묵적으로 전달받는 값인 보통 자바에선 가 자기 자신을 가리키는 참조변수이지만, 자바스크립트에서의 개념은 조금 다르다. 함수가 호출되는 방식에 따라 자기 자신을 가리킬 수도, 상위의 어떤 객체를 가리키기도 하고, 또 엄격 모드와 비엄격 모드에서의 차이가 있기도 함. 암튼 이 란 녀석의 개념은 좀 복잡하…

[Vue.JS] 1. 뷰 시작하기

Vue.js 시작하기 Vue의 장점은 리액트와 앵귤러의 장점들을 적절히 융합했다는 것에 있음. 리액트처럼 가상 돔을 사용하기에 빠른 DOM 렌더링이 가능함. 뷰는 리액트와 다르게 싱글 페이지로 구성됨. 의 코드를 한 파일 내에서 관리하기에 알아보기도 매우 편리하고 관리하기에도 용이함. 설치 혹은 CDN으로 손쉽게 가져와서 바로 적용이 가능함. 적용 …

[ReactJS] 1. 리액트 시작하기

React 설치 리액트 프로젝트 도구인 을 모든 디렉토리에서 사용할 수 있게 전역에 설치시킨다. 1. 전역 설치 2. 프로젝트를 생성 3. 프로젝트 실행 명령어는 프로젝트를 개발서버에서 실행시킨다. http://localhost:3000 페이지에서 확인 가능함. JSX JS 코드를 확장시켜 html 형태로 생성한 문법. 자바스크립트이므로 속성과 모든 이…