Land of Joe

이런 걸 만들게 되었다. 이거 직접 하나하나 만들어야하는 거 실화인가..? 정말??? 이러고 혼자 계속 부정하면서 미루고 미루면서 가져올 수 있는 형식(?) 있는지 구글링하는데 아무 것도 안 나와서 울면서 만들기 시작했다. 디테일을 보자면 ... 1. 이용약관 전문 페이지 > - 동그라미로 리스트화: div 태그 안에 li 태그 사용하면 됨 - 들여쓰기: li 태그 안에 text-indent: 1em 사용함 2. 개인정보 수집 및 동의 전문 페이지 > - 표가 네 개 있음 - 표 아래에 구분선(border-bottom)이 있음 - 네 개의 표 모두 비슷한 모양 (회색 제목 칸, 흰색 내용 칸) [ 회색 제목 칸 ] : 표1,2는 회색 제목 칸이 하나만 있으므로 GrayBox로 공통 사용 : 표3,4는 회..

이런 동그란 체크박스를 만들고자 하였다. 태그는 input 타입은 checkbox 그리고 추가로 border-radius: 50% 까지 넣어줬는데 변화가 없어서 머리를 쥐어뜯었다. (아니다) 구글링 끝에 이런 글을 찾았고 [CSS] checkbox 둥글게 만들기 코드 input[type="checkbox"] { width: 1rem; height: 1rem; border-radius: 50%; border: 1px solid #999; appearance: none; cursor: pointer; transition: background 0.2s; } input[type="checkbox"]:checked { background: #32e732; border: none; } 코드 풀이 해 gurtn.ti..

* name can no longer contain capital letters Please choose a different project name. create-react-app으로 파일을 만드려는데 이런 오류가 난다. 전부 다 소문자로 갈기면 괜찮아진다................ 내힘들다.... Module not found: Can't resolve 'react-router-dom' npm install react-router-dom --save Module not found: Can't resolve styled-components npm install --save styled-components Module not found: Can't resolve './reportWebVitals' Re..

Step1. 현재 위치의 위도, 경도 숫자 얻기 function onGeoOk(position){ const lat = position.coords.latitude; const lng = position.coords.longitude; console.log("You live in ", lat, lng); } function onGeoError(){ alert("Can't find you. No weather for you."); } navigator.geolocation.getCurrentPosition(onGeoOk,onGeoError); Step2. 위도, 경도 숫자를 장소로 바꿔준다 https://openweathermap.org/current Current weather data - OpenWea..

Step0 ) 기본 설정 // javascript const todoForm = document.querySelector('#todo-form'); const todoList = document.querySelector('#todo-list'); Step1 ) input 태그인 todoForm이 'submit'되었을 때 작동할 'handleTodoSubmit'이라는 함수를 만든다 function handleToDoSubmit(event){ event.preventDefault();//새로고침되지 않게 하기 위해 const newTodo = todoInput.value; todoInput.value=""; //작성 후 엔터 누르면 UI상 input 안이 비어지도록 paintTodo(newTodo); } S..

// html {quote, author}이 '10개' 있는 const quotes 생성 // javascript const quotes = [ { quote: "Go ahead, make my day.", author: "Harry Callahan" }, { quote: "If you want something done right, do it yourself.", author: "Charles-Guillaume Étienne" }, { quote: "May the Force be with you.", author: "Star Wars" }, { quote: "Life is like a box of chocolates. You never know what you’re gonna get.", author:..

00:00:00 // javascript const clock = document.querySelector('h2#clock'); setInterval, setTimeout 활용해서 시계 만들기를 해보자 [JavaScript] setInterval, setTimeout 공부(2) 22.10.05에 썼던 글 https://joeindeu22.tistory.com/entry/setTimeout [JavaScript] setTimeout, setInterval 타이머 설정하기 setTimeout() : 일정 시간이 지나면 코드를 실행해주는 자바스크립트의 기본 함수 setInterval() : 일 joeindeu22.tistory.com 그전에 js에 있는 date 객체를 활용해 현재 시각을 가져올 수 있다 c..

22.10.05에 썼던 글 https://joeindeu22.tistory.com/entry/setTimeout [JavaScript] setTimeout, setInterval 타이머 설정하기 setTimeout() : 일정 시간이 지나면 코드를 실행해주는 자바스크립트의 기본 함수 setInterval() : 일정 시간마다 코드를 실행해주는 자바스크립트의 기본 함수 setTimeout(function(){실행코드}, 시간); setInter joeindeu22.tistory.com [ '일정 시간 간격마다' function 호출하기 ] setInterval( , ) 첫번째 인자: 실행하고자 하는 function 두번째 인자: 호출되는 function을 몇 ms(1s=1000ms) 간격으로 할지 func..