분반 수업 (스탠다드)
베이직, 스탠다드, 챌린지 세 개로 나누어서 일주일에 두세번 수업을 진행해주신다. 수준별 수업을 듣고 과제를 하고.
나는 스탠다드 반에 지망했고, 오늘 첫 수업을 들었다.
이해 못 했던 부분들을 차근차근 이해가 쉽게 설명해주셔서 굉장히 도움이 많이 되는 시간이었다.
강의 들으면서 조금 적어본 메모...
JSX
- JSX (일명 작스)
- HTML처럼 생긴 문법 파일
- 풀어 쓰면 = JavaScript XML
- 여기서 XML = HTML과 같이 하나의 마크업 언어
- 자바스크립트의 확장문법이라고 부른다. 브라우저는 jsx를 못 읽음. js로 변환을 해야 읽을 수 있다. 개발자에게는 jsx가 편함. 우리가 jsx로 작업을 하면 패키지들이 알아서 변환을 해준다고 이해하면 됨!
React
- React = SPA 싱글 페이지 어플리케이션
HTML 파일이 하나밖에 없다는 뜻.
- 패키지: 개발을 위한 세팅들이 되어있는 파일들
패키지 설치 명령어:npm install (npm을 쓰는 경우) or yarn (yarn을 쓰는 경우)
- 로컬호스트 띄우는 명령어
라이브서버처럼 저장하는 내용이 바로바로 반영된다.npm run dev or yarn dev
리액트가 동작하는 방식
- 상태(state)가 바뀌면 다시 랜더링한다. (브라우저 랜더링이랑은 다름)
- 랜더링: 컴퍼넌트를 위에서 아래로 쭉 읽는 것 이라고 이해하면 됨
- useState을 사용할 때 두 개의 인자가 들어가는데, 각각 현재 상태 값, 상태를 바꾸는 인자라고 이해하면 된다.
count: 현재 상태 값 인자
setCount: 상태를 바꾸는 인자function App() { const [count, setCount] = useState(0); // 최초의 count 값 = 0 return ... ... } ``
추가 메모
- html에서 속성 = attribute
- 자바스크립트에서 속성 = property
