프로젝트/크롬 앱 클론코딩5 [크롬 앱 만들기] navigator, 날씨 API + 완성 기능 - 사용자의 현재 위치를 표시한다. - 현재 위치의 날씨와 온도를 표시한다. 기술 - navigator의 geolocation을 이용하여 현재의 위도, 경도를 알아낸다. - 알아낸 위도, 경도를 기반으로 API를 이용해 날씨, 온도, 지역 이름 정보를 불러온다. https://openweathermap.org/api - 정보를 불러온 후 html에서 미리 마련한 요소에 정보를 표시한다. - API key는 .gitignore로 감추어서 깃헙에 업로드한다. https://github.com/soaringwave/html-JS-css/tree/main/momentum GitHub - soaringwave/html-JS-css: Studying clone coding Studying clone codin.. 2023. 1. 25. [크롬 앱 만들기] 할 일 목록 만들기 기능 - 할 일을 입력할 수 있다. - 각각 할 일 옆의 버튼을 누르면 해당 할 일을 지울 수 있다. 기술 - 입력 칸에 할 일을 입력받아 localStorage에 저장한다. - localStorage에 저장할 때 특정 모양으로 저장하고 활용할 수 있도록 JSON.stringify(), JSON.parse()를 활용한다. - 할 일을 입력 칸 아래에 표시한다. (forEach()로 할 일을 화면에 표시하는 함수 실행) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach - 할 일 옆의 버튼을 누르면 event를 이용해 해당 요소의 정보를 가져온다. (event.target.parentEl.. 2023. 1. 21. [크롬 앱 만들기] 시계, 명언, 배경 이미지 나타내기 기능 - 실시간 시분초를 나타냈다. - 여러가지 명언과 인물을 저장해 두고 새로고침할 때마다 랜덤으로 표시하도록 했다. (인물과 명언을 구분하기 위해 임시로 인물은 skyblue로 표현했다.) - 무료 이미지를 저장해 두고 새로고침할 때마다 랜덤으로 표시하도록 했다. 기술 - 객체 Date를 이용했다. - Math를 이용하여 저장된 배열에서 랜덤으로 원소를 선택하도록 했다. - JS에서 html에 요소를 추가할 수 있도록 createElement(), appendChild()를 활용했다. 아이디어 사진이나 명언은 사용자가 직접 추가하고 삭제할 수 있도록 만들 계획이다. https://github.com/soaringwave/html-JS-css/commit/c8c1006dd3c42f9fac3f0f279d.. 2023. 1. 20. [노마드스터디] 주간회고록 3주차 이번 주 목표 [x] 크롬 강의로 배운 개념 블로그에 정리하기 [ ] 이번주 주말까지 크롬 클론 강의 수강 완료 [x] 스터디에 질문해서 제대로 알아가기 이번 주 결과 크롬 강의 주말까지 수강 완료 가능 졸업 작품에 대해 자세히 알게 됨 js 잘 배우는 중 😭 버리거나 고쳐야하는 것 3주차 오답노트 recap 강의까지 집중해야 한다 내가 만들고 싶은 것을 미루지 말자 스터디 모임 적극적으로 참여하자 공지 사항, 스터디 알림 등 자주 확인하자 😎 계속 해야 할 것 계속 시도하고 성장하자 꾸준히 계속 공부하자 💬 공유하고 싶은 고민이나 질문 html과 css에 비해 js는 훨씬 많은 기능이 있다고 생각한다. 그러다 보니 강의에서 배운 것 말고는 내가 모두 찾아서 해결해야 한다. 내가 뭘 어떻게 구현하고 싶은.. 2023. 1. 19. 이전 1 2 다음
