프론트엔드 모의면접 질문 정리 + 후기

하 질문을 받자마자 머리가 새하얘져서 아무말이나 했다..입다물고 들어온 문으로 그대로 나가버려 그냥 일단 울자!!! 으허어헝 그래 지금이라도 충격받고 면접 공부 열심히 해야하겠다 오늘 받은 질문 정리 상태 관리를 왜 하고, 평소에 상태 관리를 어떻게 하나요?요약 ) 리액트에서 상태의 역할, 리렌더링, useState  리액트에서 상태 관리는 애플리케이션 UI와 데이터의 동기화를 유지하는데 중요한 역할을 합니다리액트에서는 기존 상태와 변경된 상태를 버추얼 돔을 통해 비교하고 실제 dom에 반영되어 리렌더링이 발생하게 됩니다 저는 가장 기본적으로 useState를 통해 상태관리를 합니다리렌더링의 조건에는 state가 변경이 되거나, props가 변경이되었을 때 리렌더링이 발생하게 됩니다 하지만 useSta..

• format_list_bulleted FrontEnd ✨/CS
• · 2024. 8. 1.
• textsms

[CS] 개발하며 한번쯤은 만나는 CORS 오류 원인과 해결 방법 정리

CORS (Cross Origin Resource Sharing) : 교차 출처 리소스 공유CORS는 서로 다른 출처(origin) 간에 자원을 공유할 수 있도록 해주는 보안 매커니즘이다. 기본적으로 브라우저에서는 보안을 위해 같은 출처에서만 자원 공유를 허용한다 (= SOP)따라서 CORS 오류는 다른 Origin으로 리소스를 요청했을 때 발생한다. 다른 도메인으로 요청을 보내면 cross-origin HTTP 요청에 의해 요청 되며, 요청 헤더에 Origin 필드를 추가한다하지만 대부분의 브라우저들은 보안상의 이유로 cross-origin 요청을 제한한다 이때 SOP로 인한 보안상의 이유가 원인이다. SOP (Same Origin Policy) : 동일 출처 정책해당 정책은 브라우저의 기본 보안 정책..

• format_list_bulleted FrontEnd ✨/CS
• · 2024. 7. 25.
• textsms

브라우저 렌더링(Critical Rendering path)과 리액트 렌더링(React Rendering)

브라우저 렌더링 과정 (Critical Rendering path)critial rendering path는 브라우저에서 화면이 보여질 때까지의 과정을 말한다브라우저에서 html의 문서를 다운로드 후, 페이지를 렌더링 하기까지의 과정을 살펴보자 크게 4가지 과정으로 이루어진다1. DOM +CSSOM 트리 생성2. Render 트리 생성 3. Layout4. Painting 1. DOM + CSSOM 생성 (브라우저 렌더링 엔진이 파싱)브라우저 렌더링 엔진이 html 문서를 파싱하여, 해석하기 위한 노드 객체로 변환된 객체 트리인 DOM 트리를 생성한다 CSS도 마찬가지로 파싱하여 CSSOM 트리를 생성한다DOM (Document Object Model)CSSOM (CSS Object Model)  2. ..

• format_list_bulleted FrontEnd ✨/CS
• · 2024. 5. 15.
• textsms