본문 바로가기

JavaScript/Nomad Coders12

[TIL] 💡 Day 11 - JS로 사용자의 위치 정보와 해당 위치의 날씨 표시하기 ✔ 이 포스팅은 노마드코더 - "바닐라 JS로 크롬 앱 만들기를 들으면서 깃허브에 기록한 필기를 옮긴 내용입니다. 목표 : 🌎사용자의 위치 정보와 ⛅해당 위치의 날씨 표시하기 🌱 User의 위도(latitude) , 경도(longitude) 구하기 👉 navigator 함수를 이용해 사용자의 위치를 알아내는 코드 작성 mdn 링크 JavaScript가 position을 통해서 user의 위치를 전달해줌. position은 object이고, 위도, 경도 값이 포함되어 있다. position( )함수는 2개의 인자가 필요하다. 정상적으로 실행됐을 때의 함수 (onGeoOk) 실행 실패했을 때의 함수 (onGeoError) navigator.geolocation.getCurrentPosition(실행⭕함수, .. 2022. 5. 2.

[TIL] 💡 Day 10 - JavaScript로 TodoList 만들기 ✔ 이 포스팅은 노마드코더 - "바닐라 JS로 크롬 앱 만들기를 들으면서 깃허브에 기록한 필기를 옮긴 내용입니다. 목표 : 📝 JavaScript로 Todo List 만들기 🌱 Todo List 기본 틀 준비 👉 일단 필요한 요소들은 어떤 것이 있는지 알아보자. Form : 사용자가 todo 입력 → 제출하는 형태가 필요하다. List : 입력한 todo를 나열해야 된다. input : 사용자에게 todo를 입력받아야 한다. 예시 코드 const toDoForm = document.getElementById("todo-form"); const toDoInput = document.querySelector("#todo-form input"); const toDoList = document.getElemen.. 2022. 5. 1.

[TIL] 💡 Day 9 - 랜덤으로 명언, 배경 설정하기 ✔ 이 포스팅은 노마드코더 - "바닐라 JS로 크롬 앱 만들기를 들으면서 깃허브에 기록한 필기를 옮긴 내용입니다. 🎲 랜덤으로 명언, 배경 설정하기 (JS에서 만든 요소 Html에 추가하기) 🌱 Array에 접근하기 👉 랜덤으로 값을 받기 위해서는 먼저 데이터가 담긴 Array에 접근하는 방법을 알아야 한다. 어떻게 첫 번 째 array안에 접근할 수 있을까? 명언 10개가 담겨있는 quotes[ ]가 있을 때 → console.log(quotes[0])을 사용하면 된다. 명언이 10개이므로 index는 0 - 9까지의 값이 존재한다. 즉! 0 - 9까지의 값을 랜덤으로 받아오면 된다. 👉 어떻게 할 수 있을까? 랜덤 함수를 사용하면 된다! 🌱 Math.random( ) 👉 사용 시 0 - 1 사이의 값.. 2022. 4. 16.

[TIL] 💡 Day 8 - JavaScript로 타이머 만들기 ✔ 이 포스팅은 노마드코더 - "바닐라 JS로 크롬 앱 만들기를 들으면서 깃허브에 기록한 필기를 옮긴 내용입니다. ⏱ Vanilla JS로 타이머 만들기 🌱 Interval vs Timeout 👉 둘의 사용법과 차이점에 대해서 알아보기 Interval 매번 일어나야 하는 일에 사용 JS에 이미 내장되어 있는 함수 setInterval(함수명, 반복될 시간(ms)) 으로 사용한다. Timeout 한 번 실행 후 반복되지 않음 설정한 시간 뒤에 한 번 실행된다. setTimeout(함수명, 실행될 시간(ms)) 으로 사용한다. 🔗 Date 관련 인스턴스 메서드 - MDN ex) getDay, getFullYear, getHours, getMinutes, getSeconds... 👉 타이머에는 setInter.. 2022. 4. 16.

이전 1 2 3 다음

티스토리툴바