목차

• 웹(Web)
  • 웹의 역사
    • 웹이란?
    • 웹의 창시자
  • 웹을 위한 언어 HTML
• 실습
  • 간단한 웹 서버 구현
  • HTML 문법을 활용한 폰트 편집
• 후기

1. 웹 (Web)

1.1. 웹의 역사

1.1.1. 웹이란?

웹은 정보를 공유하고 접근할 수 있는 인터넷 기반의 서비스 를 말한다. HTML이라는 언어로 만들어진 웹페이지를 컴퓨터와 컴퓨터가 주고받을 수 있도록 해준다. HTML과 HTTP와 같은 표준을 사용하여 문서, 이미지, 동영상, 애플리케이션 등 다양한 형식의 콘텐츠를 제공한다.

주요 특징으로는 Hypertext 라는 시스템으로 링크로 연결된 하나의 거대한 정보 덩어리를 웹이라고 할 수 있다. 인터넷이 연결되어 있다면 누구나 웹에 접속하여 정보를 공유하고 찾을 수 있으며 현대 사회에서 필수적인 커뮤니케이션 및 정보 공유 수단으로서 중요한 역할을 하고 있다.

1.1.2. 웹의 창시자 - 팀 버너스리

팀 버너스리는 최초로 웹 브라우저 와 웹 브라우저의 카운터 파트너로서 이 정보를 제공하는 컴퓨터에 설치되어 있는 웹 서버 라고 하는 소프트웨어, 그 과정에서 사용되는 통신 규약인 HTTP , 그리고 실제로 웹 페이지 정보를 담고 있는 언어인 HTML 을 고안한 영국의 컴퓨터 과학자이다.

그는 연구소에서 효율적으로 정보를 주고받을 수 있는 방법을 고안하다 웹이라는 서비스를 만들게 되었다. 이러한 웹을 어떠한 저작권도 행사하지 않으며 무료로 완전히 공개하여 규모가 커지고 복잡해지면서 오늘날까지 폭발적으로 성장하게 되었다.

1.2. 웹을 위한 언어 HTML(HyperText Markup Language)

• Hypertext: 문서와 문서가 링크 로 연결되어 있는 문서 시스템
• Markup: 태그(Tag) 를 이용하여 콘텐츠를 구조화하고 표시하는 특수한 텍스트 형식
• Language: 사람과 컴퓨터 모두 알아들을 수 있는 약속

2. 실습

2.1. 간단한 웹 서버 구현

ESP32를 서버 로 이용할 수 있다.

코드 작성

결과 확인

• 시리얼 모니터로 확인할 수 있지만 어떠한 이유에서인지 ESP32에 할당된 IP주소가 뜨지 않았다.

개인 스마트폰의 모바일 핫스팟 을 연결하였으므로 따로 IP주소 를 확인 가능하다.

브라우저의 주소창에 IP주소를 입력한 뒤 결과창을 확인한다.

2.2. HTML 문법을 활용한 폰트 편집

• 위 코드는 일종의 HTML 문법이다. 이는 아래 코드처럼 태그를 이용하여 HTML 형식으로 폰트를 편집할 수 있다.

• 폰트 크기와 스타일 등을 변경하려면 "text/plain"을 "text/html"로 변경해 HTML 스타일을 사용할 수 있도록 해야 한다.

• 결과를 확인한다.

3. 후기

웹 서버와 브라우저의 관계에 대하여 다시 한 번 확실하게 짚고 넘어갈 수 있는 계기가 되었다. ESP32같은 마이크로컨트롤러로도 웹 서버를 실행하여 클라이언트에게 웹 페이지를 제공할 수 있다는 것이 신기했다. 이처럼 PC나 마이크로컨트롤러를 통해 널리 쓰일만한 웹을 한 번 개발해보면 어떨까라는 생각을 하게 되었다. 실습을 진행할 때, 오류가 나거나 원하는 결과가 안나올 때 나만의 방법을 찾아가는 경험이 프로그래밍에 필요한 사고력을 기르는 데에 도움이 되는 것 같고 즐겁다.