인터넷과 웹의 정의
인터넷: 전 세계의 모든 컴퓨터를 하나의 통신망 안에서 연결한다는 의미를 가진 international network의 약자이다.
웹(www, w3,web): world wide web이라는 뜻으로, 인터넷에 연결된 컴퓨터를 통해서 사람들이 정보를 공유할 수 있는 공간을 의미한다.
웹의 시작
1980년대 어느 날, 스위스의 한 유럽 입자 물리연구소의 컴퓨터 과학자 팀 버너스-리에 의해 탄생했다.
연구원들 간 신속한 정보 교환을 위해 고안되었다.
정보를 하이퍼텍스트 형식으로 표현하여, 하이퍼텍스트를 따라 이동하며 다양한 정보/문서들을 연결 제공합니다.
하이퍼텍스트: 단순히 글자가 아닌 그 이상의 기능을 가진 텍스트(주로 링크, 참조)
웹페이지vs 웹사이트
웹페이지가 여러개 모인 것을 웹사이트라고 할 수 있다.
웹 페이지 링크를 타고 다른 웹 페이지로 이동하는 것을 웹서핑을 한다. 또는 웹 브라우징을 한다고 한다.
웹 브라우저란?
어떤 것을 찾거나 읽을 때 사용하는 것 ex) chrome, 인터넷 익스플로어
웹의 구조
클라이언트와 서버로 구성된다.
말 그대로 클라이언트는 고객이고 서버에게 요청을 한다고 보면 된다.
클라이언트: 서비스를 이용하는 컴퓨터
서버: 서비스를 제공하는 컴퓨터
서버와 웹 브라우저는 어떻게 통신할까? 프로토콜을 통해 통신한다.
프로토콜은 서로 정보를 주고 받을 때 지켜야할 약속이며 서로 약속을 지며 통신해야한다.
인터넷으로 연결된 클라이언트와 서버는 웹 프로토콜인 HTTP를 사용하여 데이터를 주고받는다.
웹 개발 직무
인터넷이라는 통신망보다는, 양쪽에서 개발을 하는 직무이다.
클라이언트에서 개발하는 직무-> 프론트엔트
웹 서비스에서 사용자 측면의 그래픽 사용자 인터페이스(화면)을 구현한다. 이 화면에서 상호작용(글자입력, 버튼클릭, 화면 출력 등)을 담당한다.
서버측에서 개발하는 직무 -> 백엔드
웹 서비스에서 사용자의 눈에 보이지 않는 서버측에서 프론트엔드에서 전달받은 데이터와 요청을 내부 데이터와 연산을 활용하여 처리하고 프론트엔드에 결과를 전달한다. 즉, 인터넷이 전해준 요청을 처리하고 대응해주는 것
예시) 로그인
프론트엔드
id와 pw를 받아 백엔드로 넘겨줌
➤
백엔드
id와 pw검사
-> 존재하지 로그인 실패 반환
-> 존재하면 로그인 성공 반환
➤
프론트엔드
반환된 내용을 화면으로 보여줌
HTML(Hyper Text Markup Language)
- 웹페이지 구성 요소들의 구조
- 하이퍼텍스트 즉, 웹 페이지를 연결하는 기능을 가진 텍스트이자 웹 페이지의 구조를 명시하는 언어
- <태그>를 이용하여 구현한다. 이는 웹 페이지 구성요소 역할을 한다.
- html 파일 기본 구조
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
</body>
</html>
! + tab 또는 enter 로 만들 수 있다!
CSS
- 웹 페이지 구성 요소들을 꾸민다.
javascript
- 웹페이지 구성 요소들에게 생명력을 준다.
- 화면 내에서 변화를 줄 수 있다.
IDE
- intergrated development enviroment(통합 개발환경)
- ex) vs code, eclipse
'타입스크립트로 함께하는 웹 풀 사이클 개발(React, Node.js) > TIL' 카테고리의 다른 글
웹 풀사이클 데브코스 TIL 8일차 (1) | 2023.11.27 |
---|---|
웹 풀사이클 데브코스 TIL 6일차 - css, js 작성하고 연결하기 (1) | 2023.11.24 |
웹 풀사이클 데브코스 TIL 5일차 - branch, 깃 플로우, merge (0) | 2023.11.21 |
웹 풀사이클 데브코스 TIL 4일차 - 토큰, 레포지토리 받아오기, branch란? (0) | 2023.11.20 |
웹 풀사이클 데브코스 TIL 3일차 - git 명령어, commit flow, github에 레포지토리 올리기 (0) | 2023.11.17 |