[비트캠프] 13일차(3주차3일) - HTML 개요, Data와 메모리, 2·10·16진수

 

HTML

 

예제 소스 받기

 

 

 

HTML의 등장

 

① HTTP, HTML 등장 전

논문에서 참고 문헌을 기록할때 달리 연결하는 것이 없었다.

 

② HTTP, HTML 등장

논문에서 참고 문헌을 기록하고 연결하는 방법이 등장했다.

HTML을 화면에 표현해 주는 최초의 브라우저인 Mosaic이 등장했다.

참고 만화 : https://joone.net/2021/01/02/37-%EC%9B%94%EB%93%9C%EC%99%80%EC%9D%B4%EB%93%9C%EC%9B%B9www%EC%9D%98-%EC%8B%9C%EC%9E%91-1/

 

 

HTTP Client / Server App

 

Web Server를 개발자는 HTTP Server라 한다.

 

 

Web 기술의 활용

 

① 1세대 : 논문 공유

② 2세대 : 홈페이지(회사 소개, 제품 소개)

③ 3세대 : CGI 프로그램(방명록, 방문자 수, 게시판)
    *CGI : Common Gateway Interface. web server와 프로그램 사이에 데이터를 주고 받는 규칙

④ 4세대 : 쇼핑몰

⑤ 5세대 : 인사관리시스템, 결재시스템, 고객관리시스템, 물류관리시스템, 웹메일, 카페/블로그

 

 

 

Web Application 제작 기술

화면 만드는 기술

• HTML - 콘텐트를 구성할 때 사용하는 기술
• CSS - 콘텐트의 출력 모양을 제어하는 기술
• JavaScript - 사용자의 액션에 응답. 콘텐트를 제어

→ "Front-end 개발"

 

 

데이터를 만드는 기술

• Java, JavaScript, PHP, ...
• SQL

→ "Back-end 개발"

 

두 가지 다 하는 "Full Stack 개발"

 

 

 

HTML 기본 구조

 

개발자는 태그가 아니라 element라 한다.

root element : 가장 바깥쪽에 있는 element. 문서 당 한 개만 존재해야 한다.

콘텐트(content) : 자식 element들

 

element 구분

• 끝 태그를 반드시 적어야 하는 element. 예) <a></a>
• 끝 태그를 생략해도 되는 element. 예) <p></p>, <p>, <br></br> = <br/>(/는 끝 태그 생략 표시), <br>
• 끝 태그를 적지 않아야 하는 element. 예) <meta>

 

 

 

HTML 변천사

'HTML cheat sheet' 검색

 

 

 

HTML 공부법

HTML 공부법은 HTML 태그 중 그런 기능의 태그가 있다는걸 본적 있어! 정도면 된다. 잊어버리면 구글링 or 책 찾아보라

 

 

 

HTML4의 DOCTYPE

 

 

 

Data와 메모리

 

메모리 각 영역마다 주소가 부여되어 있다.

RAM : 전기적 신호로 Data 저장

HDD : 자기적 신호로 Data 저장

 

 

메모리 상태의 표기

 

 

비트의 전기 상태를 표현하기 위해 2진수 표기법을 고안했다. 그러나 표기 단순화를 위해 16진수 표기법을 고안했다.

16진수는 2진수로 바꾸기 쉽다.

특정 비트들의 정확한 상태를 전달하고자 할때 → 2진수 표기법

비트의 개수가 많아서 2진수로 표기하기 곤란할때 → 16진수 표기법

 

 

 

Data 저장

 

 

 

숫자와 자릿수

 

 

 

메모리 상태와 2진수, 10진수, 16진수

 

메모리 상태를 직접적으로 보고싶다면 → 2진수

문서에 간략히 적고 싶다면 → 16진수

 

 

---

 

조언

 

*신입 개발자로 SI 시작하는 건 미친거다. SM을 시작하는게 맞다.

*HTML 태그는 많이 보는 것으로 공부하라

 

 

---

 

과제

 

/