230221 - React (리액트) 기초

오늘 내가 배운 것 1. 브라우저 렌더링 과정 2. 브라우저 렌더와 React 3. React 4. JSX 5. DOM / React / JSX를 이용한 React 문법 비교 1. 브라우저 렌더링 과정 여태까지는 화면을 꾸밀 때 `javascript`를 이용하여 HTML을 조작했다. (DOM) 브라우저 렌더링 과정 (응답을 받고 화면에 보이기 직전 시점이다.) HTML을 그릴 때 아래와 같은 과정을 거친다. 1. 응답이 오면, 응답 바디에 있는 HTML 내용을 파싱 한다. 2. 파싱 이후 트리를 만든다. 3. 표현준비를 한다. (사이즈 정렬... 등등..) 4. Render가 된다. 2. 브라우저 렌더와 React DOM을 이용하여 화면을 그리는 과정이 매우 불편하고 귀찮았다. (엘리먼트를 만들고 inn..

• format_list_bulleted 시작/TIL(Today I Learned)
• · 2023. 2. 21.
• textsms

221108 JavaScript - 이벤트 (EVENT)

오늘 내가 배운 것 1. 이벤트 (Event) 2. 이벤트 적용하기 이벤트 적용하기 1 이벤트 적용하기 2 이벤트 적용하기 3 3. 이벤트 객체 1. 이벤트 브라우저 기준으로 설명하면 렌더 된 영역에서 `click`, `mouseover`, `mouseout` 등 특정한 행동을 했을 때 특정한 함수를 호출하는 것, 브라우저에서 이미 구현해놓은 규칙에 맞게 우리가 맞춰 사용하면 된다.(DOM) 2-1. 이벤트 적용하기 1 이벤트 적용하기 1 - HTML과 JS를 이용한다. html이랑 js를 같이 써서 구현하는 방법 속성명에 on이 붙으면 대부분 EVENT이다. on + 이벤트명 : onClick / onMouseover / onMouseout 버튼 div에 style속성을 작성할 때 CSS문법에 맞춰서 ..

• format_list_bulleted 시작/TIL(Today I Learned)
• · 2022. 11. 9.
• textsms