목록웹 프로그래밍 (35)
Dolphins의 HelloWorld
HTML tag의 종류 태그는 그 의미에 맞춰서 사용해야 한다. (링크, 이미지, 목록, 제목 등등) 흔히 사용하는 태그로는 anchor, img, ul/li, heading, p 태그 등등이 있는데 많은 태그를 모두 외울 필요는 없으며 필요한 태그를 찾아서 적절한 의미에 맞는 태그를 사용하는것이중요하다. 다음과 같이 html tag list를 검색해서 들어가면 이렇게 여러가지 html 태그의 기능에 대해 쉽게 찾아볼 수 있다. 태그들을 사용하여 간단한 실습을 해보자. 출처 : edwithhttps://www.edwith.org/boostcourse-web/lecture/16669/
클라이언트/서버 구조 - 클라이언트는 서비스를 제공하는 서버에게 정보를 요청하여 응답받은 결과를 사용한다. DBMS(database management system) - 다수의 사용자들이 데이터베이스 내의 데이터를 접근할 수 있도록하는 소프트웨어 DBMS에 접속해서 동작하는 클라이언트 프로그램이 한때 많이 만들어졌다.그런데 이러한 방식의 문제점은 클라이언트의 로직이 많아지고클라이언트 프로그램의 크기가 커진다는 문제가 있었다.대부분의 로직이 클라이언트에 포함되어 배포되기 때문에 보안이 나빠지기도 하였다. 그래서 등장한 것이 미들웨어이다. 미들웨어(Middleware) 클라이언트와 DBMS사이에 이 그림과 같이 또 다른 서버를 두는 방식이다. 클라이언트는 단순히 요청만 중앙에 있는 서버에게 보내고미들웨어에서..
웹 서버란? - 웹 서버는 소프트웨어를 보통 말하지만, 웹 서버 소프트웨어가 동작하는 컴퓨터를 말한다. - 웹 서버의 가장 중요한 기능은 클라이언트가 요청하는 HTML문서나 각종 리소스(Resource)를 전달하는 것이다. - 웹 브라우저나 웹 크롤러가 요청하는 리소스나 컴퓨터에 저장된 정적(static) 데이터이거나 동적인 결과가 될 수 있다. 웹 브라우저와 서버간에 어떤 통신이 이루어지는지 확인해보자. 확인을 위해 아래 그림과 같이 크롬 브라우저에서 검사 버튼을 누른 후 나오는 창에서네트워크 버튼을 눌러보자. 그 후 새로고침을 누르면 위 그림에서 보는것과 같이 여러개의 항목이 뜬다. 웹 브라우저는 www.naver.com이라는 웹서버에 접속을 했을 것이다.그리고 해당 주소에서 기본으로 보이는 HTML..
크롬 브라우저에서 개발자 도구를 열어 어떤 코드로 웹사이트가 제작되었는지 살펴보자. 크롬 개발자도구를 여는 단축키 : Ctrl + Shift + i 아마존 웹사이트를 연 후 다음의 단축키를 사용해 보았다. 위의 그림과 같이 Network를 선택한 다음에 새로고침을 하면 www.amazon.com 이라는 항목이 나타나는데 이 코드를 보고 처음 우리가 www.amazon.com을 Enter를 치는 순간 서버에서 응답을 준 값들을 Response 항목에서 볼 수 있다. 소스를 천천히 살펴보면 html코드, css코드, javascript코드를 모두 볼 수 있다. 여기서 볼 수 있는 몇 가지 특징들을 정리해보자. - HTML문서는 html이라는 태그로 시작해서 html태그로 끝난다. - head는 무엇을 하는걸..
- 인터넷 != WWW(World Wide Web) 인터넷 기반의 대표 서비스 중 하나 물리적인 하나의 컴퓨터에는 여러개의 서버가 동작할 수 있으며각각의 서버들은 포트라는 값으로 구분돼서 동작한다.웹은 이 중에서 80번 포트를 사용한다. 인터넷은 보통 TCP/IP라는 약속으로 연결되어 있다. 하나의 물리적 컴퓨터에는 여러가지 소프트웨어 서버가 동작할 수 있는데이 서버는 포트값이 다르게 동작해야 된다.이런 포트 값은 0보다 큰 숫자값이다. HTTP(Hypertext Transfer Protocol) -> HTTP는 서버와 클라이언트가 인터넷상에서 데이터를 주고받기 위한 프로토콜. HTTP는 어떤 종류의 데이터도 전송할 수 있도록 설계돼있음. ex) 이미지, 동영상, 오디오, 텍스트 문서 등 종류를 가리지 ..