Web Development/React21 React / part.1 CRA CRA(Create-React_App)란? 리액트 프로젝트를 시작하는데 필요한 개발 환경을 구축해주는 도구(toolchain)이다. 1. CRA를 이용한 프로젝트 구축 터미널에서 프로젝트를 시작하고자 하는 폴더에 진입한다. cd [ 프로젝트를 구축할 폴더명] 프로젝트를 설치한다.이때 프로젝트명은 대문자 혹은 소문자로 작성한다(~!()^*)등의 일부 특수문자는 에러 발생 npx create-react-app [프로젝트명] 프로젝트 폴더 진입 cd [프로젝트명] 로컬 서버에 띄우기 npm start http://localhost:3000 이라는 로컬 서버주소를 확인 2. CRA 초기 폴더 및 파일 구성 node_modules, .gitignore, package.json 상관관계 이해하기 node_modul.. 2023. 4. 21. React/ Part.1 Node.j & npm 1. Node.js 등장 배경 자바스크립트는 웹 브라우저에서 동작하기 위한 언어로 웹브라우저 밖에서는 사용할 수 없었다 하지만 자바스크립트를 웹 브라우저 밖에서 사용하고자하는 개발자들의 니즈가 늘어남에 따라 웹 브라우저가 아닌 작업환경에서 동작할 수 있도록해주는 도구가 필요해졌다. ⇒ 자바스크립트의 탈 웹 2. Node.js란? Node.js는 브라우저 밖에서도 자바스크립트를 실행할 수 있게 해주는 자바스크립트 실행 환경이다. 3. npm(Node Package Manager)이란? Node.js를 이용해서 실행할 수 있는 자바스크립트 파일들의 묶음이 package이다. 패키지를 손쉽게 설치하고 관리하기 위한 도구가 NPM(Node Package Manager) node = ios / npm (Node .. 2023. 4. 21. React / intro : 리액트란? 리액트란 무엇인가? 들어가기에 앞서 리액트의 등장 배경을 통해 리액트의 필요성을 알아보자. 새로운 기술을 이해하기 위해서는 그 기술이 나오게된 배경을 먼저 이해하는 것이 중요하다. 어떤 배경에서 어떤 문제를 해결하기 위해 만들어 졌는지를 알면 그 기술을 더 쉽게 이해할 수 있다. 1. Web Application의 발전 상호작용이 적고 단순한 과거의 웹페이지와 달리 현재의 웹페이지는 상호작용이 많고 페이지의 규모 또한 커졌다. 쉽게 말해 예전에는 사용자가 수동적으로 정보를 받는 입장이었다면, 현재의 사용자는 다양한 액션을 취해 다양한 결과를 얻을 수 있게되었다. 2. 프론트엔드, 프레임워크(Framework)와 라이브러리(Library)의 등장 규모가 커짐에 따라 복잡해진 웹어.. 2023. 4. 21. 이전 1 2 3 다음
