[5주차] githubID 검색창 구현 (React)

[official-Cherry]

✨ 구현 기능 명세

• O 전체 컴포넌트 구조 정하기
• O axios API 결과 불러오기
• O userData 를 ResultCard 로 넘기기
• O input 받아서 API 호출하기
• O styled-component 사용
• O Promise 상태에 따른 UI 처리
• O 사용자 Repo 최대 10개 불러오기

✨ 추후 할 것 (오늘 가족행사가 생겨버린 관계로,, ㅠㅠㅠ)

• styled-component 로 꾸미기
• Promise 상태에 따른 UI 처리
• ResultCard 우측상단 X
• 검색 History 구현

🎁 PR Point

• Repo 개수를 처리할 때 setUserData 안에 삼항연산자를 활용했는데, 성능/ 혹은 state 업데이트에 문제가 되는 상황이 발생할 수 있을까요?

😭 어려웠던 점

• 4주차에 제대로 학습을 못해서 이번주에 틈틈이 리액트 공식문서(짱좋..) +나희코어 강의 들으면서 따라가보았는데 데이터 처리까지 한번에 할 수 있는 리액트 너무 재밌네요! 전 꾸미는게 너무 어려워요 ㅠㅠ 전체 레이아웃 짜는 연습을 얼른 해야할

😎 구현 결과물

• 검색창에 hover 하면 스타일이 바뀌게 해보았습니다.
• promise 상태에 따른 UI 처리와, 보기 좋게 약간의 styled-component 를 적용해보았습니다.
• 리포지토리를 클릭하면 해당 페이지로 이동합니다.