side_project 기록
0. 작업할 폴더 생성
폴더 생성 후 폴더에서 VSCode 실행
터미널 open (ctrl+`)
1. github 프로젝트 로컬로 가져오기
git clone 주소
cd 프로젝트 이름
2. 브랜치 생성
1) VSCode에서 왼쪽 하단부에 master 클릭
2) 새 분기 만들기
3. 실행
npm install
: node_modules 폴더 생성 ( .gitignore파일에 /node_modules 추가되어있음)
npm start
: 실행
package.json
"scripts": {
"start": "react-scripts start",
}
React
리액트 블로그 참고
누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG
이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무
velopert.com
요약정리
1. 사용 이유
웹 개발 시 귀찮은 DOM 관리와 상태 값 업데이트 관리를 최소화하고, 오직 기능 개발, 그리고 사용자 인터페이스를 구현하는 것에 집중할 수 있도록 하기 위한 라이브러리
Virtual DOM을 사용
2. jsx를 쓸 때 준수해야 할 규칙
두개 이상의 엘리먼트는 무조건 하나의 엘리먼트로 감싸져있어야 합니다
div 태그로 감싸주는 방법이 있지만 스타일 관련 설정으로 꼬일 수 있습니다.
Fragment를 사용하면 해결 할 수 있습니다. <Fragment> </Fragment> 대신 <> </> 이렇게 써도 됩니다.
import React, { Component } from 'react';
class App extends Component {
render() {
return (
/*
<div>
<div>
Hello
</div>
<div>
Bye
</div>
</div>
*/
<Fragment>
<div>
Hello
</div>
<div>
Bye
</div>
</Fragment>
);
}
}
export default App;