[JS 강의] Nicolas, 초보자를 위한 바닐라 JavaScript (#3)(노마드코더 후기)

이번 파트는 실제로 js앱을 만들어 보는 시간이다.

앞전의 배운 것들 그리고 js앱을 어떻게 만들어 가는지 직접 배울 수 있다.

기능별로 하나씩 하나씩 만들어 간다.

기능 만들기 순서.

- 시간 보여주기 (clock.js)

- 유저이름을 받고 로컬스토리지에 저장 (greeting.js)

- to-do list (todo.js)

- image background(bg.js)

- getting weather(wheather.js)

노마드코더

강의내용 중.

- html에서의 class 네이밍 (js에서 사용하면 js-이름 을 사용한다)

- init 함수를 만들고 호출 해준다

- Date object의 사용법 및 `` 내에서 삼항연사자 사용 가능

- setInterver 사용

- localStorage 사용

- classList.add / classList.remove를 사용한 css 속성을 부여

- console.dir(event.target.parentNode.id) 을 통한 부모 id 구하기

- localStroage는 string만 저장 가능하기 때문에 JSON.stringify(toDos) 를 통해서 string으로 변경 후 저장

- string -> object(Json) 형으로 변경은 JSON.parse(loadedToDos)

- forEact와 filter  사용

- genRandom() 랜덤 숫자 만들기

- new Image() image 삽입 -> 여기서도 css 미리 만들어 놓고 classList로 더해준다.

- fetch 만 사용 하면 해당 api 호출 한다. 이 호출은 개발자 도구 -> 네트워크에서 호출 내용 및 결과 확인이 가능하다.

- .then사용은 fetch 호출이 끝날 때까지 기다려닸다가 then내용 수행 한다. (fetch를 통한 데이터가 완전히 들어 올 때까지 기다린다.)