코린이의 생활코딩 WEB1 - 16~18

16. 원시웹

 

인터넷과 웹이 어떻게 새상에 등장하게 될 것인가?

이 혁명이 어떻게 시작되고 지속되고 소멸되는가

 

Internet 과 WEB은 같을까 다를까?

다르다.

 

Internet이 도시(도로)라면 WEB은 그 도시(도로)의 건물 하나(자동차 한 대)와 같다.

Internet이 운영체재라면 WEB은 그 운영체재 위에 있는 프로그램(.exe)이라고 할 수 있다.

 

그 외에도 web과 동급인 수많은 서비스들이 있다. 출처:생활코딩

1960 Internet 등장

핵 공격 시, 통신 마비가 문제됨

핵 공격에도 마비되지 않을 통신 서비스 개발 ►Internet : 중앙이 없음, 수많은 통신장치들이 분산하여 역할을 수행함

거대 기관에서 사용되었던 통신 시스템

 

1990 WEB 등장

웹의 고향은 어딜까? swiss

스위스에 무엇이 있는가? 제네바 물리학연구소, 강입자가속기(lhc:아주작은입자를 보는 장치)

 

Enquire : 

 

90.10 연구소에 Internet이 들어옴

90.11 세계 웹 브라우저 World Wide Web

90.12 info.cern.ch → primitive web(원시웹)

WEB의 메소포타미아(웹의 시작점)

대중화의 길을 걷게 됨

 

17. 인터넷을 여는 열쇠 : 서버와 클라이언트

2대의 컴퓨터

- Web Browser : http://info.cern.ch/index.html 

http://info.cern.ch

- ▪︎ Web Server : http://info.cern.ch

   ▪︎ index.html 

http://info.cern.ch

 

 

서로 정보를 주고 받는다. (출처 : 생활코딩)

요청하는 컴퓨터를 client 컴퓨터

응답하는 컴퓨터를 server 컴퓨터

 

웹브라우저 = 웹클라이언트

 

수학은 이해하는 게 아니라 익숙해지는 것

우리도 익숙해지도록 하면 괜찮다.

 

web sever test를 하는 두 가지 방법

1. web sever를 내 컴퓨터에 까는 것

2. web hosting 업체에 의뢰하는 것

★ web hosting을 먼저 해보고, web server를 통해 원리를 파악하는 방향성을 추천한다.

 

어렵거나 시간이 없으면 hosting만 보고 끝내도 된다.

 

18. 웹호스팅 : github page

host : Internet에 연결된 컴퓨터 하나 하나

hosting : 컴퓨터를 빌려주는 사업(=cloud)

WEB hosting : hosting 중에서 컴퓨터의 웹서버와 같이 웹을 동작하기 위해서 필요한 소프트웨어까지 설치해서 빌려주는 비즈니스

                        ◼︎ GitHub.com : 유명한 무료 서비스

가입 후 제일 먼저 해야 할 것은 우리의 소스 코드를 저장할 공간인 저장소(Repositories)를 만들어야 한다.

오른쪽 상단의 +를 클릭하면 새로운 저장소가 뜬다.

저장소의 이름을 정해주고, code Public(비밀이 없으니까 후후)

우리의 첫 번째 저장소 짝짝짝

우리가 저장한 소스 코드를 깃허브 닷컴에 업로드 해야 한다.

uploading an exisiting file. 클릭

 

파일 업로드 방법

1) choose your files 클릭

Commit changes : 어떤 작업을 했는지 적어보기

2) 파일 업로드 하기

index.html을 클릭하면 파일의 내용을 볼 수 있다.

이 주소를 다른 사람에게 공유하면 저 소스 코드 자체를 다른 사람과 공유하고 토론할 수 있다.

github는 웹사이트 운영할 수 있는 기능을 제공, githurb page

settings 클릭 시 현재 저장소의 설정을 할 수 있는 페이지가 나옴

→ 사이드 바의 pages 메뉴 클릭 → 웹포스팅의 기능을 활성화 시킬 수 있는

none → main으로 변경

깃허브 닷컴에서 웹포스팅을 활성화시키면 금방 되지 않고 시간이 걸린다. 어떻게 일이 처리되고 있는지 확인이 안 되면 답답하고 불안해짐

→ 이때, 어떻게 일이 진행되고 있는지 확인할 수 있는 페이지 actions가 있다.

화면을 우선 두 개를 띄우고

actions 메뉴 : 저장소에서 일어나고 있는 여러 가지 작업들이 어떻게 진행되고 있는지 확인하는 페이지

 

save 버튼을 누르면 actions 항목의 UI가 다른 모습으로 변경된 모습

pages build and deployment 클릭 시, build가 진행되고 depoly가 진행된다고 보임

build 클릭 : 어떤 절차가 진행되는 과정을 보여줌

↓ build 라는 절차가 끝난 후

depoly 절차가 시작됨 : 배치하는 작업

 

전 세계의 누구나 우리가 만든 웹사이트를 방문할 수 있는 엄청난 일을 해냈다!

 

만약 파일의 내용을 변경했다면

저장소의 홈(code)에 방문해서 add file-Upload files 클릭 - 우리가 작업한 파일을 다시 드래그해서 업로드 - Commit chandes 에 어떤 작업을 했는지(예:수정) 적고 변경 시 자동으로 갱신

진행 상황을 보고 싶다면 actions - pages build and deployment click 하여 진행 상황 파악 가능

 

이번 강의에서 한 일을 이론적으로 정리해보면

1. 우리의 컴퓨터, 우리가 만든 웹페이지가 있다.

2. 우리의 웹페이지를 보고 싶은 방문자가 있다.

3. 서비스를 대신할 호스팅 업체가 있다. (githurb 닷컴)

☝🏻우리가 파일을 업로드하면 소스 코드가 웹호스팅으로 업로드가 된다 _출처:생활코딩

✌🏻웹호스팅 업체에서는 웹호스팅에 설치된 웹서버를 활성화 한다. → 컴퓨터에 도메인 이름을 부여한다. _출처:생활코딩

🤟🏻방문자가 도메인 이름에 접속하면 웹서버가 index.html을 읽고 web server는 방문자에게 index.html의 소스 코드를 전송한다. → 방문자의 웹 브라우저에 웹페이지가 표시되면 끝난다.       (출처:생활코딩)

WEB hosting을 이용하는 장점 : 쉽다. 우리는 코딩만 하면 된다. 나머지는 업체가 알아서 한다.

                                                  → 기업에서는 이러한 웹호스팅 업체를 사용하고 있다.

                                        단점 : 원리가 감춰져 있다.

                                                  → WEB server의 동작원리, 직접 제공하는 서비스에 대한 희열을 느끼고 싶다면 그 강의를 도전해라!