<aside> <img src="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/3e9b61fa-7a3a-4ebc-b502-407eaf7619ee/css__280x280.png" alt="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/3e9b61fa-7a3a-4ebc-b502-407eaf7619ee/css__280x280.png" width="40px" />

</aside>

• PDF 파일

[수업 목표]

1. NVM으로 노드 버전을 관리할 수 있다.
2. npm과 yarn으로 react 패키지를 설치할 수 있다.
3. CRA(create-react-app)을 사용해 React를 설치한다.
4. React에서 쓰는 태그(JSX)를 사용해서 화면을 그릴 수 있다.
5. 클래스형 컴포넌트 vs 함수형 컴포넌트! 차이점을 안다.
6. 화면을 예쁘게 꾸미는 3가지 방법(CSS, SCSS, styled-component)중 CSS를 살펴본다.

[목차]

<aside> 💡 모든 토글을 열고 닫는 단축키 Windows : Ctrl + alt + t Mac : ⌘ + ⌥ + t

</aside>

00. 프론트엔드의 꽃, 리액트 강의는 앞으로,

• 우리는 앞으로 이렇게 배울 거예요!

  1. 오류를 많이 낼 거예요! 빨간 화면에 익숙해지시도록요!
  2. 모르는 단어를 잔뜩 들을 거예요! 스스로 공부하기 위한 좋은 키워드가 되어줍니다.
  3. 만든 코드를 주저없이 버리고 새로 시작할 거예요!

• 질문할 때는,

  <aside> ⚠️ 그냥 모르겠어요! 라고 하시는 것보다, 어디를 모르는지 알려주시면 더 자세히, 빨리, 필요한 부분만 설명 드릴 수 있어요!

  아래 세 가지를 함께 튜터에게 알려주시면 좋답니다 😉

  아래 세 가지 항목을 잘 모르신다구요? 그럴 땐 그냥 도와주세요!라고 하세요! 괜찮아요!

  </aside>

  1. 어떤 운영체제를 쓰는지, (윈도우10, 맥 등 간략하게 표기해주셔도 됩니다!)
  2. 오류가 났다면 어떤 오류 메시지가 나오는지, (화면을 캡쳐해주세요!)
  3. 어떤 것을 하고 싶으신지