프론트엔드/react(생활코딩)
-
컴포넌트 만들기(2)프론트엔드/react(생활코딩) 2020. 1. 16. 15:08
컴포넌트의 사용 목적 중 한가지는 바로 정리 정돈 부분이다. 1. Subject 2. TOC 3. Content 아래 코드 내용은 위 3가지 컴포넌트를 각 각 생성하고, 최종적으로 App 클래스에 반영해주는 코드이다. import React, { Component } from 'react'; import './App.css'; class Subject extends Component { render() { return ( WEB world wide web! ); } } class TOC extends Component { render() { return ( HTML CSS JavaScript ); } } class Content extends Component { render() { return ( HT..
-
react 개발 환경 셋팅 (1)프론트엔드/react(생활코딩) 2020. 1. 14. 11:47
설치 부분 1. node.js 공식 사이트에서 다운로드 npm이 자동으로 설치된다. 2. cmd 에서 npm install -g create-react-app 명령어 입력 3. react 개발 앱폴더를 생성 후, cmd에서 해당 폴더로 이동 한 후에, create-react-app . 명령어 입력 (폴더명은 react라고 하면 안됨) 4. VSC에서 npm run start 명령어 입력해보면 test 사이트가 하나 뜬다. 구성 및 배포 부분 1. src/index.js 파일을 보면 아래와 같이 구성 되어 있다. import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; i..