Web&Networt (4) 썸네일형 리스트형 [Etc] ☁️ 네이버 클라우드 NCA 자격증 합격 후기 & 공부 방법 🌱 왜 프론트엔드 개발자가 NCA 자격증을 준비하게 되었나? 최근 프로젝트를 진행하면서 인프라와 클라우드 환경에 대한 이해가 부족하면 프론트엔드 개발을 할 때도 시야가 좁아진다는 것을 많이 느꼈다. 배포 프로세스를 이해하고, 네트워크 구조나 로드밸런서의 동작 방식을 아는 것이 결국 더 탄탄한 웹 서비스를 만드는 밑바탕이 되기 때문이다. 그래서 국내에서 가장 많이 쓰이는 클라우드 서비스 중 하나인 네이버 클라우드 플랫폼(NCP)의 기초 자격증인 NCA(NAVER Cloud Certified Associate)에 도전하게 되었다. 지난 4월 말에 감사하게도 합격 배지를 받게 되었고, 내친김에 다음 단계인 NCP(Professional)까지 준비해보려고 한다. 이번 포스팅에서는 내가 NCA를 준비하면서 활용.. [Web] SSG, ISR의 개념과 차이점 1. SSG SSG는 Static Site Generation의 약자로, 정적인 웹사이트를 만들 때 사용한다. SSR과 똑같이 서버에서 렌더링 하지만 렌더링 되는 시기가 SSR과 다르다. SSG는 서버에 배포한 후, 빌드할 때 렌더링(html 코드로 변환됨)된다. 실제 html 파일들은 빌드할 때 미리 만들어 둔다고 생각하면 된다. 1) SSG Rendering 방식 서버에 배포 한 후 빌드시 렌더링이 일어나면서 html 파일이 생성된다. 이후 사용자가 홈페이지에 접속하면, 클라이언트가 서버에 요청을 보내고 서버는 만들어준 html 파일을 보내준다. 클라이언트는 받은 데이터를 통해 html을 표기해 준다. 2) 장점 ① 페이지 로딩 시간(Time To View)이 짧다 ② 자바스크립트 필요 없음 ③ SE.. [Web] CSR, SSR의 개념과 차이점 렌더링 방식에는 CSR, SSR, SSG, ISR처럼 다양한 방법이 존재한다. 어떻게 렌더링하냐에 따라 웹 사이트의 성능이 달라지기 때문에 각 사이트에 맞는 렌더링 방식을 사용해야 한다. 따라서 이번엔 각 렌더링 방식의 개념과 차이점에 대해 알아보려 한다. 우선 CSR과 SSR에 대해서 알아보자. 브라우저 엔진은 html 구문을 해석해 DOM tree를 수정하고, CSSOM 스타일링 객체를 구성한다. 그리고 여러 과정을 통해 화면에 코드를 그려낸다. 이때 html 구문을 서버와 클라이언트 중 누가 가져오냐에 따라 CSR과 SSR이 나눠진다. 말 그대로 어느 Side에서 렌더링을 하냐에 따라 나뉜다고 생각하면 된다. 1. CSR CSR은 Client Side Rendering의 약자로, 렌더링의 주체자가 .. [Web] 웹 브라우저 렌더링(Rendering)이란? next.js를 공부하다가 웹 브라우저 렌더링 방식에 대해 제대로 이해할 필요가 있음을 느꼈다. 따라서 렌더링이 무엇인지부터 차근차근 블로그에 정리해보려 한다. 1. 렌더링(Rendering) 렌더링은 웹사이트가 그려지는 과정을 의미한다. 웹 브라우저에는 자바스크립트 코드를 읽어와 기능을 작동시키는 자바스크립트 엔진과 사용자가 볼 화면을 그려내는 렌더링 엔진, 두 가지가 들어가 있다. 렌더링 엔진은 HTML, CSS, Javascript 세 가지 언어를 통해 웹사이트의 소스코드를 읽어와 실시간으로 화면을 그려낸다. 모든 웹 브라우저에는 렌더링 엔진을 가지고 있으며, 우리가 가장 많이 사용하고 있는 크롬이나 엣지는 크롬의 Blink(블링크) 렌더링 엔진을 사용하고 있다. 2. 렌더링(Rendering) 순.. 이전 1 다음
