웹사이트를 만들어보자

최근 편집: 2018년 7월 3일 (화) 17:32

이 문서는 웹사이트웹서버, 도메인 네임의 기본 원리를 풀어서 안내하고자 한다. 일반적으로 웹사이트에 대해 조금 아는 초보자들은 웹서버와 도메인 네임의 개념을 분리하는데 어려움을 겪는 경우가 많다. (주로 웹사이트 업체들의 상술 때문에 그렇다). 여러가지 기본 개념들을 하나씩 직접 해보면서 익혀보자.

나 혼자 쓰는 방구석 웹 문서

조금 과장해보자면 웹사이트는 정말 아무것도 아니다. 윈도우 사용자라면 메모장을 열어서(왼쪽 밑의 윈도 아이콘/"시작"을 클릭 한 뒤 그 상태에서 그대로 notepad 라고 입력하고 엔터를 누르면 된다) 다음을 입력해보자:

<html><body>세상아 안녕?</body></html>

웹의 표준 문법이 된 HTML 언어 규칙에 맞추어 (편의상 몇가지 요소는 생략했다) "세상아 안녕"이라는 글이 나오도록 한 웹 문서이다.

C: 드라이브 최상위 경로 위에 c:\temp 폴더를 하나 만들고[주 1] hello.html 로 저장하자. 저장 화면에서 파일 종류를 *.txt 에서 All file 로 바꾸어주어야 hello.html.txt 가 아닌 hello.html 로 저장하자.

이제 브라우저를 열어서 주소창에 (보통 naver.com 이나 google.com 이라고 타이핑 하는 그 줄에) c:\temp\hello.html 을 입력하고 엔터를 누르자. 브라우저의 왼쪽 위 구석에 "세상아 안녕?" 이 보일 것이다.

짠! 이것으로 웹사이트를 만드는 것에 성공했다!

웹사이트라는 것은 별 대단한 것이 아니라, 1) 브라우저에게 HTML 언어로 된 웹 문서를 던져주고 2) 그 문서를 해석해서 화면에 보여주도록 하는 것이다. 여기서 웹 문서 사이에 상호 링크를 달기 시작하면 "웹사이트" 사용자 경험의 기본 골격이 완성된다.

다만 이 "웹사이트"는 우리가 일반적으로 알고 있는 웹사이트와는 몇가지 차이점이 있다:

  • 다른 사람이 인터넷 상에서 볼 수 없다.
  • 이게 웹사이트가 맞을까? 내용이 너무 초라한데?

이런 요소들을 하나씩 추가하며 웹사이트의 작동 원리에 대해 알아보자.

다른 사람이 볼 수 있게 해보자

오른쪽에 있는 기기가 2000년대 초에 잘 팔리던 라우터. 왼쪽에 무선 와이파이에 연결 된 노트북이 보인다.

먼저 인터넷이 아닌, 가정 네트워크 상에서 서버를 실행시켜 보자. 컴퓨터들이 모여 구성하는 네트워크의 개념은 인터넷의 대중화보다 더 오래되었으며, 인터넷이 없는 상황에서도 기본적으로 지원되는 기능이다. 라우터/공유기만 있으면 인터넷 신호가 없더라도 네트워크 구성이 가능하다. 그 라우터에 유선으로 꽂힌 컴퓨터와 무선 와이파이에 접속한 모든 컴퓨터, 스마트폰, 타블렛 등 인터넷을 활용하는 모든 기기는 네트워크의 일부가 된다.

네트워크에 접속한 기기 사이에서는 데이터 교환이 가능하며, 웹 서버 같은 것을 돌려 "사설 인터넷" 같은 기능이 가능하다. 네트워크에서 웹 서버를 돌리는 것은 별 의미가 없어도, 미디어 서버 같은 기능은 좀 큰 집에서는 자주 볼 수 있는 기능이다. 데스크탑 컴퓨터의 하드에 들어있는 동영상을 와이파이에 접속되어 있는 다른 기기, 노트북, 스마트TV, 스마트폰, 타블렛 기기로 연결해서 와이파이 상에서 실시간으로 스트리밍하며 보는 것이다.

nginx 등의 간단한 윈도우용 웹서버 프로그램을 설치하면 컴퓨터가 웹서버로 기능하게 된다. (이 부분을 쉽게 따라하기 위해서는 웹서버 설치 및 설정 설명이 더 필요한데 일단 귀찮아서 나중에..) 웹서버 기본 설정을 확인하고 아까 작성한 hello.html 을 웹 서버 루트 폴더로 옮기고, 컴퓨터의 네트워크 내부 IP 주소를 확인하자.

ipconfig 실행 결과

내부 IP 주소를 알기 위해서는 컴퓨터에서 윈도 시작 버튼을 누른 후 CMD 라고 입력하고 실행시킨 후, ipconfig 라고 입력하자. 그러면

IPv4 address.... 192.168.1.242

같은 것이 뜰 것이다. 여기서 이 4개의 숫자로 이루어진 번호가 컴퓨터의 IP 주소이다. 하나의 네트워크에 접속한 모든 기기가 하나씩 내부 IP 주소를 부여받고, 주소 선택은 라우터가 알아서 해준다. 특별하게 설정하지 않는 한 내부 IP는 보통 192.168. 으로 시작하고, 세번째 숫자는 설정에 따라 1 또는 0이 주로 쓰이며, 그 후 마지막 네번째 숫자가 기기마다 달라지는 숫자이다.

와이파이에 연결된 스마트폰을 이용해서 이 웹페이지를 열자. 주소창에

192.168.1.242/hello.html 

라고 입력하면 된다. (물론 1.242 대신 자신의 주소를 입력해야 한다) 세상아 안녕? 이 뜨면 성공한 것이다. 잘 안 되었으면, 다시 컴퓨터의 웹서버 설정과, 어느 폴더에 HTML 파일을 넣어두어야 하는지 확인해보자. 혹시 공유기/라우터가 없는건..가?

인터넷에서 볼 수 있게 해보자

드디어 바깥 세상으로 나갈 준비가 되었다. 이 단계를 진행하기 전에 숙지 할 점은, 개인이 직접 운영하는 수제 웹 서버를 별다른 보안 대책도 없이 인터넷에 오랫동안 노출시키면 언젠가는 해킹 공격의 대상이 될 수 있기 때문에, 시험삼아 해보고 나서는 반드시 파이어월 설정을 복원하고 웹서버 프로그램도 꺼두는 게 안전하다는 점이다. 한두시간 정도 돌리는 것은 괜찮다.

먼저 나의 공개 IP 주소가 무엇인지 알아야 한다. (내부 IP 주소와 다르다) 제일 간단한 방법은 구글에서

my ip address

라고 검색하는 것이다. 그러면 검색 결과 맨 위에 "Your public IP address"라고 주소를 보여준다.

두번째는 웹 서버가 이 주소로 요청이 들어와도 작동을 하도록 하는 것인데, 서버의 설정을 특별히 건드려서 보안을 높이지 않았다면 원래 설정 그대로 작동할 것이다.

DSL 서비스를 사용할 경우 내부 라우터와 외부 인터넷을 연결해주는 모뎀

세번째는 라우터/공유기에서 80 번 포트를 여는 것이다. 같은 IP 주소라도 여러가지 방법으로 상호작용이 가능한데, 특정 상호작용 요청마다 다른 "포트"를 통해 연결을 한다. 브라우저 창에 입력 할 때는

105.32.201.20:80

이런 식으로 콜론을 붙여 포트를 표시한다. 여러가지 요청에 따라 다른 포트를 사용하는데, 인터넷에서 대중적으로 알려진 것은 웹 밖에 없기 때문에 일반인이 특정 포트를 사용할 가능성은 전혀 없다. 웹서버용 포트는 일반적으로 80번을 사용하는데, 브라우저에서 주소를 입력하면 당연히 80 포트일 것일 것이기 때문에 80포트에 접속을 한다.

왠만한 집의 인터넷 보안 설정에서는 이 포트가 닫혀있을 것이다. 웹서버의 보안 취약점을 노리고 온갖 해킹 시도가 판을 치기 때문에 괜히 포트를 열어둘 필요가 없기 때문이다. IP 주소가 105.32.201.20 이라고 치자. 그러면 컴퓨터 브라우저 주소창에 다음을 입력하자

105.32.201.20/hello.html

"세상아 안녕"이 뜨면 80 포트가 열려있는 것이다. 안 뜨면 라우터/공유기 설정에서 이 포트를 열어야 한다.

포트가 열려있으면 이제 시험을 해보자. 스마트폰에서 와이파이를 끄고, 상기 주소를 입력하자. 스마트폰에 "세상아 안녕"이 표시되면 성공이다. 친구에게 전화를 해보자! "친구야 너네 집에서 이 주소를 입력해봐! 내 집 컴에 들어있는 글이 나온다구!"

집에 있는 컴퓨터에 직접 연결하는 것이기 때문에 컴퓨터를 끄거나 네트워크 연결을 끊으면 바로 접속이 안 된다. 또 다른 점은, 대부분 가정용 인터넷은 IP 주소가 연결 할 때마다 변하기 때문에, 모뎀을 껐다키거나 또는 밤새 IP 주소가 변할 수도 있다. 그러면 새 주소로만 접속이 가능하다.

복습: 웹 서버의 원리

기본적으로 웹 서버는 하드디스크에 웹 문서 HTML 파일과 이미지 파일들을 잔뜩 담고 있다가 공개 IP 주소로 접근 요청이 들어올 때마다 파일들을 내보내주는 컴퓨터에 지나지 않는다. 이 컴퓨터가 24시간 켜져있고 IP 주소가 안정적으로 유지되면 본격적으로 웹사이트를 운영할 수 있는 서버로 구실을 하게 된다. (서버 주인이 잘 때는 꺼두었다가 낮에만 켜서 운영하는 것도 가능은 하지만.. 그러면 밤에만 웹사이트 접속이 안 되는, 인터넷 시대에 좀 적응 안 되는 사태가 발생하게 된다.)

도메인 네임을 씌우자

동적 웹서버의 발흥

LAMP 스택

워드프레스

로드밸런싱

부연 설명

  1. 윈도우의 기본 보안 설정 상 c:\ 에는 파일을 만들 수 없게 되어있다.