공부/개발 이모저모

웹 서비스의 역사와 발전

규투리 2022. 6. 21. 15:00
반응형

🚀 학습 목표

  1. 인터넷과 웹을 정의할 수 있다.
  2. 1세대, 2세대, 3세대 웹의 발전과 각각의 특징에 대해 설명할 수 있다.
  3. SPA 가 동작하는 방식과 프론트엔드와 백엔드가 분리된 배경에 대해 설명할 수 있다.
  4. 모던 웹 아키텍처의 구성을 이해하고 관련된 개발 직군에 대해 설명할 수 있다.

1. Internet & Web

1. Internet

  • 인터넷이란?
    • 거대한 통신망
    • 인터넷이란 서비스 안에 웹, 앱 등이 들어간다.
    • 즉, 인터넷이란 통신망이 있기 때문에 모든 서비스들을 사용해볼 수 있는 것이다.
    • 전 세계의 컴퓨터가 서로 연결되어 정보를 교환할 수 있는 하나의 거대한 컴퓨터 통신망

인터넷의 역사


  1. 1950 -모뎀(Modem)
    • Modem = Modulation(변조) + Demodulation(복조)
      • 변조 : 디지털 데이터 → 아날로그 신호
      • 복조 : 아날로그 신호 → 디지털 데이터
    • 모뎀의 단점
      • 비싸다 : 장거리 전화시스템을 이용하기에 많은 비용이 소요
      • 전화를 사용하므로 데이터 전송보다는 음성 전달에 최적화
      • 중앙 집중적 연결방식
  2. 1969 - 아르파넷(ARPAnet)
    • 모뎀의 단점을 보완하여 대안책으로 탄생한 것이 아르파넷
    • ARPAnet = ARPA + 분배 네트워크 + 패킷 스위칭 + 라우터
  3. 1983 - TCP/IP & 인터넷(Intenet)
    • TCP/IP - 인터넷의 기술적 표준
      • 다양한 네트워크가 등장하면서 그것들을 서로 연결하기 위한 표준이 필요해짐
      • 프로토콜(Protocol)
        • 통신시스템이 데이터를 교환하기 위해 사용하는 규약
      • 다양한 프로토콜 중 TCP/IP 가 인터넷의 표준 프로토콜로 선정
        • TCP : Transmission Control Protocol
        • IP : Internet Protocol
  4. 1990 - 웹의 탄생
    • 인터넷이라는 네트워크 기능 안에 웹이라는 서비스가 존재

2. Web System Architecture

1. Client & Server

  1. Client
    • 고객, 사용자
    • 웹 서비스를 사용하는 고객 → Web Browser
    • 프론트엔드는 보다 클라이언트의 측면에서 서비스를 제공할 수 있도록 하여야 한다.
  2. Server
    • 제공자
    • 웹 서비스를 제공하는 서버(컴퓨터)
    • 백엔드는 다양한 클라이언트에게서 들어오는 요청들을 처리할 수 있어야 한다.

2. 1세대 웹

  1. 1세대 웹 - 정적인 웹
    • only HTML/CSS 만을 사용하여 웹을 구축
    • 단순한 정보 제공 위주, 기능이 많지 않았음

3. 2세대 웹

  1. 웹서비스의 발전 - 동적인 웹
    • 동적인 2세대 웹 서비스의 출현
    • 웹 기반의 언어 JavaScript의 출현
    • 단순한 정적 페이지가 아닌 다이나믹한 요소들이 요구됨
    • JS로직 ← 데이터 → User Interaction
  2. 프/백 구분 없는 동일한 서버

4. 3세대 웹

  1. SPA (Single Page Application)방식 등장
    • 단일의 HTML 페이지로 전체 웹 서비스 구현 (예를 들어, airbnb)
    • JS가 HTML 요소 생성부터 모든 페이지 및 기능을 동적으로 처리
  2. 프론트엔드와 백엔드 개발의 분리
    • SPA의 등장 (FE)
    • 서버와의 통신은 데이터 전송 및 연산 작업은 따로 분리(BE)
    • 서버의 분리 & 업무의 분리 → FE & BE 개발의 분리

3. Modern Web Development

1. Modern Wen System Architecture

  • 웹 서비스의 복잡성 증가
    • User Interaction의 중요성 증가
    • 사용자 수 증가
    • 데이터의 양 증가
  • 이전에 겪지 못한 문제점 도래
    • 동시 접속사의 수 (트래픽관리가 필수적)
    • 데이터의 양 (저장해야하는 데이터가 많아짐)
  • System Architecture 발전
    • FE 서버 / BE 서버 분리
    • BE API 서버의 세분화
    • 데이터 요청 분산 처리 (API Gateway)

2. Modern Web Development Team

Frontend


  • HTML, CSS, JavaScript 로 프론트엔드 시스템을 구현하는 역할
  • 사용자와 가장 밀접하게 연결되어 있는 개발자

Backend


  • 클라이언트가 많아지에 따라 다뤄야할 데이터의 양이 많아짐
  • 따라서, 데이터를 세분화하여 관리한다.
  • Backend 개발자들도 크게 2가지로 나뉨
    • Backend 에서 좀더 앞 쪽을 담당하는 (즉 API 개발을 담당하는) 개발자.
    • Backend에서도 완전 뒤쪽, 즉 데이터 수집, 분석, 관리 등의 데이터 관련 시스템을 개발하는 개발자.
    • (경력이 높아질 수록 좀 더 난이도가 있는 뒷 부분에 해당하는 시스템을 많이 구현.) → DevOps
반응형