본문 바로가기

React

(22)
[React] 컴포넌트, index.html, index.jsx, jsx 특징, React 실행방식 1.Components 1). 특징 (1). Html, css, js 가 합쳐져 UI 한 부분을 규정하고 조정 (2). UI를 관리하기 쉽도록 작게 분해하여 UI의 다른 위치에도 사용할 수 있게 해줌 (3). 비슷한 코드가 한곳에 저장됨 (한 파일에 js, html,css 같이 작성 가능) (4). 디자인과 개발 원칙을 따름 (5). 커스텀 컴포넌트는 실제로 렌더링 된 DOM에 나타나지 않음 기본 HTML요소만 존재 (6). 컴포넌트 트리는 리액트가 분석하고, 리액트는 모든 컴포넌트에서 나온 모든 JSX코드를 결합하여 전반적인 DOM을 생성(화면에 보이는 요소) 2). 규칙 (1). 함수의 제목이 대문자로 시작해야함 - div, image와 같은 내장요소는 소문자로 시작, 리액트에게 내장된 컴포넌트가 아..
[React] React에 대한 짧은 개요 1. react 1). 사용자 인터페이스 구축을 위한 자바스크립트 라이브러리 2. 왜 react를 쓰는걸까? 1). Js VS React (1). Js - 명령형 코드 - 거쳐야 할 단계를 정의 (2). React - 선언형 코드 - 목표로 하는 UI 상태를 정의 - 자바스크립트로 UI를 업데이트 - 만든 컴포넌트를 재사용할 수 있어 js 에 비해 상대적으로 코드의 양이 적음 2. React 프로젝트의 초기 설정이 필요한 이유 1). 리액트 코드는 브라우저가 인식하지 못함. (1). jsx코드를 js로 변환시키는 작업이 필요함 -> 그렇기 때문에 js와 달리 간단하게 사용할 수 없음. (2) . 또한 리액트 코드를 최적화 시켜야 함 ex) 변수, 함수 이름 최소화, 과도한 여백 줄이기, -> 웹사이트 방..