[1. 오늘 배운 것]
오늘은 강사님께서 처음 오셔서, html css 그리고 javascript를 복습하는 시간을 가졌다.
1. 웹 개발
- 프로토콜 : 일종의 통신 규약, 웹이라는 정보 공유 체계 내에서 정보를 주고 받으려면 웹이 정한 통신 규약을 따라야 함
- http : 웹에서 정보를 주고 받을 때 사용하는 프로토콜, 클라이언트와 서버 사이에 이루어지는 요청과 응답에 대한 프로토콜
2. html
- 여는 태그와 닫는 태그로 구성
- 콘텐츠: 텍스트 또는 요소
<태그명 속성명="속성값">콘텐츠</태그명>
<태그명 속성명="속성값" />
예시)
<p id="paragraph">이건 문단이에요</p>
<hr class="divider" />
- 속성명과 속성값 : 태그 내에 필요
- heading : h1, h2, h3,,, 숫자가 커질수록 글자 작아짐
- ul, ol 등 목록 태그 (내부: li)
- a : 링크 태그
- input 태그 : type은 text, password, checkbox, date, color, file, range 등 다양함
- img : 이미지 태그, 오류시 alt로 대체
- button : 버튼을 생성해 사용자와 상호작용
- 각종 의미부여 태그 : header, main, footer, article, section, p 등
2. css
- width, height : 박스모델의 너비와 높이
- box
- border 다루기 : border-width, border-color, border-style, border-radius
- 글자 꾸미기 : color, font-family, font-size, line-height
- display 속성 : inline, block 등등
- position : 요소의 배치 방식
- flexbox
Flexbox Froggy - CSS flexbox 속성 배우기 게임
3. 자바스크립트 초급문법
- 함수
function sayHello() { // function 키워드와 함수명 그리고 소괄호와 중괄호를 사용해요.
console.log("Hello~!");
}
- 함수 호출
sayHello(); // => "Hello~!"
- 배열
const numbers = [1, 2, 3, 4, 5];
console.log(numbers[2]) //3 출력
const numberOfNumbers = numbers.length //numberOfNumbers = 5
- 다양한 메서드
numbers.push();
numbers.splice();
numbers.sort();
numbers.map();
numbers.filter();
4. 자바스크립트 중급 문법
- for문
for(let i = 0; i < 5; i++){
console.log(i);
}
- forEach문 배열명.forEach(콜백함수) { ... }
const students = ["park", "kim", "lee", "kang"]
students.forEach(function(student)}{
document.write(`${student}`)
});
- for(변수 in 객체) { ... }
const gitbook {
title : "title",
id : "1",
num : "2"
}
for(key in book){
document.write(`${key} : ${gitbook[key]}<br>`);
}
[2. 회고]
종환이가 놀렷다. 종환이때문에 강의에 나가고싶지 않다. 는 뻥이고 공부 열심히 하면서 지내고 있다
자바스크립트 기초 문법을 다뤘는데