React 클론 코딩 (4) 썸네일형 리스트형 2021년 5월 30일 #4 weather app + todo app에 animation 적용하기(미완) 2021년 5월 26일 #3 weather app + todo app 만들기 with React (미완) 지난 5월 23일부터 react를 연습하기 위해 초보자들이라면 반드시 만들어야하는 weather app을 만들기 시작했다. 어렵기만하던 react가 재밌게 느껴졌다. (역시 이론만 배우면 재미가 없다. 자발적 의 bedeveloper.tistory.com 기존 만들었던 앱에다가 애니메이션과 react-router-dom을 통한 화면전환을 구현해 보았다. 화면전환 효과가 더욱 두드러지게 하기 위해 header를 만들었다. 상상했던 모습을 대부분 구현할 수 있었으나 몇가지 문제점이 있었으니.... 문제점을 적기 전에 우선 결과물부터 보자. *일단 입력했었던 결과가 유지가 되지 않는다. 이 부분은 Loca.. 2021년 5월 26일 #3 weather app + todo app 만들기 with React (미완) 지난 5월 23일부터 react를 연습하기 위해 초보자들이라면 반드시 만들어야하는 weather app을 만들기 시작했다. 어렵기만하던 react가 재밌게 느껴졌다. (역시 이론만 배우면 재미가 없다. 자발적 의지로 뭔가 만들어야 재미를 느끼는 것 같다. ) 좋아... todo app에 weather app을 더해보자는 생각이 들었다. weather app + todo app의 조합은 참을 수 없지 않겠는가? 아래 결과물을 보자. 구현할 때 집중했던 부분은 아래와 같다. fetch()를 통해 날씨 정보와 배경화면을 받아오는 것 useState와 삼항연산자를 통해 className에 변화를 주어 toggle효과를 구현해 보는 것(도시 날씨를 클릭하면 해당 창을 확대 해준다.) 내일부터는 화면전환을 시도해보.. 2021년 5월 8일 React 클론 코딩 #2 how-is-d-weather(날씨 앱) 完 HA가 끝나고 soloday에 앞으로 코드스테이츠가 진행되는 동안 무엇을 더 개인적으로 공부하면 좋을지에 대하여 생각하는 시간을 가졌고, 웹과 모바일 기기 상에서 움직이는 무엇인가를 vanilla javascript와 react로 구현하는 것을 공부해야겠다라고 결론을 내렸다. 공부아니더라도 이해를 다 하지 못하더라도 따라하는 것이라도 계속 해보자라는 것. 그런 의미로 노마드코더 니꼬센세의 React Native로 날씨 앱을 구현하는 무료 인강을 보며 차근차근 따라가기 시작했다. 이 앱의 핵심은 모바일 기기의 위치(latitude, longitude)를 파악하여 날씨 API에서 날씨정보를 불러와 앱의 화면에 보여주는 것이다. 내가 했던 것은 날씨 API에서 받아온 현재 날씨의 상태에 따라 어떻게 화면이 나.. 2021년 5월 1일 React 클론 코딩 #1 movie_app_2021 完 코드스테이츠에서 React를 들어가기전 React를 조금이나마 알기위해 기능구현까지 코딩했던 노마드코더 니꼬센세의 movie_app 강좌를 끝까지 듣고 그 후 Home화면에서 영화를 누르면 나오는 해당 영화의 Detail Component에 약간의 CSS를 추가하였다. 정말 아무것도 없는 無의 상태였기에 너무 꼴보기 싫지않게 약간의 CSS만 넣었다. 아래 웹은 깃헙에 의지하여 퍼블리싱한 나의 movie_app 페이지이다. movie_app_2021 bmaner.github.io 처음 React로 무언가를 만들었다는 점에서 애착이 간다. 하지만 애착이 가는 것과 별개로 너무 못생긴 상태 + 아무런 효과가 없는 상태이기에 이것에 어떻게 효과와 CSS를 더할지 앞으로 공부할 것이고 그를 바탕으로 계속 upda.. 이전 1 다음