서버 VS 클라이언트
클라이언트
- 사용자가 웹 사이트에 접근할 때 사용하는 기기
- (좁은 의미) 웹 브라우저
서버
- 인터넷에 연결된 컴퓨터
- 웹 요소와 여러 정보가 저장됨
HTTP 프로토콜
웹개발의 기본
- HTML
- 웹문서의 뼈대를 만드는 HTML / 명령어 내 스타일을 내포하는 구조를 가짐
- 웹 브라우저 창에 웹 문서의 내용을 보여주기 위한 약속
- HTML에서 약속한 표기법을 사용해서 문서 작성해야함
- CSS
- 웹문서를 꾸미는 CSS
- 웹 문서를 꾸미거나 웹 요소를 적절하게 배치하는 방법
- 다양하게 디바이스에 맞는 반응형 웹 디자인을 만들기 위해 필수적으로 학습해야 함
- JAVA SCRIPT
- 사용자 동작에 반응해서 동적인 효과를 만들기 위한 기술
- 자바스크립트를 알고 있다면 새로운 프레임워크를 배우기 쉬움
- HTML은 구조, CSS로 스타일, JAVA SCRIPT로 동작 기술
HTML 구조
- 또는 <!doctype html>
웹 브라우저에게 ‘이제부터 처리할 문서는 HTML 문서라고 알려주는 것 - 웹 문서 시작을 알리는 html 태그
- 실제 문서 정보와 내용이 시작되고 끝나는 것을 표시하는 태그
- lang 속성을 사용해 문서에서 사용할 언어 지정
- 문서 정보를 지정하는 head 부분과 문서 내용을 입력하는 body 부분 포함
- 브라우저에게 정보를 주는 head 태그
- 문서 관련 정보 입력, 웹 브라우저 화면에는 보이지 않음
- 문서에서 사용할 외부 파일 링크
- 웹 브라우저에 내용을 표시하는 body 태그
- 실제 브라우저에 표시될 내용 입력
- 대부분의 태그가 body 태그와 /body 태그 사이에서 사용하는 태그들
웹문서 구조를 만드는 시맨틱 태그
- 화면 낭독기 같은 보조 기기에서 사이트의 구조를 이해 할 수 있다
- 문서 구조가 정확히 나눠지므로 PC나 모바일 등 다양한 화면에서 웹 문서를 표현하기가 쉽다
- 웹 사이트를 검색할 때 필요한 내용을 정확히 찾을 수 있다
'웹 애플리케이션 > 프론트엔드' 카테고리의 다른 글
| tomcat 활용 HTML 공유 해보기 (0) | 2023.04.04 |
|---|---|
| 자바스크립트 (0) | 2023.03.29 |
| CSS3 (0) | 2023.03.28 |
