rosie

HTTP(HyperText Transfer Protocol)와 HTTPS(HyperText Transfer Protocol Secure)는 웹에서 데이터를 전송하는 데 사용되는 두 가지 주요 프로토콜임 ❓보안 HTTP - 암호화되지 않은 텍스트 형식으로 데이터를 전송함 - 이로 인해 중간자 공격(Man-in-the-Middle Attack)이나 데이터 도청(eavesdropping)에 취약함 HTTPS - SSL/TLS 프로토콜을 사용하여 데이터를 암호화하고 전송함 - 이로 인해 데이터의 기밀성과 무결성이 보장됨 ❓포토 번호 HTTP - 기본 포트 번호는 80임 HTTPS - 기본 포트 번호는 443임 ❓SSL/TLS 인증서 HTTP - 인증서를 필요로 하지 않음 HTTPS - SSL/TLS 인증서를 필..

❓TCP(Transmission Control Protocol) - 연결 지향적 TCP는 데이터 전송 전에 연결을 설정하고, 데이터 전송 후 연결을 종료함 이렇게 하는 것은 신뢰성 있는 데이터 전송을 보장하기 위함 - 신뢰성 TCP는 패킷의 손실, 순서 변경, 중복 등의 문제를 처리하기 위한 메커니즘이 있음 손실된 패킷은 재전송됨 - 흐름 제어 수신자의 버퍼 오버플로우를 방지하기위해 흐름 제어 메커니즘을 제공함 - 혼잡 제어 네트워크 내의 혼잡을 관리하고 효율적인 데이터 전송을 위해 메커니즘을 제공함 - 사용 사례 웹 브라우징, 이메일 전송, 파일 전송 등 신뢰성이 중요한 애플리케이션에서 주로 사용됨 ❓UDP(User Datagram Protocol) - 연결 비지향적 UDP는 연결 설정 없이 데이터를 ..

❓클라이언트 사이드 렌더링(CSR) 개념 - 이 방식에서는 서버는 초기 페이지 로딩 시에 빈 페이지나 매우 기본적인 틀만 전송하며, 필요한 데이터나 나머지 페이지 내용은 클라이언트(브라우저)에서 JavaScript를 사용해 렌더링함 장점 - 동적 상호작용: CSR 방식은 사용자와의 상호작용에 반응적인 웹 애플리케이션을 만들기 좋음 - 서버 부하 감소: 서버는 렌더링에 관한 작업을 클라이언트에게 위임하기 때문에 부하가 줄어듬 - SPA(Single Page Application)에서 효과적임 단점 - 초기 로딩 시간: 전체 애플리케이션 코드와 데이터를 로드해야 하기 때문에 초기 로딩 시간이 길어질 수 있음 - SEO 문제: 크롤러가 JavaScript로 렌더링되는 페이지를 올바르게 인식하지 못할 경우, S..

❓쿠키(Cookie) 개념 - 클라이언트 측에 저장되는 작은 텍스트 파일로, 이름 - 값의 쌍으로 구성됨 용도 - 세션 관리, 사용자 선호 설정, 트래킹 등의 목적으로 사용됨 제한 - 크기 제한 (약 4KB), 보안에 취약, 쿠키가 너무 많거나 크기가 너무 크면 웹사이트의 성능에 영향을 줄 수 있음 만료 - 설정된 만료 기간이 잇으며, 만료 기간이 없는 경우 브라우저 세션 종료시 작제됨 ❓세션(Session) 개념 - 서버 측에 저장되는 사용자 정보로, 일반저긍로 브라우저가 종료되기 전까지 서버에 유지됨 용도 - 사용자 인증, 임시 데이터 저장 등에 사용됨 - 일반적으로 쿠키를 사용하여 세선 ID를 클라이언트에 저장하고, 이를 통해 서버에서 해당 사용자의 세션 데이터를 참조 제한 - 서버의 메모리를 사용..

❓GET 개념 - GET은 주로 서버에서 데이터를 조회하기 위해 사용됨 데이터 흐름 - 사용자(클라이언트)가 웹 브라우저 주소창에 URL과 함께 쿼리스트링 형태로 파라미터를 입력하거나, 웹 페이지의 링크를 클릭함 - 이 요청이 웹 서버에 도달하면, 서버는 해당 요청을 해석하여 필요한 데이터나 페이지를 찾음 - 서버는 이 데이터나 페이지 정보를 응답으로 클라이언트에게 전송 - 클라이언트는 받은 응답을 웹 브라우저에 렌더링하여 사용자에게 보여줌 ❓POST 개념 - POST는 서버에 데이터를 제출하기 위해 사용 ex) 웹 폼을 통한 회원가입이나 글 작성 시 사용됨 데이터 흐름 - 사용자가 웹 폼에 데이터를 입력하고 제출 버튼을 클릭하면 이 데이터는 요청 본문에 포함되어 서버로 전송됨 - 웹 브라우저는 이 데이..

❓목적 - GET 데이터를 가져와서 보여주는 것에 초점을 맞춤 주로 데이터를 조회할 때 사용 - POST 서버에 데이터를 제출하여 저장, 업데이트, 처리하는 데 사용함 ❓데이터 전송위치 - GET 데이터가 URL의일부로 전송됨 ex) http://example.com/page?name=rose&age=26 - POST 데이터가 요청 본문에 포함되어 전송됨 URL에 직접적으로 보이지 않음 ❓데이터 길이 - GET URL에 데이터가 첨부되므로, 길이에 제한이 있음 대부분의 웹 브라우저나 서버에서 URL길이에 제한을 둠 - POST 데이터 길이에 별다른 제한이 없음(서버의 설정에 따라선 제한이 될 수 있음) ❓보안 - GET URL에 데이터가 첨부되므로, 민감한 정보(비밀번호 등)를 전송하는 것은 안전하지 ..

ⅰ. 요청 및 응답 - 사용자가 URL을 입력하면 브라우저는 해당 웹 서버에 HTTP 요청을 보냄 - 서버는 요청을 처리하고, HTML, CSS, JavaScript, 이미지 등의 리소스를 포함한 응답을 브라우저에 전송함 ⅱ. HTML 파싱 - 브라우저는 받은 HTML문서를 파싱하여 DOM(Document Object Model)트리를 구축함 - 이 DOM 트리는 웹 페이지의 구조화된 표현 ⅲ. CSS 파싱 - CSS는 파싱되어 CSSOM (CSS Object Model)트리를 생성함 - CSSOM은 웹 페이지의 스타일 정보를 포함하고 있음 ⅳ. 렌더 트리 생성 - DOM과 CSSOM 트리는 결합되어 렌더 트리를 형성함 - 이 트리는 페이지의 시각적 표현을 나타내며, 화면에 표시될 요소와 그 요소의 스..

❓동기와 비동기의 차이 1. 동기(Synchronous) - 동기식 실행은 한 작업이 완료될 때까지 다음 작업이 기다려야 하는 실행 방식을 말함 - 코드의 실행 순서와 결과가 예측하기 쉽다는 장점이 있지만, 한 작업이 많은 시간을 요구하면 그 동안 전체 시스템이 대기 상태에 있어야함 2. 비동기(Asynchronous) - 비동기식 실행은 현재 작업의 완료 여부와 상관없이 다음 작업을 시작하는 실행 방식을 말함 - 여러 작업을 동시에 처리할 수 있어 효율적이지만 코드의 실행 순서와 결과가 복잡해질 수 있으며 동기화 문제가 발생할 수 있음 ❓비동기 프로그래밍의 필요성 - 효율성: 특히 I/O 바운드 작업(ex. 네트워크 통신, 디스크 작업)에서 대기 시간이 많을 때, 이 대기 시간 동안 다른 작업을 수행함..

❓JavaScript의 호이스팅이란? - 호이스팅(Hoisting)은 JavaScript에서의 중요한 메카니즘으로 코드 실행 전 함수와 변수이 선언을 메모리에 저장하는 과정 - JavaScript에서 변수와 함수의 선언을 그들이 코드 상에 작성된 위치와 상관 없이 스코프의 최상단으로 끌어올리는 특성을 지칭함 ❔호이스팅이 발생하는 이유 - 호이스팅은 JavaScript의 실행 컨텍스트(Execution Context) 생성 과정 중 하나로 인해 발생 - JavaScript는 코드 실행 전에 컴파일 단계에서 변수와 함수 선언을 먼저 메모리에 저장함 -> 변수나 함수를 선언하기 전에도 사용할 수 있게 됨 1. 함수 - 함수 전체가 메모리에 저장됨 -> 함수 선언 전에 호출이 가능해지는 이유 2. 변수 - va..

- 무한 스크롤 기능을 구현할 때 많은 데이터를 다루는 경우 고려해야할 중요한 점! ❗️효율적인 데이터 로딩 - 사용자가 스크롤을 할 때마다 모든 10,000개의 데이터를 한 번에 로딩하는 것은 비효율적입니다. 대신, 한 번에 적은 양의 데이터만 로딩하고, 사용자가 끝에 도달할 때마다 추가 데이터를 로딩하는 방식을 채택해야함 - 서버와 클라이언트 사이의 통신에서 페이징 기법을 사용하여 한 번에 로딩되는 데이터의 양을 제한 할 수 있습니다. ❗️DOM 최적화 - 10,000개의 항목을 모두 DOM에 추가하면 브라우저의 성능 저하가 발생할 수 있음 - 가상 스크롤 기법을 사용하여 화면에 보이는 부분만 실제로 DOM에 렌더링하고, 나머지는 메모리에 보관하는 방식으로 최적화할 수 있음 ❗️스크롤 위치 유지 - ..