생활코딩님 덕분에 인터넷과 웹의 시초에 대해 알게 되었습니다.
생활코딩님의 강의 말씀을 정리하면 다음과 같습니다. 인터넷이 도시라면 웹은 그 도시에 있는 건물 하나라 볼 수 있습니다. 인터넷이 도로라면 웹은 그 도로를 달리고 있는 자동차 한 대라 할 수 있습니다. 인터넷이 운영체제라면 웹은 그 운영체제 위에 있는 프로그램 하나로 이해할 수 있습니다.
인터넷이라는 전체 안에 웹이 존재합니다. 웹 이외에도 웹과 동급인 수많은 서비스들이 존재합니다. 대표적으로 email, FTP 등의 서비스가 있습니다.
1960년 internet 인터넷이 처음 등장했습니다.
이후 30년이 지나 웹이 등장했습니다. 인터넷은 수많은 통신장치들이 분산되어 연결되어 있습니다. 다수의 통신장치 중 어느 하나가 고장이 나더라도, 나머지 통신장치들이 그 역할을 수행할 수 있도록 설계되어 있습니다. 인터넷은 처음 등장한 1960년 이후부터 세계 각지로 퍼져나갔습니다. 초기에는 정부, 기업, 기관, 대학 등에서 사용하던 거대한 통신시스템이었습니다. 그러나 1990년 웹이 출현하면서 이전과는 다른 모습을 갖게 됩니다. 웹으로 인해 인터넷은 대중화의 국면에 접어들게 됩니다.
Web 웹은 처음 스위스에서 개발되었습니다.
1990년 10월 세계 최초로 웹페이지를 만들 수 있는 편집기가 개발되었습니다. 그다음 달인 11월에 세계 최초의 웹브라우저인 World Wide Web 이 만들어졌습니다. 1990년 12월에 웹 서버라는 프로그램이 개발되었습니다. 이 서버에는 info.cern.ch라는 주소가 부여됩니다.
인터넷과 웹의 관계 및 구조
인터넷에 대해 이해하기 위해 2대의 컴퓨터를 생각해봅시다. 이 두대의 컴퓨터는 인터넷으로 연결되어 있습니다. 컴퓨터 A에는 웹 브라우저라는 프로그램이 설치되어 있습니다. 다른 한 대의 컴퓨터 B에는 웹 서버라는 프로그램이 작동합니다. 웹 서버에는 http://를 포함한 info.cern.ch라는 주소를 갖고 있습니다. 웹 서버가 설치되어 있는 컴퓨터 B의 하드디스크에는 index.html이라는 파일이 저장되어 있습니다.
웹브라우저의 주소창에 http://를 포함한 info.cern.ch/index.html이라고 치고 Enter를 클릭하면 면 다음과 같은 일이 생깁니다. 위 주소를 입력받은 웹 브라우저는 전기신호를 B컴퓨터의 웹서버로 보냅니다. 이 전기신호는 index.html안에 있는 파일을 원한다는 내용을 담고 있습니다. 컴퓨터 B는 Index.html에 있는 내용을 찾아서 웹브라우저로 보냅니다. 이 내용을 웹브라우저가 읽어서 화면에 출력합니다. 이러한 과정을 통해 우리가 흔히 사용하는 웹이 작동하게 됩니다. 웹브라우저가 설치되어 있는 컴퓨터 A는 원하는 정보를 request 합니다. 컴퓨터 A를 정보를 원하는 고객이라는 의미에서 클라이언트 client 컴퓨터라고 지칭합니다. 웹 서버가 설치되어 있는 컴퓨터 B는 요청받은 정보를 response 합니다. 컴퓨터 B는 서버에 저장된 정보를 제공한다는 의미에서 서버 server 컴퓨터라고 합니다. 이 개념을 게임으로 적용해보면 게임을 하기 위한 프로그램이 설치되어 있는 컴퓨터를 게임 클라이언트로, 게임 회사가 가지고 있는 서버가 설치돼 있는 서버 컴퓨터로 표현할 수 있습니다. 이와 같이 채팅 서비스에 빗대어 본다면, 채팅 클라이언트와 채팅 서버로 표현할 수 있습니다.
웹서버를 사용하는 방법은 2가지가 있습니다.
직접 자신의 컴퓨터에 설치하는 방법이 있습니다. 또 하나의 방법은 서버를 갖추어 관리하는 호스팅 업체를 통해 사용하는 것입니다. 웹 서버를 운영하기 위한 컴퓨터를 호스트 host 컴퓨터라고 합니다. 직접 자신의 컴퓨터에 서버를 설치하여 호스트를 관리하는 것은 어려운 일입니다. 연결이 끊기지 않도록 컴퓨터를 계속 켜 두어야 하고, 외부와 연결하기 위한 다양한 작업들이 필요하기 때문입니다. 이러한 일을 대신해주는 회사가 웹 호스팅 업체입니다. 무료로 서비스를 이용해볼 수 있는 웹 사이트 깃허브 github.com에 방문해 보겠습니다. 이메일을 작성하고 회원가입을 해야 합니다. 회원가입 때 사용한 이메일에서 인증메일을 확인해야 합니다.
무료 호스팅 사이트 github
회원가입이 완료되었다면, html로 작성한 웹 문서를 github.com의 저장소에 보관할 수 있습니다. 회원가입 후 오른쪽 맨 위에 + 버튼을 누릅니다. New repository를 선택합니다. repository는 저장하는 공간, 저장소라는 의미입니다. Repository name을 작성합니다. Public으로 선택되어 있는지 확인합니다. 끝으로 Initalize this repository with a README를 꼭 체크합니다. Create repository를 클릭하여 저장소를 만듭니다. 중간 부분에 Add files를 누르면 Create new file과 Upload files를 확인할 수 있습니다. Upload files를 선택합니다. Drag files here to add them to your repository or choose your files라고 뜨는 공간에 작성해놓은 html 문서들을 드래그해서 드롭합니다.
이때, 주의해야 할 점이 있습니다. 바로 index.html 파일이 있어야 한다는 것입니다. GitHub에서는 랜딩페이지로 index.html을 인식하기 때문에, 가장 처음 메인으로 뜰 페이지를 index.html로 만든 후 업로드하면 됩니다. 파일명은 소문자로 작성합니다.
업로드가 완료되면 아래 Commit changes 아래 하늘색 빈칸에 업로드한 파일들이 어떤 내용을 담고 있는지 설명을 간단히 적어줍니다. version명으로 쓰는 것도 좋습니다. 가장 아래 Commit changes 녹색 상자 버튼을 클릭하면 실제로 보관이 이루어집니다. 만약에 파일을 수정한다면, 또 업로드를 합니다. 그리고 Commit changes 아래 하늘색 빈칸에 수정한 내용이 무엇인지, 몇 번째 버전인지 적어주면 다시 보관이 됩니다. 이런 식으로 파일이 수정될 때마다 변경사항을 저장하는 것을 버전 관리라고 합니다.
github에서 제공하는 서버를 이용하기 위해서 설정 변경이 필요합니다. settings를 클릭합니다. Settings 상단에 Repository name을 자신의 html이 들어있는 폴더명과 동일하게 설정되어 있는지 확인하고, 그렇지 않다면 수정해줍니다. 스크롤을 아래로 내리다 보면 GitHub Pages가 있습니다. None을 클릭하여 master로 변경하여 select folder의 /(root)를 선택하여 save 하고 나면 지정된 url을 확인할 수 있습니다.
다른 무료 웹호스팅 서비스를 원하신다면, free static web hosting으로 검색할 수 있습니다.
'코딩' 카테고리의 다른 글
html 동영상 링크 삽입하기 (0) | 2020.08.27 |
---|---|
Web1 , Web2 html 문법과 기타 유용한 태그 (0) | 2020.08.27 |
웹페이지 html 링크 연결하여 간단한 홈페이지 만들기 (0) | 2020.08.23 |
앵커 태그 anchor <a> 를 이용해 링크달기 (0) | 2020.08.22 |
웹 페이지의 기본 구조와 인코딩 위한 utf 8 (0) | 2020.08.22 |
댓글