SMALL
|
책을 보니 공부단이란걸 하길래 카페 가입해서 공부단 신청하고나서 이 글을 쓴다.
오늘(20/11/24)부터 13일간 (20/12/06까지) 공부를 해나가고자 한다.
공부한 내용
01. 리액트 시작하기
- 현재 주목 받고 있는 프레임워크중에 가장 많이 사용하는 것은 리액트 이다.
- 리액트는 화면출력 특화 프레임워크이다.
- 설치 : NVM(노드버전매니저) 설치 -> Node.js 설치 -> Node.js 사용 설정-> yarn 설치 -> create-react-app 설치 ->프로젝트(리액트 앱) 생성.
- 구동 구동하고자 하는 디렉토리로 이동한 뒤 'yarn start'
- package.json 수정해서 라이브러리 다운받을 수 있음
- VSCode를 사용한다면 Reactjs code snippets 플러그인과 Prettier플러그인 설치 권장
- App.css에서 css수정, App.js의 내용을 수정하여 저장만하면 바로 핫 리로딩이되기 때문에 바로 화면이 바뀌어 있다.
02. 리액트 ES6문법 액기스
기존 자바스크립트와 ES6의 차이점(~02-4)
- ES6에선 백틱(`)을 이용한 템플릿 문자열 사용
- 전개 연산자 (...를 이용하여 만들 수 있다. 배열,객체에서 이용 가능)
- 과거 var만 사용하던 것에서 가변 변수 let, 불변 변수const 나눠서 사용
- 과거 클래스 표현식이 없어 prototype으로 클래스를 표현했으나 class 정의 가능해짐.
어려웠던 점
ES6 개념이 어려워서 이해가 잘 되지 않았다.
코드에 대해서 하나 하나 설명해주는 건 알기 쉬웠지만, 실제로 어떻게 동작하는지 잘 이해가 안 갔다.
console.log()로 찍어가면서 확인하고서야 이해했는데, 전자책에는 그런건 없었고 유튜브 영상과 github를 보고서야 깨달을 수 있었다.
내돈내산 인증
LIST
'개발을 해보다 > 내맘대로스터디' 카테고리의 다른 글
#05 Do it! 리액트 프로그래밍 정석 스터디 5일차[225~268p] (0) | 2020.11.28 |
---|---|
#04 Do it! 리액트 프로그래밍 정석 스터디 4일차[153~221p] (0) | 2020.11.27 |
#03 Do it! 리액트 프로그래밍 정석 스터디 3일차[79~152p] (0) | 2020.11.26 |
#02 Do it! 리액트 프로그래밍 정석 스터디 2일차[53~78p] (0) | 2020.11.25 |
[내맘대로스터디] #00. React 공부 계획 (0) | 2020.11.23 |