전체 글

Proxy란?우리말로 "대리인"이라는 의미를 가지고 있다.네트워크에서 Proxy는 클라이언트와 서버 사이에 중개자로서 동작하며, 다양한 기능을 수행한다.웹 서비스에서 Proxy는 보안, 캐싱, 트래픽 분산 등의 중요한 역할을 한다. 서버 부하 완화 및 보안(요청/응답 변조)을 위한 ProxyProxy 서버는 웹 환경에서 부하를 줄이고 보안을 강화하기 위해 클라이언트와 서버 사이에 위치하는 중요한 도구이다.Proxy는 주로 클라이언트 측의 Foward Proxy와 서버 측의 Reverse Proxy로 나뉜다. https://www.youtube.com/watch?app=desktop&v=4NB0NDtOwIQ참조 영상: Proxy vs Reverse Proxy (Real-world Examples) (You..

Cache 동작의 핵심은 재검증 주기와 재검증 기준 주기와 검증 주기와 검증 주기와 검증 주기와 검증 주기와 검증  HTTP Cache는 웹 성능 최적화에 중요한 역할을 하지만, 실시간 데이터를 정확하게 반영하지는 않는다. 예를 들어, 은행 계좌 잔고처럼 실시간으로 변동되는 데이터의 경우, 캐시를 통해 잘못된 정보가 제공 될 수 있다. 만약 100만 원이 캐시되어 있는 상태에서 돈을 계속 사용하면, 실제 잔고가 -500만 원이 되어도 캐시가 갱신되지 않는 한 100만원 만 보일 수 있다.이러한 이유로 실시간성이 중요한 데이터에는 캐시 사용을 신중하게 고려해야 한다.캐시의 준실시간성 보장 캐시는 임시(반영구적)저장을 위한 전략이다. 그러나 실시간성을 아예 포기한다는 것이 아니라, 재검증(revalidate..

웹 성능 개선을 위한 HTTP Cache웹 페이지 로딩 시간을 단축하는 것은 웹 성능 최적화의 핵심이다. 여기서 중요한 역할을 하는 것이 바로 HTTP Cache.웹은 클라이언트가 서버에 요청을 보내고 그 결과를 받는 것이다. 이 때  웹 브라우저는 매번 웹 서버에게 요청해서 응답을 받아야하고 웹 서버는 매번 웹 브라우저의 요청에 대한 응답을 만들고 반환해야한다. 이 과정을 반복하면 서버에 부하를 가져올 수 있다. 이렇기에 HTTP Cache를 활용하면 서버와 클라이언트 부하를 모두 줄이고 웹 페이지 속도를 개선 할 수있다. 오늘은 HTTP Cache에 대해 포스팅하고자 한다.웹 브라우저는 매번 웹 서버에 요청을 보내고 서버는 그 요청에 따라 결과를 생성하여 반환한다. 이 과정은 시간과 리소스가 많이 소..

로드 밸런싱은 대규포 트래픽 처리의 핵심 기술이다. 서버에 가해지는 부하를 분산시켜 서비스의 안정성과 성능을 유지하는 역할을 한다. 로드밸런싱이란? 로드 밸런싱은 들어오는 네트워크 트래픽을 여러 서버에 분산하여 단일 서버에 과부하가 걸리지 않도록 하는 기술이다.   로드밸런스가 등장한 이유트래픽 이슈: 서버수를 늘린다.(수평적 확장)안정적인 배포를 위한 필요성:새로운 서버에 배포하는 경우: 새로운 서버에 애플리케이션을 배포하면 IP가 변경될 수 있다. 이러한 경우 로드 밸런서를 사용하여 고정 IP를 부여하면, 클라이언트는 IP 변경을 인지하지 않고 서비스를 이용할 수 있다.기존 서버에 배포하는 경우: 기존 서버에 새 버전을 배포하면서 서버를 재시작해야 하는 상황이 발생할 수 있다. 이때, 로드 밸런서는 ..

API 설계: 클라이언트가 필요로 하는 데이터를 효율적으로 반환하기API는 클라이언트가 서버와 소통하는 인터페이스로, 클라이언트가 원하는 데이터를 어떻게 효과적으로 잘 반환할지 결정하는 것이 중요하다.어떻게 반환할 것인가: API 설계 방법론REST, GraphQL 등 다양한 API 설계 방식이 있으며, 각각의 방식이 데이터 요청과 반환을 다르게 처리한다.잘 반환하기: 속도와 가용성 최적화속도: 빠른 응답을 위해 캐시 도입, 데이터베이스 최적화, 쿼리 성능 개선 등을 고려한다.가용성: MSA(마이크로서비스 아키텍처)와 ELB(로드밸런싱) 등의 기술을 통해 시스템의 안정성과 확장성을 보장한다.데이터 관리: 백엔드의 핵심 역할 백엔드 개발의 주요 목표 중 하나는 데이터를 효율적으로 저장하고 관리하는 것이다...

자바스크립트 프레임워크와 웹 개발의 진화 웹 개발은 빠르게 발전하며, 자바스크립트 프레임워크와 도구들이 등장해 개발자들이 복잡한 애플리케이션을 더 쉽게 관리할 수 있도록 도와주고 있다. 이번 글에서는 자바스크립트 프레임워크의 동작 원리부터 CSS 개발, 그리고 다양한 렌더링 방식에 이르기까지 현대 웹 개발의 주요 개념들을 정리해보겠다. 자바스크립트 프레임워크 동작 원리 라이브러리와 프레임워크는 자바스크립트 개발의 핵심 요소로, 각기 다른 목적을 가지고 있다.라이브러리는 특정 기능을 수행하기 위해 단일 파일로 제공되는 코드 집합이다. 예를 들어, jQuery는 DOM 조작에 특화된 라이브러리다.프레임워크는 여러 라이브러리를 포함한 종합적인 개발 환경을 제공하며, 다양한 목적을 위해 사용된다. 대표적으로 R..

자바스크립트 런타임과 엔진: 웹과 서버에서의 동작 원리 자바스크립트는 웹과 서버 양쪽에서 중요한 역할을 하는 언어다. 자바스크립트가 어떻게 실행되는지를 이해하기 위해서는 자바스크립트 런타임과 자바스크립트 엔진의 개념을 알아야 한다. 자바스크트 런타임: 엔진과 API 자바스크립트 런타임은 자바스크립트 코드가 실행되는 환경을 말하며, 크게 자바스크립트 엔진과 API(라이브러리 및 바이너리)로 구성된다. 자바스크립트 런타임은 자바스크립트 코드를 기계어로 변환하고 실행하는 역할을 하며, 이 과정에서 필요한 API와 라이브러리를 함께 제공한다.자바스크립트 엔진: 자바스크립트 코드를 읽고, 이를 기계어로 변환하여 실행하는 역할을 한다. 예를 들어, 구글 크롬의 V8 엔진이 대표적인 자바스크립트 엔진이다.JS Eng..

프론트엔드 웹 개발 : Rendering = 웹 페이지의 화면 변경웹 페이지 화면 변경: Javascript를 통한 HTML(DOM) 직접 조작 → Hard to Manage, 반복적인 Rendering ProcessjQuery 등장: Javascript 통한 DOM 조작을 쉽게 돕는 라이브러리과거에는 웹 브라우저 간 자바스크립트 엔진이 서로 달랐기 때문에, 동일한 자바스크립트를 사용해도 브라우저마다 동작이 다를 수 있었다. 이러한 호환성 문제를 해결하기 위해 jQuery가 등장했다.크로스브라우저 지원: jQuery는 다양한 웹 브라우저에서 동일하게 작동하는 코드를 제공하는 라이브러리다. 이를 통해 브라우저 간 호환성을 쉽게 유지할 수 있다.주요 기능:DOM 요소 선택: getElementById와 같은..