brunch

You can make anything
by writing

C.S.Lewis

by 아무나 Jun 26. 2019

[생활코딩] HTML 5일차 - 내 홈페이지가 생겼다!


4일차에서 웹페이지라는 것을 만들어보았다. 하지만 아직 다른 사람이 내 웹페이지에 접속하지는 않고 혼자만 보고 기뻐하고 말았다. 이제 이걸 인터넷에 올려서 다른 사람들에게 내가 이렇게 멋진 것을 자랑하고 싶은데...


그런데... 그런데 웹이 뭐지? 인터넷이랑 같은 것 아니야?




1. 원시웹 - Internet vs Web


이 둘의 차이는 무엇일까?


정확히 말하자면 인터넷이 더 큰 것이다. 즉, 인터넷안에 존재하는 수많은 서비스 중 하나가 웹이다. 웹과 비슷한 층위로 이메일이나, FTP 같은 것이 있다.





2. 인터넷은 어떻게 발명된 걸까? 


1960년에 인터넷이 발명되었는데 이 발명에는 배경이 있다. 1960년은 한창 냉전이 발발했던 시기, 미국의 과학자들은 혹시 미국이 핵을 맞았을 때 어떻게 될지 시뮬레이션을 돌려보았는데, 통신 쪽에 큰 영향이 있을 것이라는 것을 알게 되었다. 그래서 이를 보안하기 위해 발명된 것이 바로 인터넷이었다.





3. 그렇다면 웹은?


1990년, 스위스 웹이 탄생. 왜 스위스일까?


그 이유는 당시 유럽에서 가장 똑똑한 수학자나 과학자들이 모두 모인 곳이 그곳에 있었기 때문이다. 바로 스위츠 제네바의 유럽입자 물리 연구소 [CERN] 그 곳에는 강입자 가속기라고 하는 LHC 가 있다.(총 둘레가 27km) 


이 엄청난 크기의 연구소는 입자 충돌을 통해 힉스라는 작은 입자를 발견하기 위해 세워진 것으로, 이렇게 충돌을 통해 입자가 깨어지면 더 작은 입자를 관찰 할 수 있을 것이라는 피터 힉스라는 사람이 세운 가설을 토대로 만들어진 연구소이다.


그러다보니 대략 127개국의 12000명의 천재들이 모여들어 있는 곳이었는데, 1980년도에 팀 버너스리라는 사람이 CERN에 비정규직으로 입사하여 [무엇이든 물어보세요(enquire)라는 프로그램을 만들게 되었다. 그 이후로 팀 버너스리는 CERN에 들어왔다 나갔다 하면서 좀 더 이 시스템을 만듬.


그러다가 1990년에 인터넷이 연결되면서 팀 버너스 리의 enquire에 http://info.cern.ch/라는 주소를 부여하면서 최초의 웹사이트가 등장. 지금도 들어가 볼 수 있다!






4. 인터넷이 성립되기 위해서 필요한 것? - 서버와 클라이언트


바로, 두 대의 컴퓨터와 두 개의 프로그램!

두 대의 컴퓨터를 연결하는 것이 인터넷이며, 이를 서로 연결하기 위해서는 웹 브라우저와 웹 서버가 필요하다.


컴퓨터1 (서버 컴퓨터)

- 실제로 페이지를 가지고 있고, 이 페이지에 대한 주소를 가지고 있는 컴퓨터(http://info.cern.ch/)

- 클라이언트 컴퓨터가 이 페이지를 요청하면 보내주는 역할 


컴퓨터2 (클라이언트 컴퓨터)

- 웹 브라우저를 통해 특정 주소(http://info.cern.ch/index.html)를 서버 컴퓨터로 요청

- 웹 서버가 보내준 html 파일을 띄움






5. 그래서 내가 만든 웹페이지를 진짜 인터넷에 올리려면?


좋다. 내가 만든 홈페이지를 인터넷에 진짜로 올리려면 서버 컴퓨터와 클라이언트 컴퓨터가 필요하다는 것까지 알았다. 이론을 알겠으니까 실제를 좀 알고 싶다. 그래서 어떻게 하면 내가 만든 홈페이지를 진짜 인터넷에 올릴 수 있는데?


1) 웹 호스팅 업체에 맡긴다

- 쉽다. 돈을 내고, 맡기면 열어준다. (역시 자본주의 세상에서는 돈이 최ㄱ...)

- 왜냐하면 서버 컴퓨터는 언제 클라이언트가 해당 주소를 요청할지 모르기 때문에 항상 컴퓨터를 켜놓아야 하기 때문에 개인이 서버를 만드는 것은 쉽지 않은 일이다.



2) 그럼에도 직접 웹 서버를 만든다

- 어렵다 그 과정에서 많은 인터넷 관련 지식을 획득가능하다!


좋아! 그럼 어렵지만 한 번 도전해 볼까?






6. 웹 호스팅 - github을 통한 무료 호스팅을 이용하자


실제로 웹을 호스팅 하기 위해서는 항상 컴퓨터를 켜두어야 하고, 밖에서 접속할 수 있도록 별도의 조치를 취해야 한다. (웹서버를 운영하기 위한 컴퓨터=호스터) 그래서 이런 일을 전문으로 하는 회사를 웹 호스팅 회사라고 부른다.


그렇다면 무료로 서버를 올릴 수 있는 방법은 정녕 없는 것인가?

다행히... 있다!


무료면서 가장 유명한 서비스는 코딩을 하거나 공부하려고 기웃거리는 사람이라면 누구나 한 번 쯤 들어본 적이 있는 github이다. 실제로 전세계의 수많은 오픈 소스가 이곳에서 만들어지고 있다. 






7. 깃허브 서버를 사용해 내 홈페이지를 인터넷에 올리는 방법


1) 깃허브 접속https://github.com

2) 로그인(없을시 회원가입)

3) 상단의 +버튼을 누르면 나오는 New repository 클릭

4) 파일 업로드로 여태까지 작업한 html 파일과 이미지를 올림

5) 올리고 난 주소 확인 가능(https://github.com/mwjang628/timothy_homepage)

6) 파일이 올라간 뒤 위에 셋팅으로 들어가서 GitHub Pages의 Source 부분을 master barnch로 바꾸면


아래와 같이 내 홈페이지가 퍼블리싱 되어 나온다.

내 홈페이지 주소 : https://mwjang628.github.io/timothy_homepage/ 

          

                                   

우왕 클릭해보니 내 사이트로 들어간다!!

인터넷으로 접속가능한 내 첫 웹사이트다. 폭풍같은 감동의 순간이 아닐 수 없다ㅠㅠ






8. 다른 무료 웹 호스팅 업체는 없나요?


사실 인터넷에 접속되어 있는 컴퓨터  모두 각각 '호스트'라고 불린다. 하지만 인터넷에 접속한 이유가 웹때문이라면 '웹 호스트'라고 따로 부르는 것이다. 

깃 헙 외에 다른 호스팅 업체를 찾고 싶다면 아래와 같이 검색창에 검색하면 좋다.


(free) (static) Web hosting


생활코딩에서 추천하는 무료, 혹은 저렴한 포스팅 업체는 다음과 같으니 참고를 바란다.


bitballoon.com

neocities.org

Amazon S3

Google Cloud Storage

Azure Blob





#코딩 #HTML #코딩독학 #홈페이지 #호스팅 #홈페이지제작










SF 소설을 좋아하신다면 아래 링크에서 밀리의 서재에서 출판한 책 [Dome - 기억 정렬 붕괴 - part1] 도 둘러봐주세요. part2 또한 집필이 완료되어 계약 대기 중에 있습니다.

종이책 출간도 가능하오니 관심 있으신 SF 출판사 분들의 연락을 환영합니다.

돔: 아무나 - 밀리의 서재 (millie.co.kr)




21세기 사랑에 관한 시 -  사랑의 파산

https://brunch.co.kr/brunchbook/love-bankruptcy

↑↑↑↑

길지 않으니 후루룩 읽기 편합니다!

빠르게 감성 충전이 필요하시면 읽어보시기를 강력 추천드려요!

매거진의 이전글 [생활코딩] HTML 4일차 - 웹사이트를 제작해보자

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari