2주차 웹과 프론트엔드

본격적인 코딩 학습이 시작됐다.
간단하게 웹과 html 실습을 진행했다.
태그 부분은 다음 게시물로 따로 정리하려 한다.

---

Part 1. 웹

1. 웹의 이해
2. 웹의 구조
3. 웹 개발 직무 이해

---

1. 웹의 이해

World Wide Web(WWW, Web)
: "인턴넷"에 연결된 컴퓨터를 통해 사람들이 정보를 공유할 수 있는 "공간"

• 웹의 특징

  • 하이퍼텍스트 형식으로 정보 표현
  • "링크"를 이용해 이동 --> 정보/문사 연결

• 웹페이지 vs 웹사이트

  • 여러 웹페이지를 엮으면 웹 사이트

• 웹 브라우저

  • 데이터 또는 웹페이지를 찾거나 읽을 때 사용하는 것
    ex) 사파리, 크롬 등

---

2. 웹의 구조

• 클라이언트와 서버

  • 클라이언트: 서비스를 이용(요청)하는 컴퓨터
  • 서버: 서비스를 제공하는 컴퓨터

• 프로토콜
  : 서버 - 클라이언트 간 약속
  : 통신 약속

• 어떻게 web 사용?

  • 웹 프로토콜 HTTP 사용해 데이터를 주고 받음
  • Hyper Text Transfer Protocol

---

3. 웹 개발 직무 이해

1. 프론트엔드
   : 웹 서비스(사이트)에서 사용차 측면의 그래픽 사용자 인터페이스

   • 사용자와 상호 작용 담당
     • 글자 입력, 버튼 클릭, 화면 출력 등

2. 백엔드
   : 웹 서비스(사이트)에서 사용자 눈에 보이지 않는 서버측

   • 프론트엔드에서 전달 받은 데이터와 요청을 내부 데이터와 연산 처리해 프론트엔드에 결과 전달

---

Part 2. 프론트엔드

1. 프론트엔드 3대장
2. HTML
3. CSS
4. JavaScript

---

웹 개발
- IDE: Integrated Development Environment
- 일종의 공방(개발 툴)

---

1. 프론트엔드 3대장

   • HTML: 웹페이지 구성 요소들의 "구조"

   • CSS: 웹페이지 구성 요소들을 "꾸밈"

   • JavaSpript: 웹페이지 구성요소들에게 "생명력"을! (액션)

   • HTML과 CSS는 껍대기

---

2. HTML
   : HyperText Makeup Language
   : 웹페이지 연결 및 구조 명ㅅ;

• <>: 태그
• .html: html 확장자