Web (4) 썸네일형 리스트형 브라우저 주소창에 google.com을 입력했을 때 어떤 일이 일어날까? 📚 공부하게 된 계기 어느 날 브라우저 주소창에 google.com을 입력했을 때 어떤 일이 일어나는지에 대해 설명할 수 있냐는 질문을 받았고 나는 이 질문에 대해 명확하게 대답하기 위해 어떤 일이 일어나는지 찾아보게 되었다. 🐌 브라우저의 렌더링 동작 과정 위 그림은 브라우저의 렌더링 과정을 간단하게 나타낸 그림이다. 간단하게 설명해 보자면, 우리가 google.com이라고 검색했을 때 해당주소로 리소스 요청이 전송된다. 그러고 나서 서버는 루트 폴더에 존재하는 정적 파일인 index.html 파일로 응답을 한다. 응답받은 HTML 파일은 각 단계(Parsing -> Style -> Layout -> Paint -> Composite)를 거치며 우리가 알고 있는 모습으로 웹 브라우저에 거치게 되는데 단.. REST API 과 GraphQL API 어떤 차이가 있을까? 📚 공부하게 된 계기 이번에 프로젝트를 하다가 GraphQL을 처음 접했는데 처음엔 이게 뭔가 싶어서 공식문서와 강의들을 찾아보며 익히다가 내가 지금까지 써왔던 REST API와 비교해 보게 되었다. 먼저, 두 개를 비교하기 전에 API의 정확한 의미를 짚고 넘어가자! 🎮 API (Application Programming Interface) API는 약자인데 이 세단어가 무슨 조합이지? 싶었다.. 한국어로 풀이된 말을 보니 두 소프트웨어 구성 요소가 서로 통신할 수 있게 만드는 메커니즘이다. 라고 되어있다. 🖥️ REST API REST API에 대해 간단하게 알아보자! REST는 HTTP를 기반으로 클라이언트가 서버의 리소스에 접근하는 방식을 규정한 아키텍처이다. 따라서 REST API는 REST를 .. [Web] HTTP (1) - HTTP의 개념, 특징 🖥 HTTP ( Hyper Text Transfer Protocol ) HTTP라는 용어의 뜻부터 살펴보자 HTTP는 HyperText Transfer Protocol의 약자로 말 그대로 번역하자면 하이퍼텍스트를 변환시켜주는 프로토콜이다 라고 해석해볼 수 있겠다. 그렇다면 HyperText는 뭘까? 간단하게 문서라고 생각하면 편한데, 이 문서가 HTML이 될 수도 있고, 이미지가 될 수도 있고, 음성이나 영상 등.. 다양한 데이터가 될 수 있다. 그렇다면 Protocol은 무슨 뜻이지? 프로토콜은 컴퓨터 내부에서, 또는 컴퓨터 사이에서 데이터의 교환 방식을 정의하는 규칙이다. 정리해보자면 문서를 컴퓨터가 알아먹을 수 있도록 변환시켜주는 규칙이라고 정의할 수 있겠다. 📟 HTTP의 특징 HTTP의 특징은.. [Web] 웹팩이란? (1) - 웹팩의 4가지 속성, Mode 😮 웹팩 ? 웹팩이 뭐야 프론트엔드 면접 단골 질문에 있는 "웹팩이 무엇인지"에 대해 잘 답변하기 위해 정리해본다. 📃 웹팩 공식 문서에 따르면 webpack은 자바스크립트를 위한 정적 모듈 번들러이다. 모듈은 무엇을 의미하는 걸까? - 모듈이란 프로그래밍 관점에서 특정 기능을 갖는 작은 코드 단위를 의미한다. 예를 들면 js코드에서 쓰는 함수라고 생각하면 편하다. 그렇다면 모듈 번들링이 뭐지? - 웹 애플리케이션을 구성하는 몇십, 몇백 개의 자원들을 하나의 파일로 병합 및 압축해주는 동작을 모듈 번들링이라고 한다. 정리하자면 하나의 웹 서비스를 구성하는 자바스크립트 파일, jps 파일 파일들의 연관 관계를 파악해서 하나로 합쳐주겠다! 라는게 웹팩의 역할이다. 😎 웹팩이 왜 필요할까 ? 웹팩의 등장 웹팩.. 이전 1 다음
