[노마드] 모멘텀 클론코딩 개인화 trouble shooting

1. 미디어쿼리 이용 시 html 전체영역 사이즈 오류

야심차게 'how to use mediaquery with javascript' 검색해서 도전했는데

자꾸 공백이 생기길래 뭔가 했더니 body 사이즈가 말도 안되게 바뀌어 있었다.

어떤 감사하신 분이 '참조할 전체 사이즈가 설정되어 있지 않아서 그렇다'고 답을 주셔서 해결됐다 ㅠㅠㅠㅠㅠㅠ

https://kinsta.com/blog/javascript-media-query/

css에 이거 두 개 적어넣고 해결됨 ㅠ

html {
    height: 100%;
}
body {
    min-height: 100%;
}

 

2. 화면 배열하기

이게 쉽게 되는 게 아니구나 ^^

CSS도 베이직에서부터 차근차근 공부해야겠다.

https://www.codingfactory.net/10529

https://www.zerocho.com/category/CSS/post/5864f3b59f1dc000182d3ea1

 

 

챌린지 졸업작품 참고

https://dkedid.github.io/ChromeApp/JS/#

-> BGM 재생, 하이퍼링크, 자세한 Weather Info, GIF 배경

https://edit8080.github.io/todo-list-project/

-> Notion 처럼 드래그로 status 이동

https://geonya.github.io/momentum/

-> 그림판, 북마크 기능

https://project-mizzu.github.io/momentum2021/

-> submit 버튼, 애니메이션

수정 개발 목표

BGM : Jazz playlist

Background : Travel Photos

To-do list : drag + submit

bookmark : custom

+@ stopwatch  <- i need this