바닐라 JS로 크롬앱 만들기
바닐라 JS로 크롬앱 만들기
노마드코더의 바닐라 JS로 크롬앱 만들기 강의에서 만든 momentum 프로젝트이다.
기본적으로 login, todolist, clock등을 구성하고 각자 자신만의 스타일으로 css를 해보도록 한 강의였다.
프로젝트 구성
1. greeting.js
username이 localstorage에 저장되어 있지 않은경우 login을 할수 있도록 하고
저장되어 있으면 todolist를 보여주고 user에게 인사를 건낸다.
2. clock.js
시계를 hh:mm:ss의 형식으로 바타내 준다.
setInterval() 메소드를 실행하여 1초마다 시계가 바뀌도록 하였다.
3. todo.js
localStorage에 있는 item들을 ul list에 추가해주고
todo를 추가하면 localStorage에도 변경사항을 나타내 준다.
localStorage에 array를 저장하기 위해 JSON.stringify() 와 JSON.parse()를 사용하였다.
4. quotes.js
명언 객체에서 랜덤으로 하나의 명언을 골라 화면에 띄어준다. 화면 밑 중앙에 존재한다.
5. backgroud.js
image중에 하나를 랜덤으로 골라 body의 backgroud-image로 설정해준다.
6. weather.js
navigator.geolocation.getCurrentPosition을 이용하여 위치정보를 받아와 현재 위치의 온도를 가져온다.
local에서는 되지않아서 화면에 나타내지는 않았다.
완성본
https://github.com/sumi-0011/CloneCoding/tree/main/momentum
