import {
 A, Bold, Details, Dl, H, Message, NoteBottom, NoteTop, P,
 Quote, Score, Youtube, Ul, Ol, Em, Gray, Code, Kbd, Image,
 Q, Strong, Spoiler, Strike, Line, Mark, HtmlGuideMessage, Name,
 Dt, Dd, ProgrammingGuideMessage
} from '@/components/Post';

<ProgrammingGuideMessage />

이번 글은 **개발을 위한 프로그래밍 지식 시리즈 제 6편**입니다. 마지막 글입니다. 우리는 지금까지 컴퓨터의 역사를 알아봤고 프로그래밍 언어의 흐름을 알아봤고 인터넷의 등장과 웹의 흐름을 알아봤습니다. 전문적인 지식은 아니더라도 대강이나마 살펴봤죠. 이제 우리는 **웹 프로그래밍**에 대해 파고들 시간입니다.

어차피 우리는 초보고 견문이 별로 없는 문외한들입니다. 실력이 있다면 이런 글을 보고 있지 않겠죠 아마도. 아무튼, 우리의 수준은 다 비슷비슷합니다. 높지는 않죠. 우리가 **웹 프로그래밍을 공부하기 위해서는 웹 프로그래밍이 무엇인가 정도는 알아야**겠죠. 그리고 그 안에서 어떠한 개념들이 있는지는 알고 넘어가야 비로소 배울 준비가 되었다라고 할 수 있을 겁니다.

그래서 마지막 글인 이번 글의 주제는 웹 프로그래밍입니다.

# 웹 프로그래밍
웹 프로그래밍이라는 개념이 등장한 것은 사실 그렇게 오랜 과거는 아닙니다. 웹을 프로그램의 일종이라고 보게 된 것은 얼마 안됐기 때문이죠. 웹 프로그래밍 자체는 웹 사이트를 프로그래밍하는 것을 말합니다. **웹 사이트는 단순 문서일 뿐이다**라는 관점이 대다수였던 과거와는 달리 **웹도 이제는 프로그래밍적인 접근이 가능해졌다**라는 관점이 나타났고 이에 따라 웹 프로그래머라는 직종이 나타나기 시작했고, 그들이 하는 게 바로 웹 프로그래밍입니다.

![트위터의 모습이다. 트위터 또한 웹 애플리케이션이다.](https://drive.google.com/uc?export=view&id=113f5jyD_d2shNlBjzS_5ZcsW388eLuvJ)

![우리가 흔히 보는 유튜브의 모습. 유튜브는 웹 애플리케이션이라고 할 수 있다.](https://drive.google.com/uc?export=view&id=13XmNoV7fwl2MIhU5-44NAnURGosp-8Nk)

**트위터**나 **페이스북**, **유튜브**처럼 사용자와 웹이 상호작용을 할 수 있는 서비스를 제공하는 웹 사이트들은 단순한 문서가 아니라 웹 프로그램 혹은 웹 애플리케이션이라고 부를 만한 수준의 사이트라고 할 수 있는 겁니다. 이 블로그 같은 경우를 생각해보면 이 블로그는 그냥 읽는 것만 가능하죠. 웹 프로그래밍을 통해서 만든 블로그이긴 하지만 결과물은 웹 프로그램이라고는 할 수 없죠. 이런 경우도 있습니다.

웹의 세계는 계속해서 변하고 있습니다. 위의 개념도 사실은 **확실하게 구분된 것은 아닙니다.** 앞으로 좀 더 다양한 웹 기술들이 나타날 것이고, 점점 그 경계가 깨지고 있다는 것은 확실한 것이죠.

그러니까 웹 프로그래밍이라는 것은 단순히 웹 디자인<NoteTop number='1' />이나 웹 퍼블리싱<NoteTop number='2' />을 넘어서 웹과 사용자의 상호작용이 가능한 인터랙티브한 프로그램을 구현하는 것이라고 할 수 있는 것입니다. 물론 언제나 그렇지는 않고 보통은 서비스를 개발하는 것을 목적으로 합니다.

처음에는 그냥 자바스크립트만으로 프로그래밍을 했지만 **Node.js**가 빛을 발하기 시작하면서 다양한 자바스크립트를 이용한 **라이브러리, 프레임워크**들이 나타나기 시작했습니다. **타입스크립트(TypeScript)**도 Node.js의 패키지 매니저 시스템을 이용한 **자바스크립트의 슈퍼셋 언어**입니다. 이런 것들로 인해서 자바스크립트는 상당히 강해졌다는 것이죠.

심지어는 웹 프로그래밍 뿐만 아니라 **데스크탑 프로그램**까지도 만들어낼 수 있습니다. **일렉트론(Electron)**이라는 것을 이용하면 말이죠. **리액트 네이티브(React Native)**나 **플러터(Flutter)**를 이용하면 **스마트폰 애플리케이션**도 만들 수 있습니다. 당연하게도 **게임**도 가능하긴 한데.. 이 부분은 그닥 추천되는 부분은 아닌 듯합니다.

이렇게 말을 해도 초심자인 우리는 잘 이해가 가지 않겠죠. 어쩔 수 없습니다. 우리가 이제 곧 웹을 만들고, 발전시키는 과정을 스스로 체험할 것이지만 프로그래밍의 영역에 발을 들이는 것은 **자바스크립트를 만나고 난 다음부터**일 것이고 그 뒤에 알아도 이상하지 않습니다. 그렇기 때문에 이해가 가지 않는다고 의기소침하거나 의욕을 잃을 필요는 전혀 없다는 겁니다. 처음인데 모르는 것은 그냥 **당연**합니다. 처음인데 익숙하면 그게 이상하죠.

# 웹 프로그래밍의 종류
30년도 안된 짧은 기간동안 웹 프로그래밍은 크게 발전을 해왔고 세가지의 부류로 나뉩니다.

## 프론트 엔드(Front-End)
하나는 **프론트 엔드(Front-End)**입니다. 화면에 보이는 부분을 프로그래밍하는 부류입니다. 단순히 레이아웃을 만들고 디자인을 입혀 결과물을 내는 것과는 다릅니다. 프로그램적인 기능을 구현하는 것에 초점이 맞춰져 있습니다. **프론트 엔드 개발자는 HTML, CSS, JavaScript를 전부 다룰 수 있어야** 합니다. 개개인의 디자인적 능력과는 별개로 말이죠.

프론트 엔드는 **클라이언트 사이드**라고도 합니다.

## 백 엔드(Back-End)
또 하나는 **백 엔드(Back-End)**입니다. 프론트 엔드가 보이는 화면을 개발하는 것이라면, 백 엔드는 보이지 않는 부분을 개발합니다. 정확히는 클라이언트와 서버끼리 데이터를 주고 받는데 그 데이터를 처리하는 일을 맡습니다. 보통 데이터베이스, 클라이언트와의 소통을 위한 API를 개발 합니다. 말 그대로 서버와 관련된 개발을 하는 부류입니다.

경우에 따라서는 데이터베이스는 따로 다른 사람이 개발을 하기도 합니다. 백 엔드는 **서버 사이드**라고도 합니다.

## 풀스택(Full Stak)
마지막 부류가 프론트 엔드와 백 엔드를 둘 다 할 줄 아는 **풀스택(Full Stak)**입니다. 하나만 할 줄 알아도 직업으로서 갈 길이 생기는데, 두개를 다 할 수 있다면 더욱 길이 열리게 됩니다. 풀스택 개발자가 아니더라도 **프론트 엔드 개발자와 백 엔드 개발자는 서로의 영역에 대해 어느정도는 알고 있어야** 합니다. 그래야 **원활한 소통**이 가능하고 **협업**을 이루어낼 수가 있기 때문입니다.

쉽게 말하면 둘 다 공부하면 좋다. 라는 것입니다.

## 웹 프로그래밍 언어
웹 프로그래밍에 쓰이는 언어는 기본적으로는 총 세가지입니다.

웹의 뼈대이자 마크업을 담당하는 **HTML**. 웹의 피부이자 디자인, 스타일을 담당하는 **CSS**. 웹의 근육, 뇌이자 웹에 대한 전반적인 것들 컨트롤 하는 **자바스크립트** 정도가 있겠습니다.

사실 이 언어들 말고도 웹 프로그래밍에 쓰이는 언어는 **다양한 편**입니다. **파이썬**도 그렇고 **C#**도 그렇고 **자바**도 그렇고 아무튼 다양합니다. 처음부터 이렇게 많은 걸 알 필요는 없습니다. 오히려 머리만 아프죠. 가장 일반적이고 전형적인 루트를 먼저 가보고 그 다음에 다른 길을 모색하는 것도 나쁘지 않습니다.

이게 왜 그런가하면 웹의 시장이 커지면서 다른 언어들도 **웹 개발을 지원하는 경우**가 생겨왔기 때문입니다. 이는 전부 웹의 중요성을 알아서 자신들의 영역을 확대하려고 하는 것이죠. 저는 자바스크립트로 개발을 하려고 배우고 있는 중이기 때문에 이 블로그에서도 자바스크립트에 대한 부분을 집중적으로 다룹니다.

# 힘들지도 모르는 오르막길
아무튼간에 우리는 앞으로 위에서 언급된 이 세가지의 언어에 대해 배워 갈 것입니다. 함께 말이죠. **우리는 처음부터 프로그래밍을 하지는 않습니다.** 웹 퍼블리싱부터 절차적으로 밟고 올라갈 겁니다. 갈 길이 멀지도 모릅니다. 하지만 천천히 앞으로 나아가면 생각보다 빠르게 목표지점에 도달할 수 있을지도 모르죠. 그러기 위해서는 가장 먼저 HTML부터 정복해보는 게 필요하겠죠?

**같이 공부하는 사람들이 있다면 공부는 언제나 더 즐겁습니다.** 같이 공부할 사람을 만들고 여러분과 비슷한 사람들을 만나세요. 여러분의 공부는 더 재밌어질 것이고 공부의 효율은 올라갈 겁니다.

# 공부를 하는 목적
또한 여러분들은 단순히 공부를 하는 게 아니라 **목적을 만들어야 합니다.** 목적이 없는 공부는 쉽게 지치게 됩니다. 지식을 그저 알려고 하는 건 의미가 없습니다. 사용할 곳이 있어야 비로소 의미가 있는 것이죠. 여러분들은 왜 프로그래밍을 배우려고 하시는 것일까요. 저는 모릅니다. 하지만 여러분들은 알겠죠.

그렇다면 목적을 들여다보세요. 없다면 만드세요. 무엇이든 좋습니다. **목적은 크게. 멀리 있는 것을 설정**하면 더 좋습니다.

목적이 설정되면 그 다음엔 목표입니다. 목적을 달성하기 위해 **간단한 목표**부터 만들어보세요. 저같은 경우는 일본어를 전공했고 일본어를 가르치는 웹 사이트를 만들고 싶었습니다. 그렇게 HTML을 배우고 CSS를 배우고 자바스크립트를 배우기 시작했습니다.

![주사위를 굴릴 수 있는 DiceRoll](https://drive.google.com/uc?export=view&id=1LkSIAuQ726zgrAAg_c9WPpNA_itc24Vy)

자바스크립트를 배우면서 처음으로 만든건 주사위 프로그램이었습니다. 단순했지만 어려웠죠. 높은 벽을 만났기 때문에 그 벽을 넘기 위해서 공부를 할 수 있었습니다. 그렇게 만든 프로그램은 바로 <A href='https://thediceroll.github.io/' type='normal'>DiceRoll</A> 입니다. TRPG라는 것을 할 때에 만들었던 것인데 지금도 사용하고 있습니다.

그 뒤로도 천천히 공부를 하고 있는 중입니다. 그리고 이렇게 정리를 하면 머리에 더 잘 남으니까 가이드도 작성하고 있죠. 중요한 건 이게 아니고, 우리끼리 목표를 하나 만들어봅시다. HTML을 배워서 간단한 페이지를 하나 만들어보는 겁니다. 목표도 정해졌겠다. 그럼 달려봅시다. [웹 개발을 위한 HTML 가이드 모음](/post/2021-05-02-01-complete-html-guide) 이 링크를 클릭하면 HTML 가이드의 목록을 확인할 수 있습니다.

이제부터 우리는 한 배를 탄 겁니다. 개발을 위한 프로그래밍 지식은 여기까지입니다. 추후에 필요한 내용이 있으면 업데이트를 하도록 하고 새롭게 알게 되는 내용이 있어도 업데이트를 할 겁니다. 아무튼, 여기까지 달려오느라 고생 많으셨습니다. 이제부턴 진짜 공부를 시작해봅시다.

<NoteBottom number='1' first={true}>웹을 구현하기에 앞서 기획을 세우는 것으로, 요소들의 레이아웃과 상세한 구격을 설정하는 과정을 말한다. 최종적으로 완성될 이미지를 전달하기도 하며, <A type='normal' href='https://www.figma.com/'>Figma</A> 등의 디자인 툴을 통해서 웹 퍼블리셔와 협업을 하기도 한다. 웹 디자인을 전문적으로 하는 사람을 웹 디자이너라고 한다.</NoteBottom>
<NoteBottom number='2'>디자인을 바탕으로 웹을 구현하는 것을 퍼블리싱이라고 한다. 이를 전문적으로 하는 사람을 웹 퍼블리셔라고 부른다.</NoteBottom>

이번 글은 개발을 위한 프로그래밍 지식 시리즈 제 6편입니다. 마지막 글입니다. 우리는 지금까지 컴퓨터의 역사를 알아봤고 프로그래밍 언어의 흐름을 알아봤고 인터넷의 등장과 웹의 흐름을 알아봤습니다. 전문적인 지식은 아니더라도 대강이나마 살펴봤죠. 이제 우리는 웹 프로그래밍에 대해 파고들 시간입니다. 어차피 우리는 초보고 견문이 별로 없는 문외한들입니다. 실력이 있다면 이런 글을 보고 있지 않겠죠 아마도. 아무튼, 우리의 수준은 다 비슷비슷합니다. 높지는 않죠. 우리가 웹 프로그래밍을 공부하기 위해서는 웹 프로그래밍이 무엇인가 정도는 알아야겠죠. 그리고 그 안에서 어떠한 개념들이 있는지는 알고 넘어가야 비로소 배울 준비가 되었다라고 할 수 있을 겁니다.

개발을 위한 프로그래밍 지식 6편 - 웹 프로그래밍

import {
 A, Bold, Details, Dl, H, Message, NoteBottom, NoteTop, P,
 Quote, Score, Youtube, Ul, Ol, Em, Gray, Code, Kbd, Image,
 Q, Strong, Spoiler, Strike, Line, Mark, HtmlGuideMessage, Name,
 Dt, Dd, ProgrammingGuideMessage
} from '@/components/Post';

<ProgrammingGuideMessage />

이번 글은 **개발을 위한 프로그래밍 지식 시리즈 제 5편**입니다. 이번 글에서는 **웹의 역사**에 대해서 다룹니다. 사실 웹 자체의 역사라기보다는 HTML과 CSS와 같은 **언어들의 역사**라거나 **웹 서비스들의 흐름, 패러다임**에 대해 알아보는 것이라고 하는 게 더 나을지도 모르겠습니다. 웹은 꾸준히 발전을 하고 있고 앞으로도 계속 발전을 할 것입니다. 이제 본론으로 들어가보도록 합시다.

# 웹의 태동
인터넷이 등장하면서 세계는 급격하게 변했다고 해도 과언이 아닙니다. 하지만 어려웠기 때문에 대중에게 풀려도 제대로 사용되지 않았던 인터넷을 더 확실하고 빠르게 보급한 원인은 바로 **웹**에 있습니다. 웹은 그나마 사용하기 편했으니까요.

## 초창기 웹의 의미
웹이 처음 등장하고 성장을 시작하던 1990년대부터 2000년 동안은 웹은 진가를 발휘하지 못한 상태였습니다. 이 시기를 초창기라고 정의한다면, 이 초창기 웹의 시대는 서로 다른 국가에 있던 사람들이 한 공간에 모여 **접촉**이 가능하게 됐던 역사적인 순간이었다고 할 수 있습니다.

## HTML과 CSS
웹이 처음 등장한 이래로 많은 변화가 있었지만 처음에는 초라한 형태였습니다. 팀 버너스리는 웹을 고안하면서 웹에서 보여질 문서의 규격도 같이 고안했습니다. 그게 바로 HTML이라는 언어입니다. **html 문서**는 **HTML로 작성**이 되고 이렇게 작성된 파일은 **웹 브라우저를 통해서 열람**이 가능했습니다. 최초의 웹 페이지를 보면 얼마나 초라했는지 알 수 있습니다.

![최초의 웹 페이지](https://drive.google.com/uc?export=view&id=1Z13tANDrjOOD9DI4cI9wXQTLBdQQaINi)

HTML의 처음 버전은 1이었습니다. 물론 나올 때에는 그냥 HTML이었지만 버전이 올라가면서 최초의 HTML은 버전 1이 되었습니다. 당연하겠죠. 1995년에 HTML 2가 발표되었는데 최초로 표준이 된 버전입니다. 하지만 문제도 많았던 버전이었기 때문에 금방 1997년에 버전 3.2가 등장합니다.

버전 3.2를 내놓은 것은 **W3C**라는 곳이었는데 이 곳은 웹의 표준화를 추진하는 곳입니다. 웹 표준이라는 것은 어떤 브라우저에서 열더라도 똑같이 출력되는 것을 포함한 대략적인 기준 같은 것이라고 이해하면 됩니다. 이후의 HTML 버전은 이 곳에서 내놓게 됩니다.

초창기의 웹은 **문서의 형태**를 짙게 띄고 있었습니다. 마치 워드처럼 말입니다. 요즘의 웹과는 많이 다른 형태였고 말 그대로 디자인이 없어서 초라했습니다. 디자인이 가능하게 됐던 순간에도 **html 문서에 때려넣었기 때문**에 **가독성이 개판**이 되기도 했습니다.

HTML 4.01부터 HTML이 체계적으로 자리를 잡아가기 시작하면서 디자인. 즉 스타일은 CSS로 분리가 되었습니다. 사실 CSS가 처음 등장한 것은 1996년인데 그 이후에도 HTML에 디자인 요소를 넣곤 했는데 점점 그런 추세는 사라지게 됩니다.

**HTML**은 웹 페이지의 **골격만을 담당**하게 되었고 **CSS**는 웹 페이지의 **디자인만을 담당**하게 된 것이죠. 체계적인 디자인이 가능해지면서 웹의 환경을 변하기 시작했습니다. 조금 더 화사하게 말이죠.

<Message color='g'>
 웹 페이지는 하나 하나의 페이지를 의미합니다. 웹 사이트는 연관이 있는 페이지들의 집합입니다. 웹 사이트가 웹 페이지의 상위적인 카테고리라고 이해하면 됩니다.
</Message>

# 웹의 발전
초창기의 웹은 HTML과 CSS의 위주로 돌아갔다면 **자바스크립트**가 등장하고나서 조금 지난 후, 자바스크립트가 **웹의 중심점** 역할을 하게 됩니다. HTML도 CSS도 전부 자바스크립트로 제어할 수가 있었기 때문이죠. 자바스크립트를 이용하면 HTML과 CSS 만으로는 할 수 없는 일들도 이뤄낼 수 있었습니다.

자바스크립트는 **웹 프로그래밍**의 본격적인 시작을 알렸습니다. 웹 개발자들이 많이 생겨나기 시작했습니다. 뿐만 아니라 자바스크립트 이외에도 많은 언어들이 웹을 보완, 보조하기 위해 탄생했고 웹을 좀 더 편안하게 구성할 수 있도록 돕기 시작했습니다. 웹과 상관이 없던 프로그래밍 언어들도 웹 개발을 지원하기 시작했죠. 이는 웹이 상당히 중요한 위치에 이르렀다는 것을 의미했습니다.

## 자바스크립트의 등장
자바스크립트는 본래 웹서버에서 사용될 언어였으나 나가리되고 **웹 브라우저에 탑재** 되었습니다. 자바스크립트가 웹에 쓰이게 되면서부터 정적이었던 웹 페이지들은 동적인 웹 페이지가 될 수 있었지만 자바스크립트가 등장을 했어도 세상은 아직 **HTML과 CSS의 위주**로 돌아갔습니다.

그런데 어느순간부터인가 웹에서 **동적인 요소들이 부각**되기 시작합니다. 자바스크립트의 영역이 **점점 더 커지면서** 여러 웹 서비스들은 웹 사이트에 동적인 요소를 추가하고 **자바스크립트를 적극 활용하기 시작**했습니다. 이때부터 웹은 단순한 문서만은 아니게 되었습니다.

오늘날 웹의 세가지 요소는 HTML, CSS, JavaScript라고 알려져 있고 이렇게 굳어져 있습니다. 이 세가지는 떼려야 뗄 수 없는 관계가 되었습니다. 게다가 현재의 웹은 가히 **프로그램이라고 할 수 있을만한 위치**로 왔습니다. 그저 문서의 측면이었던 과거와는 다르게 웹 페이지와 사용자의 상호작용이 활발하게 이루어지고 있기 때문입니다. 그래서 결론적으로 현재는 **웹 문서**로서의 측면과 **웹 프로그램**으로서의 측면이 격돌하고 있습니다. 아마도 지금 이 순간이 과도기일 것입니다.

물론 모든 웹 페이지가 그런 것은 아니기 때문에 문서의 측면이 완전히 사라졌다고는 할 수 없습니다. 그러나 대부분의 웹 사이트는 동적이다 못해 사용자와 **소통을 하기도** 합니다. 이러나 저러나 웹으로 할 수 있는 것이 점점 많아지고 있다는 의미입니다.

## 제이쿼리의 등장
자바스크립트를 보다 편하게 사용할 수 있도록 만들어주는 라이브러리인 **제이쿼리**는 2006년에 처음 나타났습니다. 제이쿼리는 사실 별 기능이 없습니다. 그럼에도 업계를 장악하기 시작했습니다. 제이쿼리가 자바스크립트보다 더 나은 언어인줄 아는 사람들도 있습니다.

제이쿼리는 일반 자바스크립트를 사용할 때보다 개발 속도가 빨랐고 **간결한 코드만으로** 많은 기능을 구현할 수 있었다는 점에서 인기를 끌었습니다. 장점이 이것 뿐이기에 훗날 다른 기술에게 밀려 점유율을 빼앗기게 되지만요.

## 반응형 웹의 등장
![반응형 웹의 모습이다](https://drive.google.com/uc?export=view&id=1-kpC9ELIU18YvSpUof78qDm9fnLy1z5c)

모바일 기기의 사용량이 많아지고 **모바일에서도 웹에 접속**할 수 있게 되면서부터 어떤 문제가 발생하게 되었습니다. 모바일이 발달하기 이전에는 **웹은 PC의 화면만을 신경쓰면 됐습니다.** 그런데 모바일이 발달하면서부터 **웹은 모바일용 화면도 따로 구성**해야 했습니다. 하나의 사이트가 두개의 버전으로 존재해야 했던 겁니다. 이런 비효율적인 방식을 타파하기 위해서 CSS에서는 **미디어 쿼리**라는 시스템을 도입했습니다.

미디어 쿼리는 모바일이든 PC든 상관 없이 **같은 웹 페이지**를 **화면의 너비**에 따라서 **다른 화면**으로 보여주는 기술입니다. 정확히는 모바일이면 모바일에 맞게끔 보여주고 PC라면 원래의 모양을 보여주는 것이죠. 이러한 웹 디자인 방식을 **반응형 웹 디자인**이라고 불렀습니다. 그리고 지금 반응형으로 디자인을 하지 않은 웹 사이트는 별로 없다고 봐도 무방합니다.

## SNS의 등장
2000년대 이후에는 **SNS**라는 웹 서비스들의 등장으로 인해서 사람들은 **소비자에서 생산자**가 되었습니다. 자신들의 노하우를 공개할 수 있게 되었고 자신들의 생각과 발상을 세상에 내놓을 수 있게 되었습니다. 이러한 활동들은 웹을 더 가득 가득 채우기 시작했고 그 결과 웹은 **정보의 바다**가 되었습니다. 누군가는 블로그에 글을 작성하기 위해 웹을 이용했고 누군가는 정보를 얻기 위해 웹을 이용했습니다.

이 기조가 현재까지 이어져오고 있습니다. 웹은 이제 인류의 일상이 되었습니다. 웹을 통해서 뉴스를 접하고 새로운 소식을 접하기도 하며 자신들의 일상을 **공유**하기도 합니다. 지금은 당연하게 느껴지는 것들은 과거엔 전혀 당연하지 않았습니다. 혁신적이었고 가히 신비로운 기술이었습니다. 우리는 이러한 환경이 나타난 것을 정말 다행으로 여겨야 합니다.

## Node.js로 인한 자바스크립트의 활용 확대
흔히 **노드**라고 부르는 이 자바스크립트 런타임은 현 시대의 자바스크립트의 활용성을 최대한으로 **극대화**시켰습니다. 일반적인 자바스크립트만으로도 충분히 강력한 기능을 구현할 수 있는데 수십, 수백을 넘어 수천가지의 라이브러리 시장을 활성화시켜 어마어마하게 거대한 트렌드와 패러다임을 만들어냈습니다.

현재의 웹 개발 트렌드는 **SPA**인 듯합니다. 싱글 페이지 애플리케이션이라는 의미입니다. 웹사이트라는 것은 기본적으로 여러개의 페이지가 있어야 했는데 SPA라는 개념으로 인해서 하나의 페이지만으로 여러개의 페이지가 있는 것마냥 브라우저를 속일 수 있는 기술을 얻었습니다. **리액트(React)**나 **뷰(Vue)**가 바로 그런 개념의 기술인데 여기서 말하긴 좀 이른 것 같군요.

노드의 패키지 매니저 시스템인 **NPM**을 적극 이용해 여러가지 유용한 프로그래밍이 가능해졌고 웹 개발자들은 자신들이 직접 프로그래밍을 해서 기능을 구현시키기보다는 이미 만들어져 있는 기능을 가져와서 자신의 프로그램에 첨가하는 등의 오픈소스의 활용 능력도 중요시하게 다뤄지게 되었습니다. 오늘날의 **프로그래밍은 마치 퍼즐**과도 같습니다. 잘 어울리는 이미 존재하는 라이브러리, 프레임워크를 어떻게 조합해서 퍼즐을 맞추냐가 관건이죠.

이 부분에 대한 더 자세한 이야기는 **웹 프로그래밍** 파트로 넘어가서 계속하도록 합시다.

## 웹의 중요성을 알게 된 개발자들
웹이 발전함에 따라 다양한 프로그래밍 언어들이 웹 프레임워크를 지원하기 시작했습니다. 자바도 파이썬도 C# 같은 언어들도 웹 프로그래밍을 할 수 있는 언어가 되었습니다. 물론 자바스크립트를 따라오긴 아직 멀었다는 생각이 들긴 합니다만 그렇게 변해왔고 앞으로 확대될 거라는 것이 중요하겠죠.

---

글이 길어질 것 같아서 잘랐는데 막상 작성하고 보니 그렇게 길지는 않네요. 사실은 이번 글을 작성하면서 생략한 부분도 많이 있습니다. 빠진 것들은 추후에 정리가 되면 추가를 해보도록 하고 일단은 웹 프로그래밍에 대한 주제를 먼저 다뤄야겠습니다. 이번 글은 여기까지 입니다. 다음 글에서 봅시다.

이번 글은 개발을 위한 프로그래밍 지식 시리즈 제 5편입니다. 이번 글에서는 웹의 역사에 대해서 다룹니다. 사실 웹 자체의 역사라기보다는 HTML과 CSS와 같은 언어들의 역사라거나 웹 서비스들의 흐름, 패러다임에 대해 알아보는 것이라고 하는 게 더 나을지도 모르겠습니다. 웹은 꾸준히 발전을 하고 있고 앞으로도 계속 발전을 할 것입니다. 이제 본론으로 들어가보도록 합시다. 웹이 처음 등장한 이래로 많은 변화가 있었지만 처음에는 초라한 형태였습니다. 팀 버너스리는 웹을 고안하면서 웹에서 보여질 문서의 규격도 같이 고안했습니다. 그게 바로 HTML이라는 언어입니다. html 문서는 HTML로 작성이 되고 이렇게 작성된 파일은 웹 브라우저를 통해서 열람이 가능했습니다. 최초의 웹 페이지를 보면 얼마나 초라했는지 알 수 있습니다.

“ 자바스크립트 ” 태그 관련 포스트 2건

개발을 위한 프로그래밍 지식 6편 - 웹 프로그래밍

개발을 위한 프로그래밍 지식 5편 - 웹의 역사