React 1

서영이·2022년 7월 9일
0
post-thumbnail

<react 특징>
component 사용(tag정의)
-> 가독성/재사용성/유지보수 높아짐

(1) npm install
npm install -g create-react-app

npm-설치하는 프로그램(node js필요/ 여러 라이브러리들 사용가능/ 무료사용가능)
npx-임시로 설치해서 딱 한번만 실행시키고 지우는 애(공간 낭비x/ 항상 최신 상태)

cmd로 경로 이동해서 'react-app'만들기->'create-react-app .'이용해서 설치완료하기

vscode에서 npm run start하면 주소가 나오고 react실행된다.

create-react-app->간편한 환경 셋업을 위해서 사용한다

(2) react
create react app-> id가 root인 곳 안에 component만들기로 약속
-> src dir안 파일 수정으로 만들기 가능
entry(진입)파일=> index.js("document.getElementById('root')")

[EX]
import {component name} from {file name}-뒤에 js생략
import './APP.css' -css를 component에 적용하는 방법

import React, { Component } from "react";

class App extends Component {
	render() {
      return(
        <tag>
        </tag>
      );
    }
  }
  export default App; 외부에서 이 component불러서 외부 파일에서 사용 가능

(3) build
npm install -g serve(용량이 훨씬 작아짐)
실제 서비스를 build안의 문서들(static)

profile
방학을 헛투로 쓰지말자

0개의 댓글