React
웹, 모바일 유저 인터페이스를 위한 라이브러리
라이브러리/프레임워크
- 애플리케이션 개발을 쉽게 하기 위한 것
- 개발의 효율성 향상
- 리액트에 다른 라이브러리(프레임워크)를 리액트에 포함시킬 수 있음
html + css + DOM + event + js
엘리먼트와 오브젝트는 다름(엘리먼트 오브젝트로 접근해야함/오브젝트 안에 엘리먼트가 있는 것)
HTML5의 핵심은 마크업 중심에서 애플리케이션 중심으로 전환
<p id = music>음악</p>
id : 속성 이름
music : 속성 값
음악 : 엘리먼트의 콘텐츠
node.js
- javascript runtime environment
npm(node package manager)
- node.js 환경의 패키지 매니저
- npm 명령어를 사용하여 node.js 패키지를 설치하거나 패키지 버전 등을 관리할 수 있음
- node.js를 설치하면 npm이 같이 설치됨
vscode에서 ctrl + j 누르면 터미널 열림 > node -v 명령어로 현재 버전 확인 가능
폴더 생성 및 열기
ctrl + j : 터미널 열기
cd..[Enter] : 한 단계 상위 폴더로 이동
md 폴더명[Enter] : 폴더 생성
cd 폴더명 : 해당폴더로 이동
파일명.js 를 만들고
node 파일명.js[Enter] > 실행
packge.json 파일
- package는 라이브러리, 프레임워크, 작은 프로그램의 통칭
- package.json 파일에 패키지 정보, 패키지 실행에 필요한 구성과 방법 정의
packge.json 파일 생성
- npm init[Enter] : 신규 또는 존재하는 패키지 초기화
packge.json 파일이 생성되면
"scripts": {
} 안에
"start" : "node nice.js" 입력하고
npm run start[엔터]
하면 "나이스" 출력
>npm run start를 실행하면 packge.json의 start 프로퍼티 값인 "node nice.js"가 실행
npm run start --silent > 실행 과정이 출력되지 않고 결과만 출력
start, stop, retart, test <command>는 npm start처럼 "run"을 생략할 수 있다