-
1주차 강의이노베이션 캠프/1주차_미니프로젝트 2023. 5. 29. 18:02
브라우저란?
- 정의: 인터넷을 통해 웹 페이지를 표시하고 탐색할 수 있는 소프트웨어
- 역할: 서버가 만들어 놓은 API 요청을 보내고, 요청의 답으로 받은 html 파일을 화면에 그려준다.
HTML
- 역할: 웹 브라우저에게 웹 페이지를 표시하는 방법을 알려준다.
- 구조
- 일련의 태그(tag)로 구성되며, 태그는 각각의 의미와 목적을 가지고 있다. (즉, 뼈대)
- head와 body로 구성된다.
- head: 페이지의 속성 정보
- body: 페이지의 내용
- 자주 사용하는 태그(tag)
- div: 구역을 나누는 태그, 한 줄을 다 먹는다.
- h\d+: 제목, 뒤의 숫자에 따라 크기가 달라진다. (숫자가 커질수록 글자는 작아짐)
css
- 역할: HTML을 통해 작성된 뼈대의 속성을 선택해 예쁘게 꾸며주는 코드
.html 파일 작성 순서
- body에 명찰 달아주기
- <h1 class="클래스이름"> ... <h1>
- head
- style 태그 생성 (<style></style>)
- 명찰 생성 (.클래스이름 {})
부트스트랩 (bootstrap)
- 예쁜 css 꾸러미
배포 방법
- 오늘 작업한 내용은 정적 웹페이지! 해당 페이지를 Github를 통해 배포해보는 방법을 배움.
- 정적 웹페이지란?
- 서버로부터 받은 내용이 고정되어 있어, 사용자에게 항상 동일한 콘텐츠를 제공하는 웹 페이지
- 정적 웹페이지란?
- 주의 사항
- Github에는 index.html 하나만 업로드할 수 있음
- 이유는? Github 자체가 정적인 웹 페이지 호스팅 서비스를 제공하기 위해 설계되어 있기 때문!
- Github에는 index.html 하나만 업로드할 수 있음
정리
html: 뼈대
css: 꾸미기
javascript: 움직이기참고
자주 사용하는 단축키
정렬 단축키: shift + option + F
주석 단축키: command + /파일 분리 방법
1. 같은 폴더에 css 파일 만들기 (style.css)
2. head 태그에서 불러오기 (<link rel="stylesheet" type="text/css" href = "(css파일이름).css">)728x90'이노베이션 캠프 > 1주차_미니프로젝트' 카테고리의 다른 글
2주차 강의 (0) 2023.05.29