Critical Rendering Path Critical Rendering Path는 브라우저가 웹 페이지를 렌더링하기 위해 수행하는 필수 단계를 설명하는 용어입니다. 이 과정은 HTML, CSS, JavaScript 파일을 사용자의 화면에 픽셀로 렌더링하는 데 필요한 작업을 포함합니다. 다음은 Critical Rendering Path의 주요 단계입니다: 1. HTML 다운로드와 분석: 브라우저가 HTML 파일을 다운로드하고 분석하여 DOM (Document Object Model) 트리를 생성합니다. DOM 트리는 웹 페이지의 모든 요소와 그 구조를 나타냅니다. 2. CSS 다운로드와 분석: 브라우저는 CSS 파일도 다운로드하고 분석하여 CSSOM (CSS Object Model) 트리를 생성합니다..
1. import {useState} 2. useState(보관할 자료) 3. let [작명, 작명] (Destructuring 문법이다) Destructuring이란? let [name, age] = ['Kim', 20] 그럼 각각 name = 'Kim', age = 20 이라는 변수가 생성됩니다. 귀찮게 등호여러번 쓸 필요 없이 왼쪽 오른쪽 형식을 똑같이 맞춰주시면 자동으로 알아서 변수가 생성됩니다. 이게 변수만들 때 쓰는 destructuring 문법입니다. = state는 변동사항이 생기면 state쓰는 html도 자동으로 재렌더링해준다. function App(){ let [글제목, b] = useState('남자 코트 추천'); return ( { 글제목 } ) } 남자 코트 추천을 여자 코트..
1. 작업용 폴더를 생성 (그 전에 node js가 설치되어 있는지 확인) 2. shift + 우클릭해서 여기에 PowerShell 창 열기 클릭 3. 터미널이 열리면 npx create-react-app 프로젝트명 4. vscode에서 폴더 오픈 (다른방법) 만든 폴더를 vscode로 열고 터미널에 npx create-react-app ./ (현재폴더라는 뜻) 하면 설치 끝. 5. 터미널 열어서 npm start 입력