위치: src/ App.js 1. 리액트 컴포넌트란? - 재사용하기 위한 함수 - 컴포넌트 이름은 무조건 ★ 대문자 ★ + 카멜케이스로 짓기 2. 함수형 컴포넌트 (클래스형 컴포넌트도 있지만 주로 함수형 컴포넌트를 사용 예정) - props로 입력 받음 - 화면에 어떻게 표현되는지 React 엘리먼트를 return * 엘리먼트 : 단순히 화면에 그려지는 html적 요소라고 생각하기 * function Welcome(props){ return Hello, {props.name} } function App(){ return hello } 3. CRA 프로젝트를 컴포넌트 관점에서 해석 (1) 컴포넌트 밖 (내가 필요한 파일을 가져오는 영역) : import [패키지명] from [경로] (2) 자바스크립트 영..

1. CRA 개념 - 개발에 필수요소를 자동으로 구성하는 "완제품 구매" 느낌 - 보일러플레이트 : 신문사에서 반복되는 구간은 강철로 만들어서 찍어냄! 2. CRA 명령어로 프로젝트 생성 - VS코드 터미널에서 아래 코드 실행 yarn create react-app week-1 //프로젝트 생성 npx create-react-app my-app //이것도 프로젝트 생성 가능 ( 선택해서 사용) cd week-1 // 폴더 ( week-1 ) 로 이동 yarn start//프로젝트 시작 npm start //프로젝트 시작 (선택해서 사용) ▶ ls // 현재 내가 위치하고 있는 곳 확인 ▶ App.js 를 메인으로 사용할 예정 3. 절대경로 사용방법 (1) jsconfig.json 파일 생성 (root 경..

[ React.js 개념] : SPA(Single Page Application)기반 개발 프레임워크 : 컴포넌트 단위 (벽돌 느낌) : 비슷한 Angular.js와 Vue.js보다 인기가 많음 * SPA 프레임워크 장점 : 하나의 페이지로 구성 + 서버에 1회 리소스 요청 + 필요할때마다 '데이터' 받아서 수정= 화면 깜빡임 X 단점 : SEO (검색엔진최적화)에 약함 1. 개발환경 필수 프로그램 설치 (1) 크롬 브라우저 : https://www.google.co.kr/chrome/ (2) VS code : https://code.visualstudio.com/ (3) git 설치 : https://git-scm.com/downloads (4) Node 설치 : https://nodejs.org/en..

visual code의 터미널에서 실행시 오류 발생 1. yarn 설치 npm install -g yarn 2. yarn 설치 후 버전 확인 => 오류 발생 yarn -v [해결방법] : cmd 창에서 설치 & 버전확인하면 된다.