Web/React 2

React에서 Bootstrap UI 사용하기

Bootstrap UI 설치하기 프로젝트 생성 후, 프로젝트 폴더로 이동하여 아래 명령어로 bootstrap 설치 npm install react-bootstrap bootstrap 사용하려는 js 파일의 제일 상단에 입력하여 사용 준비 import 'bootstrap/dist/css/bootstrap.min.css'; Bootstrap 사용 예시 아래와 같이 입력하면, 손쉽게 예쁜 화면을 만들수 있습니다. 더보기 import logo from './logo.svg'; import 'bootstrap/dist/css/bootstrap.min.css'; import { Container, Button, Row, Col, Card, Navbar } from 'react-bootstrap'; function ..

Web/React 2021.12.07

React 기초

React React는 front-end 코드를 구조화에 중점을 둔 라이브러리입니다. JSX를 이용하여 JS를 확장한 문법을 사용하며, 작은 단위의 컴포넌트를 재사용하는데 최적화 되어 있습니다. Angular에 비하여, 상대적으로 단순합니다. React 기본 구조 React 기본에 대해서는 이곳에서 잘 알려주므로 여기 참고하세요 https://react.vlpt.us/basic/ 함수형 컴포넌트 컴포넌트는 연관있는 함수 변수등을 모아놓은 객체인데, 가장 비슷한 것은 클래스입니다. 함수형 컴포넌트는 클래스 보다 짧고 직관적인 코드 작성이 가능하다고 합니다(저는 클래스가 익숙해서인지 클래스가 편하든데). HOOK 함수형 컴포넌트의 가장 큰 단점이 생명주기를 관리하는 함수가 없다는 점입니다. 생명주기란 예를 ..

Web/React 2021.12.05