생활코딩 HTML

#<a>

• HTML의 약자안 Hyper Text Markup Language 에서 앞부분인 Hyper text를 가능하게 해준 태그가 있다. 
• 이 태그는 <a>로, anchor의 첫글자를 딴 태그. 닻을 의미하는 단어로 정보의 바다에 정박한다는 의미를 담고 있음. 
• 이 태그는 바로 Link를 의미한다.
• 사용설명서를 찾을 때 html specification을 검색해보자. W3C recommandation을 찾을 수 있는데 이 기관은 직접 웹을 만드는게 아니라, 미래에 어떻게 웹이 나아가야되는지를 말해주고 개발자들이 참고해서 웹을 만들게 된다. 
• https://www.w3.org/TR/2011/WD-html5-20110405/

HTML5

 

• 내가 링크를 걸고 싶은 문장이 있다면 어떻게 걸 수 있을 까
• 내가 링크를 걸고 싶은 문장을 <a></a>로 감싸준다. 하지만 이렇게만 걸면 컴퓨터는 무슨 링크를 걸고싶은지 알수가 없겠지. 그래서 하나 더 추가하는 요소가 href다. href==hyper text reference(참조)의 약자이다!

<p><a href="https://www.w3.org/TR/2011/WD-html5-20110405/">Hyper Text Markup Language (HTML)</a></p>

• 클릭했을 때 새 탭이 열리게 하고 싶다면?
• target="_blank"

<p><a href="https://www.w3.org/TR/2011/WD-html5-20110405/" target="_blank">Hyper Text Markup Language (HTML)</a></p>

• 이 링크가 무슨 사이트인지 툴팁으로 알려주고 싶다면?
• title="내용" 

<p><a href="https://www.w3.org/TR/2011/WD-html5-20110405/" title="hyper text specification">Hyper Text Markup Language (HTML)</a></p>

 

# Website

• link는 관련된 정보와 정보를 서로 연결하는 본드,실같은 존재 
• 책처럼 각각의 페이지를 연결해보자
• 링크를 걸기 위해서 링크를 걸고 싶은 곳에 <a href=""></a>를 걸어주자
• ""안에는 내가 걸고 싶은 .html문서를 적어주기 
• 아톰에서 각각에 해당하는 파일을 만들어 주고 연결해주면 된다. 
•  

# The Primitive Web

• internet과 web은 다른 개념이다. 인터넷 안에 웹이 들어가있는 개념

• 1960년대에 인터넷은 만들어졌다. 인터넷은 중앙집중적이지 않고 여기저기 분산되어 있는 형태이다. 
• 1990년, web은 스위스에서 탄생함. 
• 인터넷은 최소 2대의 컴퓨터가 필요함. 정보를 주고 받은 과정에 있어서 browser가 server에 요청을 하면 server는 가지고 있는 정보를 다시 응답해주는 개념. 요청하는 컴퓨터를 client 컴퓨터, 응답하는 컴퓨터를 server 컴퓨터로 부르기로 한다.

 

#웹 호스팅

• 인터넷에 하나하나 연결된 컴퓨터를 호스트라고 함. 이 컴퓨터를 빌려주는 사업을 호스팅이라고 하고 이 사업을 클라우드라고 부르기도 한다.
• 깃허브를 통해서 내 웹사이트를 업로드하고 서버에 연결 할 수 있음 

 

#웹서버 운영하기

• 구글에서 Web server for chrome을 설치하면, 어느 디렉토리로 연결할지 설정 할 수 있고 그 뒤에 그 폴더를 연결하하고 실행시키면 서버의 주소를 얻을 수 있다. 
• ctrl + O로 파일을 직접 열었을 때와, 웹서버로 연결해서 열었을 때의 차이는 뭘까 ? 전자는 그냥 파일을 웹브라우저를 통해 열었다고 볼 수있고 후자는 웹브라우저가 웹서버를 통해서 파일을 열었다고 볼 수 있다. 서버를 통해서 접속되었다면 주소가 http://로 시작하게 된다.
• http의 약자는 Hyper Text Transfer Protocol. 
• Internet protocol address는 소위 IP address라고 불리는 것. 127.0.0.1은 나 자신 컴퓨터를 가리키는 말. 같은 컴퓨터 안에 있는 주소에 접속해 있다는 말

 

#apache 설치

• apache HTTP server : 아파치 소프트웨어 재단에서 관리하는 오픈소스, 크로스 플랫폼 HTTP 웹 서버 소프트웨어
• bitnami WAMP설치 
• bitnami manager로 서버 on/off가능함. 켜져있어야지만 서버 운용가능 
• bitnami가 설치된 파일에서 htdocs에 우리가 여태까지 작업한 파일을 덮어써주면 그대로 사용이 가능 

 

#communication btw web server and web browser

• 127.0.0.1은 전세계에서 약속한 주소인데, 자기자신의 컴퓨터로 접속하는걸 의미함 
• 나는 사실 컴퓨터를 한대 더 가지고 있다. 바로 스마트폰! 둘을 연결할 때는 같은 IP주소를 쓰는 인터넷을 사용해야 함.  
• 내 컴퓨터의 IP 주소를 알아보려면, 와이파이 버튼을 오른쪽 클릭해서 [네트워크 및 인터넷 설정열기]에서 [속성]을 눌러보면 IP 주소를 확인 할 수 있다.
• 스마트폰에서 저 아이피 주소를 입력해 들어가면 내가 만든 웹 페이지를 볼 수 있음