TIL | 웹 서비스의 역사와 발전

Wook·2021년 11월 21일
0

1. WEB과 Internet의 출현


1-1. WEB vs. Internet

  • 인터넷 이라는 전체 안에 이라는 서비스가 존재
  • 1960년에 인터넷이 등장
  • 30년 뒤인 1990년에 웹이 등장
  • Internet - Network. Infrastructure.
  • Web - "collection of information which is accessed via the Internet."

1-2. 인터넷의 출현

    1. Internet 의 출현.
  • 처음에는 군사 목적으로 출현
    • 1960년 핵이 화두. 당시 인류는 핵전쟁을 치른 이후.
    • 미국에서 핵 공격을 당한 상황을 시뮬레이션
    • 당시 중앙집중적인 통신 시스템은 핵공격에 취약. 전체가 마비.
    • 핵 공격에도 견딜 수 있는 강인한 통신 시스템 필요 >>> 인터넷
  • 인터넷 → 물리적으로 떨어져 있는 서버와 서버의 연결을 가능하게 해줌.
    • 수많은 물리적 통신 장치 중 하나에 문제가 생겨도 나머지 장치들이 역할을 대체할 수 있는 통신 시스템
  • 처음 인터넷 출현 시 기업이나 연구소, 군대와 같은 거대한 기관에서 사용되던 통신 시스템
  • 1990년 WEB 이 출현하며 대중적으로 사용 되기 시작

1-3. 웹의 출현

  • **팀 버너스리** 스위스 유럽입자물리 연구소.
  • 10년 동안 웹의 전신이 되는 프로그램을 개발 + 1990년 인터넷이 연구소에 들어오기 시작
  • 1990년 10월 세계 최초로 웹 페이지를 만드는 편집기를 개발
  • 1990년 11월 세계 최초의 웹 브라우저인 **World Wide Web** 이라는 프로그램을 개발
  • 1990년 12월 24일 웹 서버 라는 프로그램을 만들고 그 프로그램이 설치돼 있는 컴퓨터에 info.cern.ch 라는 주소를 부여
  • "home of the first website"
  • 우리가 일반적으로 생각하는 인터넷, 인터넷의 대중화는 이렇게 웹이 등장하면서 시작됨.

1-4. 인터넷이 불러온 혁신

  • 가장 큰 혁신 → 유통
  • 예전에는 소프트웨어를 구입 하려면 물리적인 매개체가 필요했음.
  • 이런 유통의 과정이 혁신적으로 줄어들면서 많은 개발자들이 창업을 하기 시작.
  • 닷컴붐(**Dot-com bubble**) (2000년대). 실리콘 밸리 형성 → 야후, 구글, 아마존 등의 회사가 이 때 출현
  • 웹 기반의 서비스 시작. 인터넷에 본인들이 만든 SW 를 올려서 판매 시작.
  • 1세대 웹 서비스 → 정적인 사이트(ex. Yahoo 2000)
  • 이 때의 기술은 HTML, CSS 가 전부

2. Web System Architecture History


  1. 1세대 웹 - 전통적인 Web System Architecture. 정적 웹.
  2. 2세대 웹 - User Interaction 의 증가. 동적 웹(자바스크립트)
  3. 3세대 웹 - SPA(Single Page Application) - 구별되기 시작하는 Frontend와 Backend
  4. Modern WEB - 규모가 커지기 시작하는 Web System의 발전

2-1. 1세대 웹 서비스 - 전통적인 Web System Architecture. 정적 웹.

  • 웹 서버가 HTML 페이지 전체를 클라이언트(ex. Web browser)에게 전송
  • 초창기 웹사이트/서비스에 적합했던 시스템 - 초창기 웹사이트는 단순한 정보 제공 위주였다. 특별히 기능이 많지 않으며, 무엇보다 User Interaction 이 많이 요구되지 않았다.
  • 1세대 웹이 정적인 이유? HTML, CSS 자체가 정적
    • Hyper Text : 링크로 연결된 문서
    • Markup Language : “이렇게 보여줘라” 에 대한 지시
    • HTML : 웹페이지의 내용을 브라우저에게 어떻게 렌더링(rendering) 해주라고 마크업 해주는 것
  • 어떻게 보여지는가에 대한 것이기 때문에 로직(동적)이 없다. 정적.

2-2. 2세대 웹 서비스 - User Interaction 의 증가. 동적 웹 (자바스크립트).

  • 웹서비스들이 점점 발전함에 따라 단순한 정적 페이지가 아닌 다이나믹한 요소들이 요구됨.
  • 웹 기반의 언어인 자바스크립트가 출현. 자바스크립트의 역할이 커지기 시작함.
  • 참고) 그 이전의 언어들은 사용할 수 없었을까? 왜 자바스크립트가 필요했을까?
    : 그 이전의 언어는 브라우저에서 동작을 안 함.
  • 이렇게 2세대 웹 서비스가 출현
  • Web server에서 전체 HTML 페이지 뿐만이 아니라 JavaScript를 통해 서버와 필요한 데이터만 주고 받음으로 dynamic한 user interaction을 구현하게 됨.
  • 그러나 아직 JavaScript 는 일부분에서만 사용되었고, 또한 현재 통용되는 API 의 개념이 아직은 널리 사용 되지 않음 → 동일한 서버에서 HTML, Javascript(프론트 영역) 데이터(백엔드 영역) 둘 다 전송.

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

  • 주객전도. 동적인 기능이 주가 되버림. → 자바스크립트가 주가 되고 그 안에 일부 HTML, CSS 가 포함.
  • 이게 바로 **SPA(Single Page Application)** - 하나의 파일로 전체 사이트를 구현
  • 이름 그대로, 단일의 html 페이지에서 전체 웹 사이트/서비스를 구현.
  • 기존의 방식대로 서버가 페이지 구성에 필요한 모든 요소(HTML, JavaScript, Data)를 매번 전송하는 것이 아니라, 파일은 처음 한 번만 송수신. 그 뒤로는 실시간 데이터만 주고 받음.
  • 제일 처음 전송된 단일 HTML 페이지에 포함되어 있는 JavaScript 에서 필요한 데이터를 API 서버로부터 호출하여 필요한 화면을 dynamic 하게 새롭게 구성해주는 방식.
  • HTML 태그 자체를 자바스크립트가 동적으로 생성
  • “명확히 두 개로 나눌 수 있겠다!” → 프론트엔드와 백엔드가 나뉘게 되는 기점.
  • 즉 HTML/JavaScript 부분과 데이터 부분이 구조적으로 분리 되기 시작
  • → Frontend 개발과 Backend 개발이 독립적으로 분리 (프론트 - UI UX / 백엔드 - Data)
  • 명확히 나뉘어진 두 개의 시스템으로 웹이 동작하게됨.
  • 기술 스택도 각자에 맞는 스택을 시용하기 시작함. (ex. Angular 의 출현!)
  • 이후 사용자에게 편하고, 더 멋진 웹 Frontend 를 구현할 수 있게 도와주는 Framework 혹은 Library 들이 탄생. (ex. React, Vue)
  • 프론트엔드가 개발의 혁신이 빠른 이유도 이 분야 자체의 역사가 짧음.
  • Frontend 와 Backend가 구조적으로 분리가 되면서, Frontend 서버와 Backend API 서버도 분리가 되며 그에 따라 Frontend 개발과 Backend 개발 업무가 분리가 되는 구조로 발전된다.

2-4. Modern WEB - 규모가 커지기 시작한 Web System의 발전

웹 시스템의 발전 역사와 함께 현대 웹 시스템의 구조에 대해서 알아보도록 하겠습니다.

  • User Interaction 의 중요성 증가 + 웹 서비스의 복잡성 증가 + 사용자 수, 데이터의 양 증가
  • (ex. Instagram, Twitter. 기능적으로 복잡한 것은 하나도 없지만 사용자와 데이터의 양이 어마어마함.)
  • 이전에 겪지 못한 두 가지 문제 - 1. 동시 접속자 수, 2. 데이터의 양System architecture 의 발전
  • 웹 사이트/서비스들이 엄청나게 발전되고 규모가 커짐에 따라 시스템 구조도 훨씬 더 복잡하고 커지게 된다. → Frontend 서버와 Backend 서버의 분리
    1. Backend 는 웹 서비스의 스케일이 엄청나게 커짐에 따라(그리고 분석해야 하는 데이터 양이 엄청나게 늘어남에 따라 ) architecture(시스템 구조)가 굉장히 복잡하게 발전 되며 규모도 엄청나게 커진다.
      • Micro Service Architecture (MSA) 등의 새로운 architecture 개념의 발전으로 API 서버들이 훨씬 더 세분화 되며 규모가 커짐
      • 분석해야 하는 데이터의 양이 엄청나게 늘어나면서 소위 "Big Data" 분석 시스템이 많은 회사들의 backend 시스템에 도입
      • 데이터를 통해 Insight 를 도출해내는 것이 다음 도전 과제 (ex. 추천 상품, 음악 플레이리스트 추천)
      • 게다가 최근에는 ML(Machine Learning)과 AI 기술의 발달로 많은 회사들이 ML과 AI 시스템도 활용하게 됨으로 backend 시스템은 계속해서 방대해지는 추세
    2. Frontend 는 Node.js 와 React 등의 JavaScript 엔진과 프레임워크/라이브러리의 발달로 웹에서 더 복잡한 기능 구현이 가능 → Node.js 의 발전으로 프론트 개발자가 간단한 백엔드 기능을 직접 구현하는 일도 요즘은 흔함.

3. Modern Development Team 구조


현대 개발팀의 일반적인 구조와 구성원들에 대해 살펴보겠습니다. 시스템을 개발할 때 개발자 혼자 개발하는 경우는 거의 없습니다. 대부분의 경우 협업으로 진행되기 때문에 개발팀이 어떠한 역할과 형태로 이루어져 있는지 이해하는 것이 중요합니다. 개발을 시작하는 단계에 있어서 앞으로의 진로 결정에 있어서도 도움이 되셨으면 좋겠습니다.

  • Product manager(기획자)
    • 개발하고자 하는 서비스를 정의하고 기획하는 역할을 담당하는 직군
    • 우리나라에서는 PM 이 개발자의 상사 같은 지위를 가지고 있는 곳이 많은데, 미국 에서는 그렇지 않다.
    • PM 과 개발자는 담당하는 일이 다른 팀원 이지 서로 상하관계가 아니다.
  • Designer
    • 웹 시스템 개발에는 UI(User Interface) 및 UX (User Experience) 를 구현하는 역할을 담당
    • 사용자가 직접 경험하고 사용하는 서비스를 눈에 보기 좋게, 사용하기 편리하게 디자인하는 역할
  • Frontend Developer
    • HTML, CSS, JavaScript 로 프론트엔드 시스템을 구현하는 역할
    • 사용자와 가장 밀접하게 연결되어 있는 개발자
    • (우리나라에는 퍼블리셔(publisher) 라고하는 HTML, CSS 만 담당하는 한국만의 고유 직군이 있음.)
  • Backend Developer
    • 백엔드 시스템을 개발하는 역할.
    • Backend 개발자들도 크게 2가지로 나뉨
      • Backend 에서 좀더 앞 쪽을 담당하는 (즉 API 개발을 담당하는) 개발자.
      • Backend에서도 완전 뒤쪽, 즉 데이터 수집, 분석, 관리 등의 데이터 관련 시스템을 개발하는 개발자.
      • (경력이 높아질 수록 좀 더 난이도가 있는 뒷 부분에 해당하는 시스템을 많이 구현.) → DevOps
  • DevOps (Development Operations)
    • 시스템 개발(Development) 뿐만 아니라 시스템 운영(Operation)까지 담당하는 것
    • 직군 이라기 보다는 개발 분야에서 나타나는 문화나 추세
    • AWS 등의 클라우드 서비스가 발달함에 따라 서버 구축 및 운영 등의 System Infrastructure 관리까지 백엔드 개발자가 직접 구현하는 추세
    • cf) IAC(Infrastructure As Code)
    • DevOps 에 대한 수요가 굉장히 높은 편. 개발 능력과 함께 DevOps 능력도 키울 것.
  • SysOps (System Operations)
    • System Infrastructure 의 구현과 관리 및 운영을 담당하는 직군
    • DevOps 와 다르게 실제 하드웨어를 다룰 수 있는 직군
    • Data Center 를 사용하여 시스템을 운영하는 회사에 필요한 직군
    • 직접 데이터 센터에 서버를 구성하지 않고 AWS 같은 클라우드 서비스가 점점 더 많이 쓰이는 추세.
      따로 SysOps 인력을 두지 않고 DevOps 개발자들이 System Infrastructure 를 담당하는 추세.
  • Data Scientist
    • Machine Learning, AI 등의 데이터 분석에 필요한 알고리즘과 모델링의 구현을 담당하는 직군.
    • 많은 양의 데이터를 분석해서 새로운 정보와 가치를 만들어 낼 수 있는 직군
  • Data Engineer
    • Data Scientist 가 데이터를 분석할 수 있도록 데이터를 정리하고 정석화 시키는 시스템을 구현하는 역할을 담당
  • Tester
    • 시스템을 테스트하여 검증하는 역할을 담당하는 직군
    • QA (Quality Assurance) - 직접 manual testing을 실행하는 직군.
    • Software Engineer in Test / Test Automation Engineer - Manual testing이 아닌 자동 테스트 시스템을 전문으로 구현하는 개발자.
  • Others
    • Project Manager
      • 프로젝트의 일정 및 출시 관리를 담당하는 역할
    • Scrum Master
      • Scrum 개발론이 개발팀 에서 널리 사용 됨에 따라 scrum process 를 관리하고 코치하는 직군이 생김.
    • Software Architecture
      • 규모가 굉장히 큰 시스템을 개발하는 회사는 Software Architecture 라고 해서 시스템의 전체 구조 디자인을 담당하는 직군이 따로 있는 곳도 존재.
      • 주로 오래된 경력의 전문가 개발자들이 software architecture role을 담당.
      • Software Architecture 직군은 요즘에는 많이 사라지고 있는 추세. Scrum 개발론이 널리 적용되고 있기때문에, 예전처럼 누군가가 시스템 구조 디자인만 따로 담당하고 개발자들은 전달된 디자인을 개발만 하는 구조는 더이상 어울리지 않는다.
      • 요즘은 개발자들이 scrum 절차에 따라 직접 시스템 디자인을 구현하고 발전시켜 나간다.
profile
지속적으로 성장하고 발전하는 진취적인 태도를 가진 개발자의 삶을 추구합니다.

0개의 댓글