본문 바로가기

REACT/패스트캠퍼스 리액트 국비 강의

패스트캠퍼스 react 강의 학습후기 4주차

 

 

이번 주차에는 강사님을 따라 스타벅스 페이지를 html, css로 클론 코딩하고, node.js에 발을 살짝 담근다. node.js는 자바스크립트를 이용해 만들어진 서버 전용 언어인데, js 하나를 공부해도 프론트에서 백엔드까지 모두 할 수 있게 하는 매력적인 소프트웨어 플랫폼이다.

 

강사님을 따라 만든 스타벅스 페이지

 

당연한 이야기지만 무조건 화면만 보고 따라치기만 해서는 실력이 늘지 않기 때문에.. 여기서 배운걸 이용해 기획하고 있는 웹서비스를 직접 만들어보았다. 클론 코딩만 해서는 개발 지식이 머리에 제대로 들어오지 않기 때문에, 응용하는 과정이 꼭 필요하다. 제대로 공부하고 싶은 사람들을 위한 주차 자율 과제같은게 있으면 참 좋았을텐데.. 조금 아쉽다.

 

 

 

node.js

 

이번 주차의 마지막 강의는 npm 설치와 nvm 사용법이다. 개발 서버를 실행하고 빌드하는 법을 배우고, 실제로 웹페이지를 띄워본다. 

 

 

"scripts": {
    "dev": "parcel index.html",
    "build": "parcel build index.html"
  },
 
-> dev  : parcel 패키지를 이용하여 개발용 index.html 로컬 서버를 구동시킨다.
-> build : parcel-bundler 패키지를 이용하여 실제로 서비스될 수 있는 서버를 구동시킨다.

둘 다 package.json에 입력한 뒤에, 터미널을 열어 npm run dev, npm run build로 실행시킬 수 있다. node.js를 설치하면 자동으로 npm이 설치되기 때문에 번거롭게 따로 설치할 필요가 없고, node.js의 안정적인 LTS버전만 설치하면 된다.

 

 

* 유의적 버전(SemVer) 

: Semantic Versioning = 의미 있는 버전.

 

ex) 12.14.1 = Major.Minor.Patch 

 

ㄴ Major, 예시에서는 '12' : 기존 버전과 호환되지 않는 새로운 버전. 메인이 되는 버전으로, 호환이 되지 않는 전혀 새로운 기능들이 들어있기 때문에 Major 버전을 반드시 맞춰주어야 한다.

 

ㄴMinor, 예시에서는 '14' : 기존 버전과 호환되는 새로운 기능이 추가된 버전. 12 버전의 하위에, 14번째 새로운 기능이 추가된 버전이다.

 

ㄴ Patch, 예시에서는 '1' : 기존 버전과 호환되는 버그, 오타 등의 단순한 기능들이 약간 수정된 상태

 

^Major.Minor.Patch : 캐롯 기호를 붙이면 Major 이하에서 최신 버전으로 업데이트 해준다.