본문 바로가기

바닐라js40

[바닐라JS로 크롬 앱 만들기] Getting the Weather part Two API [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/l6hSze8vgVo index.html 00:00 weather.js const weather = document.querySelector(".js-weather"); const API_KEY = "f97c1ed1e4b50ed233ccabf8c1ea2011"; const COORDS = 'coords'; function getWeather(lat, lng){ fetch( `https://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${lng}&appid=${API_KEY}&units=metric` ).then(function(response){ return respon.. 2021. 3. 3.

[바닐라JS로 크롬 앱 만들기] Getting the Weather part One Geolocation [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/5fAMu2ORvDA index.html 00:00 weather.js const API_KEY = "f97c1ed1e4b50ed233ccabf8c1ea2011"; const COORDS = 'coords'; function saveCoords(coordsObj){ localStorage.setItem(COORDS, JSON.stringify(coordsObj)); } function handleGeoSuccess(position){ const latitude = position.coords.latitude; const longitude = position.coords.longitude; const coordsObj = {.. 2021. 3. 3.

[바닐라JS로 크롬 앱 만들기] Image Background [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/aHlJqxLREcY 먼저 사용할 이미지를 다운받는다 https://unsplash.com/ Beautiful Free Images & Pictures | Unsplash Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos. unsplash.com -이미지 랜덤으로 불러오기 bg.js const body = document.querySelector("body"); const IMG_NUMBER = 3; function paintImage(imgNumbe.. 2021. 3. 3.

[바닐라JS로 크롬 앱 만들기] Making a To Do List part Three [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/dbPOjiG5WJ4 -HTML에서 지우기 function deleteToDo(event){ console.log(event.target); } delBtn.addEventListener("click", deleteToDo); function paintToDo(text){ const li = document.createElement("li"); const delBtn = document.createElement("button"); const span = document.createElement("span"); const newId = toDos.length + 1; delBtn.innerText = "X"; delBtn.a.. 2021. 3. 3.

[바닐라JS로 크롬 앱 만들기] Making a To Do List part Two [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/JEbOaI_0phc const toDoObj = { text: text, id: toDos.length + 1 }; toDos.push(toDoObj); ↑이것을 추가해준다 const toDoForm = document.querySelector(".js-toDoForm"), toDoInput = toDoForm.querySelector("input"), toDoList = document.querySelector(".js-toDoList"); const TODOS_LS = 'toDos'; const toDos = []; function paintToDo(text){ const li = document.createEleme.. 2021. 3. 3.

[바닐라JS로 크롬 앱 만들기] Making a To Do List part One [출처-유튜브 노마드 코더 Nomad Coders] https://youtu.be/YD1yDErhMa4 index.html 00:00 todo.js const toDoForm = document.querySelector(".js-toDoForm"), toDoInput = toDoForm.querySelector("input"), toDoList = document.querySelector(".js-toDoList"); const TODOS_LS = 'toDos'; function paintToDo(text){ console.log(text); } function handleSubmit(event){ event.preventDefault(); const currentValue = toDoInput.valu.. 2021. 2. 26.

이전 1 2 3 4 5 6 7 다음

티스토리툴바