코딩 기초 용어 정리(1)
서버(Server) VS 클라이언트(Client)
서버(Server) : 정보들을 저장, 전송 등 특정 작업을 하는 것을 의미한다.
다른 컴퓨터(들)에게 무언가를 해 주는 '컴퓨터'를 의미한다.
클라이언트(Client) : 서비스를 받는 것을 의미한다.
어떤 컴퓨터든 서버로 사용 가능하지만, 비용 등 여러 문제로 인해 IDC의 서버 또는 클라우드를 사용한다.
HTML, CSS, JavaScript
HTML로 화면에 요소들을 배치하고, CSS로 각 요소들에 디자인을 적용한 후, JavaScript로 기능을 부여한다.
크로스 브라우징(Cross Browsing)
다양한 웹브라우저에서 깨지지 않게 보이는 웹페이지를 제작하는 기술을 의미한다.
W3C(World Wide Web Consortium)에서 채택된 웹표준 기술을 기본으로 제작한다.
쿠키(Cookie), 세션(Session), 캐시(Cashe)
쿠키(Cookie) : 사용자의 브라우저에 저장되며 보안 중요도가 낮은, 편의를 위한 정보가 해당한다.
ex) 로그인창의 아이디 자동 완성, 공지 메시지 하루 안보기, 쇼핑몰 사이트에서 로그인 안 한 상태로 장바구니에 물건 담기
세션(Session) : 서버에서 직접 관리하며 보안 중요도가 높은 정보가 해당한다.
캐시(Cashe) : 다량의 정보들을 한 번 전송받은 뒤 다시 로드할 필요가 없도록 사용자의 컴퓨터나 중간 서버 등에 정보를 저장한다.
클라우드 컴퓨팅 서비스
서버(컴퓨터 한 대)단위가 아닌, 분할된 가상 머신 또는 구현된 서비스 단위로 서버 또는 그 기능을 대여하는 것을 의미한다.
성능당 가격은 높으나 원하는 대로 커스터마이징이 가능하다.
클라우드 종류
IaaS(Infrastructure as a Service) : 가상머신을 대여하여 사용자가 직접 세부설정 및 사용한다.
PaaS(Platform as a Service) : 소프트웨어를 프로그래밍하고 업로드하여 이용한다.(배포)
SaaS(Software as a Service) : 이미 소프트웨어로 구현된 기능들을 사용만 하면 된다.
정적 웹(Static Web) VS 동적 웹(Dynamic Web)
정적 웹(Static Web) : 사용자가 접속할 때마다 동일한 파일과 컨텐츠로 제공되어지는 종류의 웹을 의미한다.
장점
다른 처리 없이 요청에 대한 파일만 전송하기 때문에 빠르다.
단순한 문서로 웹 서버를 구축하므로 호스팅 서버에 연결하는 비용이 적다.
단점
저장된 정보만 보여주므로 서비스가 한정적이다.
추가, 삭제, 수정 등의 작업이 모두 코드를 직접 건드려야 하므로 관리가 힘들다.
동적 웹(Dynamic Web) : 사용자가 접속할 때마다 해당 정보들에 따라 달라지는 컨텐츠들을 전송해주는 종류의 웹을 의미한다.
1. CSR(Client Side Rendering)
데이터가 없는 HTML 문서나 Static 파일만을 처음에 받아와 로드하고, 이후 데이터를 요청하여 받아오는 방식이다.
JavaScript를 사용하여 브라우저에서 페이지를 직접 렌더링을 진행한다.
모든 로직, 데이터 가져오기, 템플릿 및 라우팅 등은 서버가 아닌 클라이언트 측에서 처리한다.
2. SSR(Server Side Rendering)
서버에서 동적으로 데이터까지 전부 삽입하여 완성된 HTML을 넘겨준다.
브라우저에서 응답을 받기 전에 처리되므로 클라이언트에서 데이터를 가져오거나 템플릿 작성에 대한 추가 왕복이 발생하지 않는다.
3. MPA(Multi Page Application)
새로운 페이지를 요청할 때마다 정적 리소스가 다운로드되고, 그에 맞춰 전체 페이지를 다시 렌더링하는 방식이다.
검색 엔진 최적화 관점에서는 유리하지만, 새로운 페이지를 이동할 때마다 완전히 새로 렌더링 되므로 깜빡거리고 프론트엔드와 백엔드가 밀접하게 연결되어 개발이 복잡할 수 있다.
4. SPA(Single Page Application)
웹 애플리케이션에 필요한 모든 정적 리소스를 최초 한 번만 다운로드 한다.
새로운 페이지에 대한 요청이 있을 때마다 페이지 갱신에 필요한 데이터만 전달 받고 그 정보를 기준으로 페이지를 갱신한다.
최초 접속 시 맨 첫 페이지 로딩 시간은 길어도 이후 페이지부터는 속도가 빠르다.
깜빡거림이 없고 반응 속도가 좋으며 로컬 데이터를 효과적으로 캐싱할 수 있지만, 초기 구동 속도가 느리고 검색 엔진 최적화에 불리하다.