20210128_인터넷 동작 ,웹 관련 용어, URL, 도메인 네임, HTTP, Hyperlink, Django환경설정

웹 서버 구축을 위한 DJango 프레임 워크를 배우기 전에 사전적인 지식이 필요할듯 했다.
그냥 듣기에는 너무나도 사전지식을 이야기 해주지 않았기에 능동적으로 인터넷의 동작 원리와 발전 그리고 웹에대한 내용들 까지
Mozilla 공식 문서를 참고하여 공부해 보았다.
Mozilaa_How does the Internet work?
참고로 한글 지원도 한다. 우측 상단에 langauge change를 지원한다.

인터넷 동작 원리

• 컴퓨터와 컴퓨터를 연결하면 컴퓨터가 많아지면 수많은 선들이 많이 생겨 복잡해짐 -> 라우터를 중심으로 컴퓨터를 연결
• 더욱 확장시켜 라우터와 라우터를 연결하여 커짐 -> 하지만 그들만의 인터넷이지 먼 거리와 연결하기 힘듦
• 그래서 전화선은 보급이 많이 되어 있기 전화선을 활용하는데 전화선을 통해서 연결하려면 모뎀이 필요함
• 그런 상태에서 메세지를 보낼려면 ISP 인터넷 서비스 공급자가 필요함
• ISP는 핵심 라우터등을 연결 시켜 먼 거리도 연결시킴
• 그리고 메세지를 보내기 위해서는 보내려는 특정 주소를 알아야 함 -> 각 컴퓨터들은 모두 ip주소를 가지고 있음 그래서 이를 통해 보내려고 하는 곳을 지정하여 보낼수 있음
• 하지만 ip주소는 사람이 기억하기 힘들어서 도메인 네임이라는 주소로 바꾸어 기록함
• 이를 통해서 모든 컴퓨터가 연결이 됨 -> 이를 인터넷이라고 함 즉, 인터넷은 인프라 구축 망일 뿐임
• 수많이 연결된 컴퓨터 중 일부가 웹 서버로서 서비스를 제공함 -> 웹은 인터넷 인프라 위에 구축된 서비스 임

웹 페이지, 웹 사이트, 웹 서버, 검색엔진

웹 서버 : 호스팅 컴퓨터, 요청에 맞게 웹사이트를 찾아 브라우저로 보냄 ex. 도서관
웹 사이트 : 웹페이지의 모음 ex. 장르- 과학, 사회, 경제, 인문 등)
웹 페이지 : 브라우저에 보이는 html문서 ex. 각각의 책이고 각 인덱스가 있음 ip
검색엔진 : 웹 페이지를 다른 웹사이트에서 찾게 도와주는 웹 사이트
브라우저 : 웹 페이지를 검색하고 보여줌(소프트 웨어임)

웹 서버

• 웹 서버 : 하드웨어, 소프트웨어가 따로 또는 같이 동작
• 하드웨어 측면 : 웹 서버의 소프트웨어 , 웹 사이트 컴포넌트 파일들(HTML, CSS, images, stylesheets, JS)을 저장하는 컴퓨터 -> 인터넷에 연결된 다른 기기들이 컴포넌트 파일을 주고 받게 함

• 소프트웨어 측면 : 웹 사용자가 어떻게 호스트 파일에 접근하는지 관리(HTTP서버로 국한)
• HTTP서버 : URL(Web addresses), HTTP(보여주기 위한 프로토콜)의 소프트웨어 일부임

• 요청방식 : 브러우저 -(HTTP를 통해 파일 요청)-> 웹서버(하드웨어)
• 반응방식 : 웹서버(하드웨어)~HTTP서버(소프트 웨어) -(HTTP를 통해 전송)-> 브라우저

• 웹 사이트 공개시 필요한 정적, 동적 웹서버
• 정적 웹 서버(스택) : HTTP서버(소프트웨어)가 있는 컴퓨터(하드웨어)
• 동적 웹 서버 : 정적 웹서버 + 소프트웨어(애플리케이션 서버, 데이터베이스)
  • 전송전에 애플리케이션 서버가 업데이트하고, 애플리케이션 서버가 HTTP서버를 통해 파일 전송(애플리케이션 서버는 데이터 베이스(콘텐츠)로 HTML 템플릿을 채움 ex. 위키피디아, MDN -> HTML 문서가 아님 그저 HTML템플릿, 데이터 베이스로 되어 있음) -> 내용전달, 관리가 좋음

• 개인 컴퓨터로 불러올 파일을 보낼수 있지만, 전용 웹서버에 저장하는 것이 훨씬 편리함
• 전용 웹서버 : 항상실행, 항상 인터넷과 연결, 항상 같은 ip주소 가짐, 제3자에 의해 유지 보수 -> 호스팅 제공자를 찾는 것이 좋다.

HTTP

HTTP(hypertext transfer prodocol) : 두 컴퓨터 간의 hypertext(연결된 웹 문서)를 어떻게 전송하는지 알려줌 (통신규약, 문자로 된, 독립적인 프로토콜)

• 문자로 되어 있어 모든 명령어를 사람이 읽을 수 있음
• 서버 혹은 클라이언트는 이전의 통신을 기억 못함(입력값을 통해 처리한 전 단계의 데이터를 기억하고 있지 않음) -> 그래서 애플리케이션 서버 필요

• HTTP 서버가 들어오는 요청들에 대해 응답하고 처리해야함
  • 요청받으면 먼저 HTTP서버는 요청받은 URL이 존재하는 파일과 매칭 되는지 확인
  • 매칭되면 파일 내용을 브라우저에게 돌려줌, 그렇지 않으면 애플리케이션 서버가 필요한 파일을 구축하여 보냄
• 둘다 불가능하면 에러 메세지 반환(404 not found)

정적 vs 동적 컨텐츠

서버는 정적, 동적 콘텐츠를 모두 제공가능하나 동적 콘텐츠의 경우 복잡하고 힘들다.

예시) 애플리케이션 서버(Kuma) : 데이터베이스로 부터 내용들을 받고 구성하고 HTML템플릿 안에 집어 넣고, 결과를 보냄
이 애플리케이션 서버 구축은 Python 언어로 Django프레임워크를 통해 이루어 진다.

애플리케이션 서버는 아주 많고 각 특성에 따라 다양하게 존재하고 콘텐츠 특성에 따라 특화되어 있다.

URL

URL(Uniform Resource Locator) : 웹에 게시된 자원을 찾기 위해서 browser에 의해 사용되는 메카니즘으로 웹에서 정해진 유일한 자원의 주소

예시) http://www.example.com:80/path/to/myfile.html?key1=value1&key2=value2#SomewhereInTheDocument

• http : 프로토콜 규약(전송 방법) 예외 적으로 'ftp, mailto:'도 있음 이 프로토콜은 메일 및 파일 전송 관련 규약임
• www.example.com : 도메인 이름(어떤 웹서버가 요구되는지 가르킴), 대안(IP주소)
• :80 : 포트(Port)로서 웹서버 접근을 위해사용되는 gate를 가리킴, 보통 생략됨 (HTTP - 80 , HTTPS(보호) - 443)
• /path/to/myfile.html : 웹서버에서 자원에 대한 경로(과거 물리적 파일 위치 -> 요즘 추상적 파일 위치)
• ?key1=value1&key2=value2 : 웹서버에서 제공하는 추가 파라미터(parameters) & 기호로 구분된 키와 값으로 짝을 이룬 리스트 형태(각각 웹서버 마다 파라미터 언급 규칙이 존재), 자원 반환전 추가적인 작업을 위해 파라미터 사용
• #SomewhereInTheDocument : 앵커(anchor)로서 자원안에서 북마크 역할. 해당 부분에 위치한 내용을 보여주기 위해 브라우저에게 방향을 알려줌. fragment idenifier(부분 식별자)라고 알려져 요청이 서버에 절대 보내지지 않고 # 뒤에 오는 부분은 가치가 없다.

절대 URLs vs 상대 URLs

절대경로

• 위에서 언급한것은 절대 URLs임, 검색시 기본적으로 모두 HTTP를 사용하기 때문에 포트와 프로토콜은 생략된다. 그외에는 필요하다.
• 그래서 절대 URL의 경우 도메인까지 제외한 나머지 모두를 의미함(웹루트 디렉토리로 부터의 물리적 경로)
• /로 시작함

상대경로

• 현재 실행되는 문서의 위치를 기준으로 한 디렉토리의 경로(서버가 바뀐 경우 디렉토리 구조만 지키면 일일히 경로를 수정하지 않아도 된다는 장점이 있음)
  • 현재 위치에 같이 있으면 파일 이름 , ./파일이름
  • 사용할 파일이 한 단계 상위에 있으면 ../파일 이름
  • 사용할 파일이 두 단계 상위에 있으면 ../../파일 이름
  • 사용할 파일이 한 단계 하위에 있으면 디렉토리명/파일 이름
  • 사용할 파일이 두 단계 하위에 있으면 디렉토리명/디렉토리명/파일 이름

• 처럼 사용하며 웹루트 디렉토리 하위 및 가상 디렉토리 하위에서의 논리적 경로를 가리킴 (/가 없이 시작함)
• skills/infrastructure/understanding_urls 라면 -> 웹 루트 디렉토리에서 바로 붙고
• ../css/display 라면 -> 웹 루트 디렉토리 기준 한단게 상위 디렉토리에서 접근하여 붙게 된다.

하이퍼링크 (Hyperlinks)

웹의 기본 목적 : 텍스트 문서를 통해서 도달하여 읽고, 찾기쉬운 방식 제공
과거 긴 URL을 타이핑 하는 것은 어려움 -> 링크를 통해서 연결하였다.
링크 : URL이 연결된 텍스트임

• 링크의 유형들
  • 내부링크(Internal link) : 나의 웹사이트 내 두개의 웹사이트를 연결하는 링크(새페이지 생성시 적어도 1개 웹페이지는 링크를 걸어 두어야 한다. 그렇다고 모두 연결하는 것은 비효율적임)
  • 외부링크(External link) : 나의 웹사이트에서 다른 사람의 웹사이트로 가는 링크 (이를 통해 웹 실현)
  • 들어오는 링크(Incoming links) : 다른 사람의 웹사이트에서 나의 웹사이트로 가는 링크(한번 링크로 연결되면 역으로 링크 걸필욘 없다)
• 외부 링크와 들어오는 링크는 검색엔진에서 중요하게 작용한다.

앵커 (Anchors)

링크(두개의 웹사이트 연결)와 다르게 앵커 한 문서 내에서 다른 부분들을 연결함(새문서를 불러오는 것X)

링크와 검색엔진

검색엔진은 웹페이지 크롤링시 웹페이지의 링크를 따라가면서 웹사이트를 인덱싱 함.
또한 적절한 검색 결과를 보여주기 위해서 링크의 텍스트도 활용함.

• 검색 엔진 최적화 (SEO) 검색 결과에 웝페이지 랭크를 높게 만드는법에 대한 연구, 웹페이지의 링크 사용을 증가시키는 것

도메인 명

도메인 구조 : 몇개의 파트를 점으로 구분 (label2.label1.TLD) 오른쪽에서 왼쪽으로 읽음

• TLD(Top-Level Domain) : 최고레벨 도메인으로 서비스의 목적을 알려줌, 다양한 TLD가 존재하는데 일반적을 엄격한 기준충족은 없고 특정하게 .us, .kr 등 로컬 TLD의 경우 서비스의 특정 언어 제공, 특정 국가에서 호스팅되어야 하는 기준을 요구할수 있다.

• label : 라벨은 3개의 라베을 구성하거나 그이하도 상관 없음, 딱히 엄격하지 않고 자유롭게 무엇이든 가능함

• 도메인 이름은 소유가 불가능 하고 일정기간 도메인 이름을 사용할 권리에 대해 비용을 지불하여 사용가능하며, 권리는 갱신이 가능하고 갱신시 다른 사람의 신청보다 우선함

• 이용가능한 도메인 네임을 찾으려면 도메인 이름 등록 기관 사이트로가서 가능하고 사이트 내 쉘에서 whois 도메인 이름 명령어를 사용하여 도메인 상태를 볼 수 있다.

• 이러한 도메인 네임들을 관리하는 곳을 DNS라고 하고 전세계 DNS 서버에 저장되어 최상위 DNS 서버 등을 참조하여 관리한다. 그렇다 보니 한번 등록하면 다른 서버 및 최상위 서버까지 수정되어야 하므로 시간이 걸린다.

• DNS Request 작동 방법
• 컴퓨터 사용자가 브라우저에 도메인 네임을 입력한다
  • 컴퓨터 내에 로컬 DNS 캐시와 대조하여 존재하면 바로 ip주소로 변환하여 웹서버와 협상
  • 만약, 존재하지 않으면 DNS서버에 요청하여 DNS서버가 일치하는 도메인 네임의 ip주소를 컴퓨터로 전송 -> ip 주소로 웹서버와 협상

Web framework

웹개발, 프레임 워크, 웹 프레임 워크

• 프레임 워크 : 자주 사용되는 코드 체계화, 라이브러리 보다 더 큰 규모로 프로젝트의 기반
• 라이브러리는 바꿀수 있지만 프레임 워크는 바꿀수 없기에 의존도가 높음
• 웹 프레임워크 : 웹 개발에 필요한 기본적인 구조와 코드(클래스, 함수 등)가 짜져있음
• 웹개발 > 웹 프레임 워크(url 파싱, 요청 파싱, 응답 생성, 세션 관리, 데이터베이스 연동, 관리자 페이지) > 개발 영역(비즈니스 로직, 데이터 정의)

Django

1. 가상환경 설정

한 pc에서 여러 프로젝트 사용시, 각 프로젝트에 같은 패키지를 사용하는데 버전이 다른 것을 사용한다고 할때 계속해서 프로젝트 이동시 패키지를 재설치 해줘야 하는 문제가 생김 -> 프로젝트 별로 패키지를 관리하는 공간이 분리될 필요가 있음

• 가상환경을 제공하는 패키지 중 하나 : virtualenv
• 가상환경을 구축하고 싶은 폴더에서 터미널에 pip install virtualenv로 패키지 설치
• virtualenv 가상환경 이름 터미널에 입력하여 가상환경 생성
• cd Scripts -> activate 해서 가상환경 활성화 시킴
• pip install django를 통해서 장고 설치

• vscode내 터미널에서 가상환경 활성화 문제 해결 사이트

2. 장고 기초 구조 만들기

• 프로젝트(구조) 만들기 : django-admin startproject 프로젝트 이름
• 앱(구조) 만들기 : 프로젝트로 들어간 상태에서 django-admin startapp 앱 이름