Front-End
Front-End | CORS (Cross Origin Resource Sharing), proxy
포스트 계기 현재 프론트엔드 + 백엔드로 구성된 팀 프로젝트를 진행하고 있는 중이다. 프론트엔드측에서는 JavaScript 프레임워크인 Vue 를 이용하여 개발을 진행 중이고 백엔드 측은 Java 언어인 Spring을 통하여 개발을 진행하는 중이다. 이 두 가지의 프레임워크를 서로 연동을 시켜주는 작업을 진행하던 도중에 결국 실제 배포 환경에서는 Vue로 작성한 코드들이 build 되어 정적인 파일로 바뀌게 되고, 요청을 받는 서버는 Spring 서버 하나가 되어야 하는 것을 알게 되었다. 그렇지만 현재 단계에서는 분명 Vue의 port번호와 Spring의 port번호는 다른 상태이고 그로 인해 CORS에 관해 학습을 진행하게 되었다. 그 과정에서 proxy, axios, fetch, build 등에 대..
Front-End | 서버 사이드 렌더링(SSR), 클라이언트 사이드 렌더링(CSR)
등장배경 모바일 기기들의 등장으로 인해 웹은 변화가 필요하였다. 데스크탑, 노트북과 비교했을 때 상대적으로 성능이 낮은 모바일 기기에서는 성능에 관한 이슈들이 거론되기 시작했고 그에 따라 SPA(Single Page web Application) 기법이 등장하게 되었으며 SPA는 클라이언트 사이드 렌더링 방식이라고 할 수 있다. Server Side Rendering 서버 사이드 렌더링 방식은 전통적인 방식으로 사용자의 행동에 의해 요청이 발생할 때마다 서버로부터 리소스를 전달받아 해석하고 화면에 렌더링 하는 방식이기 때문에 표시해야 할 데이터가 많거나 성능이 좋지 않은 기기의 경우 많은 성능 이슈가 발생할 수 있다. 장점 검색엔진에 최적화되어있다. (웹 크롤러, 봇들이 자바스크립트 파일을 실행시키지 못..