목록2026/01/20 (7)
프로그래머가 되는 꿈
습도 온도근데 온도 단위가 뭐지?나는 섭씨를 가지고 오고 싶어~ url 뒤에 붙여준다! 화씨 : 섭씨 * 1.8 + 32 return ( {weather?.name} {weather?.main.temp}/110화씨 -누나 / 화씨는 혼자서 해보기! {weather?.main.temp}/{(weather?.main.temp * 9) / 5 + 32} {weather?.main?.temp} ℃ / {((weather?.main?.temp ?? 0) * 9) / 5 + 32} ℉ {weather?.weather[0].description} )
우리는 UI도 있고, 데이터도 있고, 이제 데이터를 보여주면 된다 weather 데이터는 UI에 보여지는 데이터이걸 state에 담는다[weather, setWeather] = whether의 값을 넣어주어야 한다. 언제? 데이터가 왔을때 쓱 넣어주어야 한다. setWeather(data)로 state에 값 넣어주기! weather를 WeatherBx에서 (데이터를) 보여주어야 한다. weather 정보를 props로ㅓ WeatherBox에 보내기 props는 object타입이다. 이것도 가능하지만 매번 props를 칠수는 없다.따라서 es6문법의 destructuring을 사용하면 아래와 같이 사용하면 된다. but,,,새로고침을 하니까 에러가 나옴 ㅜㅜ"많이 본 에러" null이라서 nam..
중앙으로 가져오는거 flexbox가로 가운데 정렬세로가운데 정렬 가로 가운데 정렬을 됐는데세로 가운데 정렬은 안됐는데? "(div) container 자체의 높이가 작다!!!" 높이는 무조건 height100 view height = view의 100%로 해주세요!! 근데 같은라인,한줄에 있는게 거슬려...ㅜㅜㅜ버튼들은 밑에 두고 싶어... 이유... display: flex 때문!이건 flexible하게 item들을 조절하게 해주는 데에 너무 좋은데... div안에 있는 (같은 영역안에 있는 ) 모든 아이템들을 세로가 아닌 가로 정렬로 바꿔버린다 ㅜㅜㅜ자식 div들이 한줄로 된다...원상복귀(?)하기 위해서는?.... 세로 기둥으로 방향을 바꿔주세요!! 이제 테두리를 그려보자구!!! ..
WeatherButton라는 컴포넌트를 만들기 위해서는 ...몇가지 추가해주어야 한다. 엔터치면이게 나온다.. 버튼을 일일이 ~~~으로 만들 수 있지만 일일이 만들기에는 귀찮!!!! 여기서...리액트 부트스트랩 사용!! html,css에서 사용한 것(그대로 들고오면) 안된다!리액트 전용 부트스트랩이 따로 있다...! 왜냐하면 리액트는 모든것을 컴포넌트화 시킨다. 그래서 리액트 부트스트랩에서도 버튼을 컴포넌트화 시켜서 제공한다. 그래서 여기서는 리액트 부트스트랩을 가져올 것임!! https://react-bootstrap.netlify.app/ React Bootstrap | React BootstrapThe most popular front-end framework, rebuilt for Reactre..