likerudin / momentum_clone

kim-min-woo's repo

모맨텀 클론!

Notion

이미지와 함께 보다 자세한 내용을 담고 있는 노션 링크입니다!

📑 모맨텀 클론 설명서!

index.html

html의 모든 폼과 css, js를 모두 불러오고 실행하는 역할을 합니다.

css

• style.css : 전체 css파일을 불러오고, 미디어 쿼리를 받아오는 역할을 합니다.
• reset.css : 기본적으로 브라우저에서 적용하는 css를 제거합니다.

component

각각 컴포넌트에 필요한 css를 가지고 있습니다.

js

브라우저를 반응형으로 만들어주는 Javascript파일을 모아놓은 폴더입니다.

clock.js

아날로그 시계의 구조를 나타냅니다.
시간을 불러오고 조작하고 아날로그 시계를 작동하는 역할을 합니다.

darkMode.js

유저의 컴퓨터의 다크모드 설정을 불러오고 다크모드를 토글하는 역할을 합니다.

login.js

유저의 로그인 상태를 체크해서, 유저를 불러오거나 로그인할 수 있는 폼을 불러오는
역할을 합니다.

nav.js

네비게이션을 토글하고, 네비게이션 토글 상태를 localstorage에 저장하는 역할을 합니다.

randoming.js

이미지와 글귀를 무작위로 불러오는 역할을 합니다.

rockPaperScissors.js

AI(진짜 AI가 아닙니다..)와 가위바위보 정면대결을 할 수 있는 역할을 합니다.

shortcut.js

유저가 입력한 url과 name을 불러와 즐겨찾기를 만들고,
추가한 즐겨찾기를 삭제하거나 localstorage에 저장하고 불러오는 역할을 합니다.

timer.js

유저에게 시간을 입력받아 타이머를 실행하고,
웹사이트에서 사용자의 컴퓨터에게 알림 권한을 허용 받으면,
시간 종료 알림을 보내는 역할을 합니다.

todo.js

할 일 목록을 생성하고, 삭제, localstorage에 저장하는 역할을 합니다.

weather.js

사용자에게 위치 권한을 받아, 사용자의 위치의 날씨, 도시, 온도를 받아오는 역할을 합니다.

icons

weather API에서 사용하는 아이콘을 모아두었습니다.

img

randoming.js에서 사용하는 이미지를 모아두었습니다.