[웹개발종합반]1주차 18~20강 + 과제

2022. 7. 16. 00:01스파르타코딩클럽[AI트랙 3기]/웹개발 종합반

1-18 Javascript 기초 문법 배우기(4)

1)반복문

<script>

let a_list =[‘사과’, ‘’, ‘’, ‘딸기’]

for (let i=0; i< a_list.length; i++) {

console.log(a_list[i])

}

</script>

하면 cosole 창에 출력됨. 이때 for 뒷문장은 위에 let이랑 거의 붙어서 나오는 것임. a_list.length4랑 같다고 보면 됨.

2)코드스니펫 복사 (철수, 영희 등등)

let scores = [

{'name':'철수', 'score':90},

{'name':'영희', 'score':85},

{'name':'민수', 'score':70},

{'name':'형준', 'score':50},

{'name':'기남', 'score':68},

{'name':'동희', 'score':30},

]

에서 정렬해준 후

for (let i=0; i< a_list.length; i++) {

console.log(a_list[i])

부분 a_listscores로 바꿔줌 -> 해당하는 list 명으로 바꿔 주어야함.

+)점수만 출력하고 싶으면 console.log(scores[i][‘scores’])라고 하면 점수만 나옴.

list하고 같이 노는 것이 반복문

3)가정문

70점 이상인 아이들의 이름만 출력하기.

let scores = [

{'name':'철수', 'score':90},

{'name':'영희', 'score':85},

{'name':'민수', 'score':70},

{'name':'형준', 'score':50},

{'name':'기남', 'score':68},

{'name':'동희', 'score':30},

]

for (let i=0; i<scores.length; i++) {

if(scores[i][‘score’])>70) {

console.log(scores[i][‘name’])

}

}

실수 : console.log는 한 번만 나와야 함. (여러 번 쓸 경우 출력 안됨.)

 

1-19 Javascript 연습하기

*서울시 미세먼지 값 출력하기 : 서울시 미세먼지 40 미만인 구 표시

1)코드스니펫 복사해서 리스트 없애고 붙여넣기

cf)양이 많을 때는 왼쪽 +/- 버튼 활용

2)안에 내용 변경

for (let i=0; i<mise_list.length; i++) {

if(mise_list[i][‘IDEX_MVL’])<40) {

console.log(mise_list[i][‘MSRSTE_NM’])

}

해주면 원하는 값 나옴.

 

1-20 1주차 끝&숙제 설명

*10cm 방명록 만들기

1)새파일 : frontend 새파일(homework.html) - 부트스트랩 코드스니펫 복사해서 파이참에 붙여넣기

cf)코드는 새로 만드는 것이 아니라 이전 것을 가져다가 변형시키는 것.

 

%막히는 것

a)박스 만들기

b)새로운 앨범 너무 멋져요 부분 가운데로 옮기기

->시도한 방법은 div wrap 써서 했는데 왜 안 옮겨지지;;

c)닉네임, 코멘트 칸 안 떨어짐

->마진으로 띄우면 됨.

d)새로운 앨범 너무 멋져요 분리 안됨.

->그냥 코드를 복사했음.

div

 

**해설

맨 먼저 body 건들기

my title 다 넣어 주고 박스 만들기

<div class=“mypost”>

 

</div>

하고 mypost 그대로 다 가져오기 , 스타일도 다 적용해주기

mypost 내용 ->forms -> floating labels

버튼 넣기 : 띄우려면 mypost>button / .mybtn{} 둘 다 가능

qoute가 여러개 -> <div class=“mycards”>

mycards > .card 또는 div