본문 바로가기
728x90
반응형
SMALL

분류 전체보기136

브라우저 저장소(local storage, session storage, cookie) 브라우저 저장소란? 브라우저 저장소는 웹 애플리케이션에서 데이터를 저장하기 위한 방법으로, 주로 사용자의 프로필 정보, 로그인 상태, 사용자 환경 설정 등을 저장하고 유지하는 데 사용된다. 브라우저 저장소는 HTML5부터 지원되며, JavaScript를 사용하여 사용자의 로컬 브라우저에 데이터를 저장할 수 있다. 대표적으로 로컬 스토리지, 세션 스토리지, 쿠키가 있다. 로컬 스토리지(Local Storage) 일반적으로 키-값 쌍으로 구조화된 방식으로 데이터를 저장한다. 로컬 스토리지는 브라우저 내부에 데이터를 저장할 수 있는 영구 저장소다. 데이터는 클라이언트 측 컴퓨터에 저장되며 데이터를 수동으로 지우지 않는 이상 영구적으로 보관이 가능하다. 사용자가 웹 사이트를 나가더라도 데이터가 유지된다. 저장된.. 2023. 3. 31.
this 가 동작하는 원리와 용법 This JavaScript에서 this는 실행 중인 함수의 컨텍스트를 참조하는데 사용되는 특수한 키워드다. function 키워드로 생성한 일반 함수와 화살표 함수의 가장 큰 차이점은 this이다. 일반 함수의 this 자바스크립트의 경우, 함수 호출 방식에 의해 this에 바인딩할 어떤 객체가 동적으로 결정된다. 즉, 함수를 호출할 때 함수가 어떻게 호출되었는지에 따라 값이 달라진다는 것이다. 함수의 호출하는 방식 함수 호출 메소드 호출 생성자 함수 호출 apply/call/bind 호출 var foo = function () { console.dir(this); }; // 1. 함수 호출 foo(); // window // window.foo(); // 2. 메소드 호출 var obj = { foo.. 2023. 3. 31.
position - static, relative, absolute, fixed, sticky position은? "position"은 HTML과 CSS에서 사용되는 속성(property) 중 하나로, 요소(element)의 위치를 설정하거나 가져오는 데 사용된다. 요소의 위치는 웹 페이지의 레이아웃(layout)을 구성하는 데 중요한 역할을 한다. CSS에서 "position" 속성은 5가지 값으로 설정할 수 있다. 값을 설정할 때, "top", "bottom", "left", "right" 속성을 사용하여 요소의 위치를 상세히 지정할 수 있다. position의 5가지 속성 1. static 요소의 위치를 일반적인 문서 흐름에 따라 자동으로 배치한다. 이는 기본값이다. top, right, bottom, left, z-index 속성이 아무런 영향도 주지 않는다. https://codepen... 2023. 3. 30.
[Web] HTTP와 HTTP 메시지 구조 HTTP란? HTTP는 HyperText Transfer Protocol(하이퍼텍스트 전송 프로토콜)의 약자로, HTML과 같은 하이퍼미디어 문서를 전송하기 위한 애플리케이션 레이어 프로토콜이다. 즉, 인터넷에서 데이터를 주고 받는 데 사용되는 프로토콜이다. HTTP는 클라이언트와 서버 간에 데이터를 전송하고 웹페이지, 이미지, 비디오, 오디오 등을 요청하고 전송하기 위해 사용된다. HTTP는 TCP/IP 프로토콜을 기반으로 하며, 보통 80번 포트를 사용한다. 클라이언트는 HTTP 요청을 서버에 보내고, 서버는 이 요청에 대한 응답을 보낸다. HTTP 요청과 응답에는 여러 가지 종류가 있으며, 가장 흔한 종류는 GET 요청과 200 OK 응답이다. HTTP는 무상태(Stateless) 프로토콜이다. 이.. 2023. 3. 30.
캐시(Cache) 캐시(Cache)란? 캐시(Cache)는 시스템의 성능을 향상시키기 위해 데이터나 값을 미리 저장해 놓는 임시 저장소다. 캐시는 원래 데이터를 접근하는 시간이 오래 걸리거나, 값을 다시 계산하는 시간을 절약하고 싶을 때 사용한다. 특히 웹 서비스에서는 사용하는 이미지, CSS 및 자바스크립트 파일을 매번 네트워크를 통해 불러오지 않고 최초에만 다운로드하여 캐시에 저장해 두고, 그 이후 요청때 저장해 둔 파일을 사용할 때 유용하다. 캐시의 궁극적인 목표 불필요한 데이터 전송을 줄여, 네트워크 요금 비용을 줄여준다. 네트워크 병목을 줄여준다. 원 서버(origin server)에 대한 요청을 줄여주어, 더 빨리 응답할 수 있게 된다. 거리로 인한 지연을 줄여준다. 캐시의 종류 캐시 종류 설명 웹 캐시(Web.. 2023. 3. 29.
프레임워크 vs 라이브러리 프레임워크란? 원하는 기능 구현에 집중하여 개발할 수 있도록 일정한 형태와 필요한 기능을 갖추고 있는 골격, 뼈대를 의미한다. 프레임워크는 애플리케이션의 설계도를 제공하는 프로그램의 골격들이지 완성된 제품은 아니다. 결과적으로 프레임워크는 애플리케이션의 기본 바탕을 제공해 주면서 개발자들에게 어디를 수정해서 사용해서 쓸지를 알려주는 것이라고 할 수 있다. 그래서 프레임워크 자체가 소프트웨어 개발의 업무 흐름을 정의하고 있으며 개발자들에게 무엇이 필요한지 알려주고 필요한 경우 개발자들의 코드를 호출하여 사용하는 구조다. 프레임워크를 사용하는 이유 적은 코드 길이 코드 재사용 쉬운 디버깅과 애플리케이션 모니터링 단순화된 DB 연결 향상된 보안 대표적인 프레임워크 Angular Angular 는 싱글 페이지 .. 2023. 3. 29.
728x90
반응형
LIST

티스토리툴바