on
html, 제목, p,list태그,table태그,EBNF표기법
html, 제목, p,list태그,table태그,EBNF표기법
728x90
WEB이란 어플리케이션이란 WEB브라우져 컨텐츠 service(주문, 정보)를 이용하는 것을 의미한다. 인터넷 기반의 경우 TCP/IP인 연결지향 프로토콜을 이용하여 오류없이 전송하는 것을 의미한다. TCP 패킷을 전송하는 역활 패킷의 순서 알려주는 역활 오류발생을 체크해주는 정보를 포함한다. IP 컴퓨터의 호스트주소를 분석하여 인터넷을 통하여 연결하는 역활을 맡고있다. 인터넷네트워크는 TCP와 IP를 통하여 정말 많은 정보/서비스를 전달하고 있다.
HTTP프로토콜
브라우져에서는 웹서버를 연결하기 위해서 어떤 규칙이 있다. (어떻게 전송하는지에 대한 규칙)
모든 웹서버, 웹브라우져가 http로 규정이 된 법칙으로 메세지를 보낸다. 모두가 똑같은 방법으로 제작한다. 어떤 브라우져를 사용하던지, 어떤 웹서버를 사용하던지 상관없이
http에서 정의한 규칙으로 메세지를 주고 받는다. 브라우져에서 클라이언트에게 보내는 것을 요청 (request) 라고 하며
클라이언트에서 웹서버로 보내는 것을 응답(response) 라고 한다.
모두 Http 로 규정이 되어있다. 클라이언트에서 서버로 메세지를 보낼때 형식을 정의하고,
TCP/IP의 작성규칙을 이용하여 HTTP 규칙에 의한 작성 메세지를 보낸다.
TCP는 어케 재조립하지? IP는 누구에게 보내지? 역활이다.
네트워크망 - > HTTP규칙 작성 -> 와리가리 -> WEB이다. 우리는 요청메세지를 해석할 줄 알아야한다.
웹서버를 개발하기 때문에 웹어플리케이션을 분석할 줄 알아야한다는 것이다.
웹개발자
웹서버에서 구동되는 웹어플리케이션을 개발한다.
웹어플리케이션을 브라우져가 보낸 요청메세지를 분석해서 클라이언트의 요청을 처리하고
클라이언트에게 적절한 응답content을 제공하는 프로그램이다.
클라이언트에게 적절한 응답content을 제공하는 프로그램이다. 응답컨텐츠는 HTML, 그림, 영상, 첨부파일등이 될 수 있고, 대부분은 HTML의 컨텐츠이다. 페이지의 소스보기를 확인하면 HTML로 작성이 되어 있는 것을 확인할 수 있다.
그렇기 때문에 우리는 HTML을 작성할 줄 알아야한다.
URL
리소스의 위치를 나타내는 주소이다.
리소스란 (웹페이지, 웹어플리케이션, 그림, 동영상, 파일 등 )자원을 의미한다.
서버에 있는 자원을 요청할 때 클라이언트가 입력하는 주소다.
일반적으로 웹에서 웹브라우져(클라이언트)의 주소창이 URL을 입력하면,
웹브라우져가 해당 URL을 서버로 전달한다. 웹서버는 URL이 나타내는 주소에 해당 자원이 존재하면 그 자원을 응답으로 제공한다.
웹브라우져가 해당 URL을 서버로 전달한다. 자원을 요청하는 종류 동적자원 웹 어플리케이션 요청할 때마다 달라진다.
누가 요청했는지에 따라서 화면이 달라지기 때문에 미리 만들 수 없다. 정적자원 웹 페이지 변하지 않는 문서로 이뤄져 있다. 미리 작성한 HTML로 응답한다. 누가 요청했는지 상관없이 동일한 화면을 구현한다.
여태까지 구현한 APP프로그램으로 컨텐츠를 구현하지 않는다
EX 현재 오류를 수정중인 토이프로젝트의 한 부분이다. 워드, 한글, 레포트, 논문 처럼 발표작업을 하는 것처럼
서버클라이언트에게도 그런형식의 문서를 보내주어야한다. 그 문서가 html의 형태의 문서이다. 정적지원 : 미리 생성한 문서이다. 동적지원 : 백엔드 개발자들이 주력으로 개발할 servlet(서블릿), JSP, ASP, PHP 를 의미한다. 문서 작성법에 맞춰서 html이 생성된다.
HTML
HyperText MarkUp Language hyperText 문서의 링크를 클릭하면 연결된 문서로 즉시 이동할 수 있는 기능을 의미한다. Markup 문서에서 어느 부분이 제목인지, 본문인지, 링크인지, 그림인지 등을 표시할 때 사용할 때 마크업(태그)를 사용한다. 문서에서 어느부분에 제목, 본문, 링크, 표, 특별기호를 사용한다. 웹용의 문서작성을 사용할 때 사용한다. html은 마크업 문서를 사용하면서, 연결되어 있는 링크를 클릭시 다른 문서로 즉시 이동할 수 있는 문서를 의미한다.
html : 컨텐츠를 입력한다
제목, 소제목, 본문내용, 목록, 표, 그림등을 포함하는 문서이다.
css : 디자인을 작성한다. 레이아웃, 글꼴, 배경색깔, 문서의 스타일을 정의한다.
javascrip : 프로그램을 이용하여 사용자와 상호작용을 한다. 페이지 전환, 이벤트 처리, 팝업, 서버와의 통신, 화면갱신등을 처리한다.
html과 css는 퍼블리셔의 영역이다. 그리고 javascrip은 퍼블리셔와 개발자의 영역이 확실히 구분이 되어있다.
만들줄은 몰라도 읽을 줄은 알아야한다.
만들줄은 몰라도 읽을 줄은 알아야한다. 기본적인 것을 알아야한다.
W3에서 웹표준을 만든 사이트는 w3school이 있다.
정보를 제공하고, web과 관련된 것은 다 존재한다.
적극적인 활용이 필요하다.
표준에 대해서 작성이 되어있다.
html의 구성요소
태그 <,> 부등호를 이용하여 만든다. <태그이름>컨텐츠의 모양으로 이뤄져있다. 사이에 빈 공백이 존재해서는 안된다. 태그를 작성할 때는 여는 태그와 닫는 태그를 짝을 맞춰서 정확하게 입력해주어야한다. 짝을 안맞춰도 프로그램에서는 인식을 하기 때문에 되도록 잘 맞춰서 입력해주어야한다. 대문자로 작성해도 되지만 원칙적으로는 소문자로 작성해주어야한다. <태그이름> : 여는 태그 : 닫는 태그
태그는 부모-자식 관계의 태그가 존재한다. 자식태그는 부모태그 안에서만 사용할 수 있다. 자식태그를 작성할 때에는 부모태그안에서 들여쓰기를 해주어야한다. 부모태그는 자식태그만 가질 수 있다. 컨텐츠는 가질 수 없다. ul - il 태그
ul은 li만 가져야한다. li는 ul안에 포함되어야한다. p는 li의 부모태그가 아니다. 부모 - 자식관계는 맞게 작성해야한다.
속성
태그는 속성과 함께 사용할 수 있다. 속성은 태그와 관련된 부가적인 정보, 추가기능을 정의한다. 형식 : <태그명 속성명="속성값" 속성명="속성값"> 속성명과 속성값사이에 공백이 있으면 안된다. < img src =" images/logo.png " width =" 160 " height =" 70 " > 속성명과 속성값은 붙여서 적고, 속성값은 ""사이에 적는다. 숫자도 단순 속성값이기 때문에 ""을 입력해주어야한다. 동일한 속성명을 여러번 작성 할 수 없다. 속성명을 적을 때는 특별한 순서가 없다. 속성명에는 순서가 없지만, 중요속성정보를 앞에 작성해주는 것이 좋다. 잘못된 예 속성값에 ""을 제거한다. , ' '을 입력하지 않는다. 속성값을 " ', " ' 으로 묶어 속성값을 감싸는 따음표의 짝이 맞지 않게 한다.
속성 태그마다 고유한 속성을 가지고 있다. 속성은 원래 사용목적에 맞게 사용해야한다. 어떤 속성은 속성값이 미리 정해진 것이 있다. 태그마다 속성이 전부 다다르기 때문에 고유한 속성도 존재한다. w3school 의 html reference : 참조에서 확인한다. attribute : 고유한 속성 그 태그만 가지는 속성을 의미한다. global attribute : 전역속성, 공통속성 모든 태그들이 다 가진 속성을 의미한다. 태그 중에서 중요한 것 이렇게 표시한 4가지가 제일 중요하다. 중요태그들은 속성은 기억하는 것이 좋다. data-*로 시작하는 속성은 임의로 추가 할 수 있다. < img src =" images/logo.png " data-title =" 회사로고 "
data-creator =" 홍길동 " data-pubdate =" 2019-10-31 ">
원래 존재하지 않은 속성을 data-*을 이용하여 임의로 추가하였다. 그러나 원래 속성은 임의로 정의해서 사용하는 것이 아니다. 원래 사용목적에 맞게 사용해야한다.
어떤 속성은 속성값이 미리 정해진 이유이다.
어떤 값은 임의로 적지만 값이 이미 정해진것이 있다.
html작성하기
!을 누르고 tab을 누르면 나오는 화면이다. doctype : 문서의 타입 html : 문서타입이 html이라는 의미 최상단에 꼭 위치를 해야하며, 태그는 아니다. html의 선언부이며, html의 유형을 선언하는 선언 문이다. html5의 표준을 의미한다. html1.0의 규칙
html 1.0의 작성규칙이다. "public -//W3C//DTDXHTML1.0Scrict//EN" 이규칙은 public -공개적인 작성된 규칙이며, 아무나 확인 할 수 있다. -는 비공인 단체이며, 정부소속이 아니다. w3c : 정의한 이름 DTDXHTML1.0Scrict : 작성규칙의 이름 아래 경로에 가면 있다. EN :작성규칙의 작성언어 : 영어다. "http://....DTD/xhtml...dtd" 문서 작성규칙이 적힌 DTD문서이다. xhtml1.0의 작성규칙을 엄격하게 지켰다. 이것을 줄인게 html5의 선언부이다. html5가 마지막이기 때문에 6은 나오지 않는다
기능은 html5에 추가 된다. 이 선언부가 나오면 이건 html5로 작성된 문서야 라고 인식하면된다. 브라우져는 링크가 어디있는지 알아서 가기 때문에 html5는 따로 적지 않아도 된다.
!을 누르고 tab을 누르면 나오는 화면이다. 브라우져안에 DTD문서가 있다.
등장횟수에 나오는 기호가 존재한다. EBNF표기법 프로그램의 언어의 표기법이다. 확장된 바크스 now의 표기법이라는 언어로 바크스 now는 사람이름을 의미한다. XML을 작성시 유용하며,
정규표현식에도 그대로 사용된다. JavaScript에서 사용된다. A A를 한번적어라 A+ A를 한번이상 표시하세요 A? A는 표시하지 않아도 되고, 표시할 경우 한번만 표시할 수 있다. A* A는 표시하지 않아도되고, 표시할 경우 여러번 표시할 수 있다. A,B A다음에는 B를 표시한다. A|B A와 B중에 하나를 표시한다.
728x90
from http://lionpower.tistory.com/193 by ccl(A) rewrite - 2021-11-04 09:26:38