React

박선규's avatar
Oct 11, 2024
React

React란

📌
React란 UI를 동적인 데이터에 맞춰 업데이트하고 변환하는 상태를 효율적으로 관리할 수 있는 라이브러리다.
  • 랜더링이 CSR방식이다.
  • 컴포넌트 기반으로 돼있어 재사용 가능
  • JSX문법을 통해 JavaSc ript와 유사한 문법으로 UI 컴포넌트 작성
 

리엑트 프레임 워크

Create React App

  • JavaScript 라이브러리
  • CSR방식
  • Javascript의 기본 문법 이해시 접근 쉽다.
  • SEO(검색 엔진)에 약하다.
  • 주소 표시줄로 컴포넌트를 다양하게 보여 주려면 리엑트 라우터 돔 라이브러리 설치
  • 상효 작용이 많은 개발을 할 때
 

Next.js

  • 프레임워크
  • 부트 스트랩 같은 개념
  • 미리 만들어진 요소를 컴포넌트로 불러와서 사용가능하다.
  • SCR 및 SSR 둘다 가능
  • 파일명만 가지고 자동으로 라우터가 된다.
  • SEO가 중요한 개발을 할 때
 

Node.js 설치

📌
JavaScript 런타임 환경으로 자바스크립트를 서버에서도 실행 할 수 있게 해주는 도구 원래 JavaScript는 브라우저에서만 작동 했지만, Node.js를 사용하면 서버 측에서도 자바 스크립트를 실행 가능하다. 크롬의 v8엔진을 기반으로 만들어졌다.
모두 next 하기
 

프로젝트 생성하기

 
 
npm =노드 패키지 매니저
npm을 이용해서 필요한 라이브러리들 다운 가능
 

React 프로젝트로 세팅

- 리엑트 프로젝트 생성 명령어 npx create-react-app [내 프로젝트 명] -폴더 이동 명령어 cd [내 프로젝트 명] -실행하기 npm start
notion image
 

실행하기

npm start
notion image
notion image

깃으로 세팅 확인하기

notion image
 
Share article

p4rksk