재밌고 어려운 IT를 이해해보자~!

CRA to Our Boilerpalte 본문

React, Node Js

CRA to Our Boilerpalte

언제나즐거운IT 2024. 5. 11. 22:16

CRA 란 ?

Create React App : Set up a modern web app by running one command.

즉, 한 줄의 명령어를 입력함으로써 React 프로젝트 개발에 필수요소를 자동으로 구성하는 방법이다.

 

 

BoilerPlate 코드

모든 코드를 작성하기 위해 항상 필요한 부분을 의미한다. 
BoilerPlate는 다음 4가지로 구성되어 있다.

Import : 필요한 코드를 불러들이는 부분
Component : 현 페이지를 구현하는 코드
StyleSheet : 페이지의 객체를 꾸미기 위한 style
Export : 현 Javascript 코드를 타 Javascript에서 접근하기 위한 부분

 

 

React 학습을 위해 정리한 폴더 구조

 

Code Extension 사용법

 

 

위처럼 마켓에 react 검색 후 ES7 + React 를 설치하면

다양한 함수형을 간단하게 입력할 수 있다.

 

import React from 'react'

function LoginPage() {
  return (
    <div>LoginPage</div>
  )
}

export default LoginPage

기본함수 export 분리된 형태

'React, Node Js' 카테고리의 다른 글

데이터 Flow & Axios  (0) 2024.05.13
React Router Dom  (0) 2024.05.12
React.Js  (0) 2024.05.08
logout 기능  (0) 2024.05.07
Authentication  (0) 2024.05.06
Comments