• 이 수업에서는 부록으로 프로젝트 수행을 위한 간단한 필수 개념만 언급합니다. 자세한 React와 Node에 대한 내용은 타 강의를 참고해주세요.

1. Node 설치 및 개요

Node.js

• Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임

• javascript 런타임! javascript가 동작할 수 있는 프로그램!
• javascript, HTML, CSS, WASM 어디서 돌아가나요?
• 웹 개발자 → 자바스크립트로 다 하고 싶다!
• 웹 브라우저에서만 동작하는 javascript를 V8엔진(크롬에 들어간 엔진)에다 살을 붙여(file, path, os..) 실행시킬 수 있는 런타임을 만든 것입니다.
  • firefox - spidermonkey
  • explorer - chakara(edge는 v8사용)
  • 엔진이 다르기 때문에 호완되는 태그들도 다른 것입니다!
• Node로 서버를 만들 수 있죠. 하지만 서버만 만들 수 있는 것은 아닙니다. 그래서 노드 == 서버라고 이해하시면 안됩니다.
• 특징
  • Non-Blocking I/O (비동기 Input/Output, 다 처리하지 않고 일단 전달! 바리스타야, 커피를 내려라!)
  • Single Thread (카페에서 주문을 받으시는 분은 한 분!, 물론 멀티도 가능합니다! 그런데 그 분이 만약 주문을 멈춘다면? error처리 필수!)

• 처음 공부하실 때에는 아래 홈페이지를 열어두고 찾아보면서 공부해 보세요. 한결 부담이 덜합니다. 외워야 한다는 압박에서 스스로를 놓아주세요.

  Index | Node.js v16.11.1 Documentation

  Introduction to Node.js

2. React Project 생성하기

이전 챕터에서는 웹페이지에 React를 적용시켜 보았습니다. 이번에는 리액트로 이루어진 프로젝트를 생성해 보도록 하겠습니다. 터미널을 실행하고 한 줄이면 프로젝트가 생성됩니다.

npx create-react-app my-app