Selenium을 사용하다가 웹 프로그래밍의 구성 요소에 대해 알아야 할 것 같아서 작성함
프론트엔드
- 사용자의 눈에 보이는 부분으로써 HTML, CSS, JavaScript로 구성되어있다.
- HTML은 실행되는 페이지의 구조를 만들어주는 마크업 언어이다. 웹 크롤러가 HTML 문서 내에 있는 태그를 읽고 그 태그를 통해서 구조를 알 수 있다.
- HTML은 <!docutype html>
- <head>: 화면에 직접적으로 보이지 않으며, 숨은 데이터를 정의하는 태그 선언.
- <title>: 웹 페이지의 제목을 지정하는 태그
- <meta>:웹 페이지의 보이지 않는 정보를 제공하는데 쓰이는 태그
- <link> : CSS를 별도의 파일로 저장 후 HTML문서 내에서 불러올 수 있다
- <style>: CSS를 문서 내부에 기술한다
- <body>: 문서의 몸통을 나타낸다. 브라우저 화면에 보이는 것들이 주로 들어간다. (<br>, <div>, <p>, <span>, <form>, <h1> …. 등이 있음)
- CSS는 HTML과 같은 문서의 스타일을 꾸밀 때 사용하는 언어이다. HTML로구조를 만들면 CSS로 꾸민다고 생각하면 된다. 글꼴, 배경색, 너비, 높이, 위치 등을 지정하거나 환경에 따라서 화면을 다르게 표시할 수 있도록 지정할 수 있다.
- JavaScript는 객체기반의 스크립트 프로그래밍 언어이며, HTML의 특정 요소들을 선택해 다양한 이벤트(마우스 클릭, 키보드 입력 등…)에 따라 특정 동작을 하도록 할 수 있으며 발생하는 이벤트에 따라 HTML, CSS를 조작할 수도 있다.
- jQuery는 오픈 소스 기반의 자바스크립트 라이브러리로써, 자바스크립트를 더욱 손쉽게 활용할 수 있게 해준다.
백엔드
- 웹 브라우저가 주고받는 데이터를 기록하고 가져오는 등의 뒷 단의 일을 처리하는 기술이다.
- 프론트에서 전달된 데이터의 포맷이나 데이터베이스 입출력 및 다양한 프로세스를 구현하는 역할을 한다.
- 웹서버는 웹 브라우저의 요청을 받아 알맞은 결과를 웹 브라우저로 전송하고, 프로그램의 처리가 필요하다면 WAS서버를 이용하거나, 프로그램을 직접 호출해 결과를 생성한다.
- WAS(웹 어플리케이션 서버)는 게시글 목록, 로그인 처리와 같은 기능을 실행하고 그 결과를 웹서버에 전달한다.
- DB(데이터베이스)는 웹 어플리케이션이 필요로 하는 데이터를 저장한다
'이론 > 프로그래밍' 카테고리의 다른 글
| Redis 정리 (사용 이유, 활용 사례, 주의사항, 등) (0) | 2022.01.10 |
|---|---|
| [Github] Git 브랜치 사용방법에 대해서 (0) | 2020.11.22 |
| [Python] list, tuple, set, dictionary (0) | 2020.08.21 |
| 쿠키와(cookie)와 세션(session)의 차이 (0) | 2020.08.19 |
| HTTP 요청 메소드의 종류와 HTTP 메시지에 대해서 (0) | 2020.08.18 |