fe-sprint-statesairline-client

fe-sprint-statesairline-client의 목표 

💡 Part 1: 항공권 목록 필터링
    🧩 Main 컴포넌트에서 항공편을 조회합니다
      ✓ Main 컴포넌트 내 `search` 함수는 검색 조건을 담고 있는 상태 객체 `condition`을 업데이트해야 합니다 (24 ms)
    🧩 Search 컴포넌트를 통해 상태 끌어올리기를 학습합니다
      ✓ 검색 화면이 Search 컴포넌트로 분리되어야 합니다 (3 ms)
      ✓ Search 컴포넌트에는 상태 변경 함수 `search`가 `onSearch` props로 전달되어야 합니다 (5 ms)
      ✓ 상태 변경 함수 `search`는 Search 컴포넌트의 `검색` 버튼 클릭 시 실행되어야 합니다 (25 ms)
  💡 Part 2: AJAX 요청
    🧩 Side Effect는 useEffect에서 다뤄야 합니다
      ✓ 검색 조건이 바뀔 때마다, FlightDataApi의 getFlight를 검색 조건과 함께 요청해야 합니다 (16 ms)
      ✓ getFlight의 결과를 받아, flightList 상태를 업데이트해야 합니다 (55 ms)
      ✓ 더이상, 컴포넌트 내 필터 함수 `filterByCondition`를 사용하지 않습니다
      ✓ 더이상, 하드코딩된 flightList JSON을 사용하지 않습니다 (초기값은 빈 배열로 둡니다)
      ✓ getFlight 요청이 다소 느리므로, 로딩 상태에 따라 LoadingIndicator 컴포넌트를 표시해야 합니다 (38 ms)
    🧩 FlightDataApi에서 기존 구현 대신, REST API를 호출하도록 바꿉니다
      ✓ 검색 조건과 함께 StatesAirline 서버에서 항공편 정보를 요청(fetch)합니다 (6 ms)

 

Main.js

 

Search.js

 

FlightDataApi.js

 

 

 

생각 

어찌저찌 테스트는 통과하였지만, 논리가 완벽하게 이해 되지는 않았다.

조금 더 이해해보고자 코드를 그대로 따라 적어보았으나 완벽하게 이해되지는 않았다.

코드를 읽으면 이해가 되고, 이 부분은 이렇게 해야지 음음~ 이런 생각이 들지만 백지상태에서 적어내려갈 능력은 아직 안된다.