react 리엑트 공부 / 시작하기

 

https://yunyoung1819.tistory.com/122

[React] 리액트 작업 환경 설정하기

👆설치는 이곳을 참고했다

https://velopert.com/3626

누구든지 하는 리액트 3편: JSX | VELOPERT.LOG

👆강좌는 이분을 따라갈 예정. 설명이 매우 잘 되어 있어 나처럼 리엑트를 처음 시작하는 사람에게 추천...하지만 클래스컴포넌트 형식이여서 패스 (처음 시작 할 땐 함수컴포넌트 형식이여서 클래스 컴포넌트 형식은 나중에 읽어보는걸로 하자)

 

react.vlpt.us/

벨로퍼트와 함께하는 모던 리액트 · GitBook

👆친구가 추천해준 리엑트 강좌 이걸로 따라가보자

my-first-app 실행시키고 코드를 보려 vscode를 키려는데

아까 파일 정리하다 앱을 같이 지워버림 ㅋㅋㅋㅌ...

다시 깔아서 켜준다

컴포넌트 파일인 app.js

 

컴포넌트 파일 hello 생성

import React from 'react';

function Hello() {
    return <div><h1> hello</h1></div>
}

export default Hello;

 

app.js를 수정해 준다

import './App.css';
import React from 'react';
import Hello from './Hello';

function App() {
  return (
    <div>
      <Hello />
      <Hello />
      <Hello />
    </div>
  );
}

export default App;

저장하면 바로 바뀜

컴포넌트 👉 일종의 UI조각. 쉽게 재사용 할 수 있다