본문 바로가기
반응형

날씨앱4

날씨앱3 위 목록들은 날씨앱2에서 고칠것들을 적어놓은 목록이다. 우선은 2번이 완료되었다. openweatherAPI의 url을 두개사용하였다. 로딩 동작 새롭게 추가한것들 초기값은 사용자의 위치의 날씨로 설정하였고, 사이드바의 검색창에 도시를 입력하면 그 이후는 그 도시의 날씨가 렌더링되도록 url을 2개 사용했다. 태그를 사용했다. 시간 1초마다 업데이트 영상은 gif만들기 귀찮아서 다음에 한번에 올리도록하겠다. const [time,setTime] = useState('') function getClock(){ const date= new Date(); const hours = String(date.getHours()).padStart (2,"0"); const minutes = String(date.get.. 2021. 11. 28.
날씨 앱 2 https://github.com/ryu9663/weatherApp/tree/master 알게된거 유닉스 시간에 대한 개념 웹폰트 navigation.geolocation.getCurrentPosition(위치받는함수,에러함수)를 통해 현재위도,경도를 받을 수 있다. 이렇게 얻어낸 위도경도로 openWeatherAPI에서 사용자의 현재 위치를 불러올 수 있음 지금까지 한 모든 리액트 스프린트 복습이 되었다. 코드설명은 다음에 추가하자. 고칠것 1. 사이드바 껐다 켰다 기능 구현 2. 날씨앱의 핵심기능은 현재 있는 위치의 날씨도 알 수 있어야 하는데, 현재 사용자의 위치를 불러오는 기능이 구현되어 있지 않다. navigation.geolocation.getCurrentPosition(위치받는함수,에러함수).. 2021. 10. 4.
날씨앱 https://github.com/ryu9663/weatherApp/tree/master 리액트를 이용해서 처음으로 직접 하나부터 차근차근 홈페이지를 만들어보았다. 검색창에 도시 이름을 적으면 sidebar의 목록에 도시들의 정보가 추가된다. sidebar에 도시를 클릭하면 메인창에 클릭한 도시의 날씨정보가 나타나도록 했다. 아직 CSS는 하지 않았다. state가 한 차례씩 밀리는 문제 아래 코드와 같이 작성하니 state가 한칸씩 밀려서 출력되었다. 예를들면 처음에 seoul을 입력하면 빈객체가 출력되고, paris를 입력했을때 seoul이 출력되고, jeju를 입력했을때 paris가 출력되었다. const getWeather = async () => { ..생략.. if(responseJson){ .. 2021. 10. 3.
바닐라자바스크립트로 허접한 날씨 앱 만들기 리액트로 만들려고 했는데, uncaught (in promise) syntaxerror: unexpected token < in json at position 0 에러의 비밀을 풀지 못하고 접었다. 아쉬워서 DOM으로나마 만들었다. 후 도시 이름은 API에 등록된 이름만 가능하다. NewYork이라 치면 안나오고 New York이라 쳐야 한다. CSS는 귀찮아서 안했다. https://github.com/ryu9663/weatherAlarm.git GitHub - ryu9663/weatherAlarm: Yon can see the weather of city where you wonder Yon can see the weather of city where you wonder. Contribute to r.. 2021. 9. 8.
반응형