웹 서비스의 역사와 인터넷의 발전

Seong Ho Kim·2023년 10월 2일

Front-End Developer CS

목록 보기

4/8

목차)
1. Computer & WEB & Internet History

(1) 컴퓨터의 역사와 역할

(2) WEB vs Internet?

(3) 인터넷(Internet)의 출현

(4) 웹(WEB)의 출현

(5) 인터넷이 불러온 혁신기술(Innovation Tech)

Web System Architecture History

(1) 1세대 웹 서비스 - 정적 웹(Static Web)

(2) 2세대 웹 서비스 - 동적 웹(Dynamic Web)

(3) 3세대 웹 서비스 - 구별되기 시작하는 Frontend / Backend와 SPA

(4) Modern WEB - 규모가 커지기 시작한 Web System

1. Computer & WEB & Internet History

(1) 컴퓨터의 역사와 역할

최초의 모던 컴퓨터 - 튜닝 컴퓨터 (튜닝이라는 사람이 모던 컴퓨터를 제작함)
인터넷 최초 컴퓨터 - ENIAC (애니악)
컴퓨터의 역할은 원래 calculate(계산기)의 역할이 중점적으로 활용

(2) WEB vs Internet?

1960년대에 인터넷(Internet)이 등장 -> (군사, 연구소, 기업에서 먼저 사용됨)
1990년대에 웹(WEB)이 등장 -> (인터넷이 대중들에게도 보급됨)
즉, 인터넷(Internet) 이라는 전체적인 틀안에 웹(WEB)이라는 하나의 서비스가 존재

(3) 인터넷(Internet)의 출현

인터넷(Internet)은 1960년대에 등장한것을 시점으로 인터넷의 역사가 시작됨

1) 처음에는 군사 목적으로 사용 되었음
-> 인류가 핵전쟁을 치른 이후로 미국에서 핵 공격을 당한 상황을 시뮬레이션함
-> 당시 사용했던 통신방식은 중앙집중식 통제 시스템을 사용했지만 핵공격을 받았을시에 전체 통신이 마비될 위험성이 증가
-> 중앙 집중식 통제 시스템보다 더 강력한 시스템이 필요했는데, 이를 기반으로 Internet이 등장
2) 물리적으로 떨어져있는 서버와 서버간의 연결이 가능하도록 만들었음
-> 수많은 물리적 통신 장치 중에 하나가 문제가 생겨도 다른 장치내에서 역할을 대체할수 있는 분산식 시스템으로 대체함
3) 1990년 WEB이 등장하면서 대중들에게도 사용되기 시작하였음
-> 원래 국방, 연구소, 기업에서 처음에 먼저 사용되었지만 인터넷이 대중들에게도 보급되기 시작함

(4) 웹(WEB)의 출현

웹(WEB)은 1990년대에 등장한것을 시점으로 웹의 역사가 시작됨

1) 영국의 과학자 "팀 버너스리"에 의해 최초로 WEB이 개발되었음
-> 1990년 10월 세계 최초로 웹 페이지를 만드는 편집기를 개발
-> 1990년 11월 세계 최초의 웹 브라우저인 World Wide Web 이라는 프로그램을 개발
-> 1990년 12월 24일 웹 서버 라는 프로그램을 만들고 그 프로그램이 설치돼 있는 컴퓨터에 info.cern.ch 라는 주소를 부여
2) "home of the first website"
-> 우리가 일반적으로 생각하는 웹은 인터넷이 대중화 되면서 사람들에게 상용화 됨에 따라, 시작됨

(5) 인터넷이 불러온 혁신기술(Innovation Tech)

예전에 인터넷을 사용하기 위해선 소프트웨어 라는 물리적인 매개체가 필요했음
주로 유통업계에서 인터넷의 큰 혁신을 맞이함
닷컴붐이 일어나면서 2000년대를 기준으로 실리콘 밸리가 형성됨
(ex. Google, Yahoo, Amazon)
1세대 웹 서비스(정적 사이트) (ex. Yahoo 2000)
이때 기술은 HTML, CSS 으로만 활용함 (Javascript는 아직 등장 X)

2. Web System Architecture History

(1) 1세대 웹 서비스 - 정적 웹(Static Web)

웹 서버가 HTML 페이지 전체를 ~~클라이언트(ex. Web browser)~~에게 전송
-> 1세대 웹 통신 구조 : Server -> client(WEB Browser)
초창기 웹사이트는 단순한 정보 제공 위주로, User Interaction 이 많이 요구되지 않았음
-> Static WEB : HTML [정적 Web]

(2) 2세대 웹 서비스 - 동적 웹(Dynamic Web)

웹서비스들이 점점 발전함에 따라 단순한 정적 페이지가 아닌 다이나믹한 요소들이 요구
다이나믹한 요소들을 구현하기 위해 Javascript가 등장함
JavaScript를 통해 서버와 필요한 데이터만 주고 받음으로, 동적 user interaction을 구현하게 됨.
다만, JavaScript 는 일부분에서만 사용되었고, 아직까지 통용되는 API 의 개념이 널리 사용 되지 않음
-> Dynamic WEB : HTML + Javascript (ex. Yahoo)[정/동적 Web]

(3) 3세대 웹 서비스 - 구별되기 시작하는 Frontend / Backend와 SPA(Single Page Application)

SPA(Single Page Application)
-> 하나의 파일로 전체 사이트를 구현하는 것을 말함.
Server에 페이지 구성에 필요한 모든 요소(HTML, JavaScript, Data)를 매번 전송하는 것이 아닌, 파일은 처음 한 번만 송/수신 하고 그 뒤로는 실시간 데이터만 주고 받음.
단일 HTML 페이지에 포함되어 있는 JavaScript 에서 필요한 데이터를 API 서버로부터 호출하여 필요한 화면을 dynamic 하게 새롭게 구성함
HTML 태그 자체를 자바스크립트가 동적으로 생성함으로써 Frontend와 Backend가 나뉘게 되는 기점이 됨 (즉, Frontend 개발과 Backend 개발이 독립적으로 분리됨 (프론트 - UI UX / 백엔드)
이후 사용자에게 편하고, 더 멋진 웹을 구현할 수 있게 도와주는 Framework 혹은 Library 들이 탄생. (ex. React, Vue)

(4) Modern WEB - 규모가 커지기 시작한 Web System

웹 서비스의 복잡성과 사용자 수, 데이터의 양이 그 이상으로 증가함 (ex. Instagram, FaceBook..)
스마트폰의 발달로 Computer WEB 에서만 볼수 있는 웹 페이지를 모바일에서도 볼수 있음
웹 사이트/서비스들이 엄청나게 발전되고 규모가 커짐에 따라 시스템 구조도 훨씬 더 복잡하고 커짐
이전에 겪지 못한 "동시 접속자 수", "데이터의 양" 과 같은 문제들이 발생함
→ (System architecture 의 엄청난 대발전)
Frontend 서버와 Backend 서버의 분리
-> Backend는 웹 사이트의 데이터 분석양이 증가함에 따라 architecture system이 엄청나게 복잡하게 발전되면서 규모도 커짐
-> Frontend는 JavaScript 엔진 기반의 Node.js와 React등으로 프레임워크/라이브러리의 발달로 웹에서 더 복잡한 UI/UX 및 기능을 구현할수 있음