본문 바로가기
반응형

개발/소소한 실습14

날씨앱 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.
forEach() : 버튼을 누르면 버튼에 적힌 색깔로 제목 색깔이 변하는 코드 여러개의 속성(버튼)에 하나의 이벤트핸들러 추가하기. w3school홈페이지를 보면서 혼자 DOM CSS 를 공부하다가 이 코드를 만들게 되었다. 버튼개수만큼 함수를 일일이 여러개 만들면 쉽게 기능을 구현할 수 있었지만, 예전 생활코딩 유튜브 볼때 이고잉님의 '항상 코딩할땐 1억개를 한번에 바꿀 수 있는 기능을 만들어야 해요 여러분' 이라는 대사가 떠올라서 함수하나로 모든걸 퉁쳐보기로 했다. 새로배운것 : forEach const title = document.getElementById('sent')//제목 let btns = document.querySelectorAll('input[type = button')//버튼들을 btns에 할당했다. btns.forEach(function (i){//버튼에 적.. 2021. 7. 24.
반응형