인터넷의 역사
•
인류 최초의 웹사이트
•
인터넷의 창시자 : 팀버너스리
•
인터넷을 구성하는 언어
◦
HTML 언어는 팀버너스리 아저씨가 만든 언어로 웹사이트의 구성요소를 표현한다. 예를들어 목차, 제목, 본문, 이미지 등 웹사이트 뼈대를 생성
◦
CSS는 웹사이트의 디자인적인 코드를 제공한다.
◦
JS, 자바스크립트는 프로그래밍 언어로서 조건에 따른 웹사이트의 동작을 코딩할 수 있다.
인터넷의 구조
•
프론트 엔드와 백엔드의 구조
◦
프론트엔드 : 웹사이트의 보여지는 화면을 구성하는 코드
▪
프론트엔드는 보통 생성형 AI에게 코드를 짜달라고 하거나, 템플릿, 코드펜 등을 써서 웹사이트를 제작한다.
◦
백엔드 : 서버관리, 데이터베이스, 보안관리 등
▪
호스팅 : 서버 pc에서 내 프론트 엔드 코드와 백엔드의 데이터베이스를 동작시켜 외부에서 내 웹사이트를 들어 올수있게 하는 것
▪
백엔드는 보통 서버를 제공하는 클라우드 서비스를 이용한다.
▪
대표적인 벡엔드 서비스로는 아마존 aws, 구글의 파이어베이스, ms의 애저, 교육용으로 나온 netlify등이 있다.
•
DNS(Domain Name System)
◦
웹사이트에 들어가기 위해서는 해당 서버 ip 주소를 치고 들어가야 하는데, 이것이 외우기 어려워서 문자형태의 도메인(url)을 지정하여 관리하는 시스템이다. 미국에서 관리하고 있다.
[실습] 코드펜을 활용한 웹사이트 만들기
•
실습 코드
•
기본 HTML 코드
◦
<head> 와 <body>로 이루어져 있다.
◦
<body> 태그 안에는 제목, 본문, 링크 같은 <h1>, <p>, <a> 태그 등이 있다.
html 기본코드
•
css코드 적용
◦
각 태그의 디자인 요가 css 코드로 작성되었다.
css 기본코드