React 인터뷰 과제-user-detail-app

사용자 세부정보 앱

1단계

create-react-app과 React-Router를 사용하여 웹 앱을 구축해 보겠습니다.

randomUser API의 사용자 데이터를 사용하여 10명의 사용자 목록을 렌더링합니다.

1. 목록에는 각 사용자의 이름이 표시됩니다.
2. 사용자 이름을 클릭하면 해당 사용자의 사진, 이름, 이메일 주소, 주, 국가로 구성된 해당 사용자 세부정보 페이지로 이동합니다.

사용자 세부정보 페이지에 표시할 데이터:

• 사진
• 이름
• 이메일
• 위치(주 및 국가)

API URL: https://randomuser.me/api/
쿼리 매개변수: 결과=10

추가:
코드를 최적화할 수 있는 방법을 고려해보세요.

2단계

• 상태 관리를 구현합니다.
• 사용자 집합을 한 번만 가져옵니다. 페이지 간 이동 시 네트워크 호출이 없습니다.
• 사용자를 즐겨찾기로 표시하려면 세부정보 페이지에 버튼을 추가하세요.
• 홈 페이지에서 특수 CSS를 사용하여 즐겨찾는 사용자를 강조표시하세요.

위 내용은 React 인터뷰 과제-user-detail-app의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!