본문 바로가기

TIL173

Plmography 프로젝트 작업 로그 #11 - TMDB API 사용하기 (22.12.22 TIL) 어제 컴포넌트 내에서 가짜 DB 를 만들어서 화면에 출력해주는 작업을 했다면, 오늘은 프론트에서 TMDB 에서 제공하는 오픈 API 를 사용해서 화면에 영화 리스트를 출력해주는 작업을 진행했다. 일단 결과물은 아래와 같다! 본문 CSS 는 아직 적용하지 않았지만 헤더는 좀 더 꾸며보았다. 내가 사용한 api 적용법은 아래와 같다. API key 발급 1) 회원가입 후 설정으로 이동한다. 2) API 키 요청을 클릭한다. 3) 'Developer' 전용 API 를 선택한다. 4) 개인 정보를 입력해준다. 모든 입력란을 채워주어야 다음 단계로 넘어갈 수 있다. 어플리케이션 개요는 두 줄 이상을 써야 넘어가는 듯 하다. 한 줄만 적었더니 유효성 검사에서 계속 걸렸음! 5) 위 순서대로 진행하면 아래와 같이 최.. 2022. 12. 22.
Plmography 프로젝트 작업 로그 #10 - 일단은 구현하기 (22.12.21 TIL) 어제까지 기획 설계 및 개발 세팅까지 다 끝내고 실질적으로 개발에 들어간 오늘. 헤더 라우팅 처리를 끝내고 상세 페이지부터 작업하려는데 DB 에 있는 컨텐츠를 원하는 조건에 맞춰 필터링 해주는 서비스가 핵심이다보니 당장 화면에 출력해줘야 하는 데이터를 어떻게 가져올 지가 오늘의 고민이었다. TMDB 에서 제공하는 오픈소스 API 를 사용할 예정이어서 그 사용법을 살펴보고 있었는데, 외부 API 를 한 번도 사용해본 적이 없어서 망설이고 있었다. 그래서 헤더만 구현한 채 디테일 페이지는 하지도 못하고 오후 시간을 흘려 보냈는데, 동료분이 일단은 먼저 하드코딩으로라도 데이터를 밀어 넣어서 화면에 보여주는 작업을 먼저 해보는 게 어떻겠냐는 조언을 주셨다. 그래서 그 조언대로 일단은 하드코딩으로 한 컴포넌트 안.. 2022. 12. 21.
Plmography 프로젝트 작업 로그 #9 - E2E 테스트 작성 시작 (22.12.20 TIL) 일과 시간 전까지 10 뽀모 달성하기를 어제의 액션플랜으로 잡았는데 지금 막 10뽀모를 달성했다. 액션플랜보다 약 5시간을 초과했는데, 하루를 얼마나 알차게 보내지 않았는 지 반성하게 된다.. 뽀모를 돌리지 않았으면 내가 하루를 어떻게 보냈는 지도 측정하기 어려웠을 것이다. 방해요인은 피로 때문인데, 어떻게 하면 이 피로함을 해결할 수 있는지 계속 생각해봐야 할 것 같다. (산책의 효과는 미비했다..!) 그리고 개발 전 프론트 세팅을 다 해놓고 App.jsx 에서 라우팅 처리를 하다가 E2E 테스트 작성을 하지 않은 걸 발견하고 이제 막 작성을 시작했다. 중간 순서를 까먹지 않게 마카오 기프트 때 작성한 개발 문서를 다시 복기해봐야겠다. 그리고 리액트를 다루는 데에 있어서 아직 많이 부족함을 느껴서 1기.. 2022. 12. 20.
Plmography 프로젝트 작업 로그 #8 - 스프린트 & 프론트 개발 세팅 (22.12.19 TIL) 다사다난했던 기획주가 끝나고 오늘부터 개발 시작이다! 사실 클래스 다이어그램을 설계하느라 개발 세팅을 이제서야 막 시작했다^^; 스프린트 시트를 만들어서 주간 목표를 설정하고, 각각의 태스크마다 예상 스토리 포인트와 실제 스토리 포인트를 기록한다. 앞으로 이 로그를 반복하다보면 각 태스크당 얼마나 걸릴 지 감을 잡을 수 있게 되겠지? 그리고 바로 프론트 레포지토리를 생성하고 리액트 세팅을 방금 막 완료했다. 일단 홈페이지부터 띄우려는데, 아무리 세팅을 완료해도 화면에 나오지가 않는 것이다. 알고보니 App.jsx 에서 라우팅 처리를 해놓고서 index.jsx 에서 BrowserRouter 처리를 해주지 않아서 생긴 문제..이걸로 또 한 20분 보낸 것 같다. 이런 기본적인 세팅은 절대 실수하지 않도록 하.. 2022. 12. 19.
Plmography 프로젝트 작업 로그 #7 - 클래스 다이어그램 (22.12.18 TIL) REST API 설계를 하다가 막연하게 허공에 쉐도우 복싱하는 기분이 들어서 모델 한정으로 일단 클래스 다이어그램 먼저 짠 후에 api 설계를 하면 좀 더 수월해지지 않을까 하는 맘에 모델 설계를 하기 시작했다. 하지만 다이어그램을 짜기 위해 노트에 계획 세우는 것에도 하루를 보내버린 나 자신..^^ 이렇게 시간만 보내다가는 아무것도 못하겠다 싶어서 일단 하자는 생각으로 GitMind 를 켰다. 일단은 툭툭 던지는 식으로 작업 중이어서 점점 모양은 갖춰지고 있다. 몇몇 필드는 VO (값객체) 로 만들 계획이라 다시 전면 수정되어야 한다. 나는 무한정으로 계획만 세우다가 늦어졌던 경험이 너무 많아서 '일단 하자' 마인드가 필요하다. 일단 하자..만들고 부수고 다시 만드는 것에 두려움을 갖지 말자!!!! 2022. 12. 18.
Plmography 프로젝트 작업 로그 #6 - REST API 설계 (22.12.17 TIL) F/E URL 설계를 끝내고 이제 REST API 를 설계할 예정인데, 설계에 앞서 REST API 특징에 관해 정리해보고자 글을 쓴다. REST API 가장 큰 특징 두 가지는 URI 로 자원(리소스)을 요청하여 특정 형태로 표현한다는 것과, HTTP 메서드 (GET, POST 등) 를 적극적으로 활용하여 행위를 나타내야 한다는 점이다. 예를 들어 GET /users 는 모든 user 의 정보를 응답으로 달라는 이야기이고, DELETE /user/1 은 userId: 1 에 해당하는 user 를 제거하라는 의미가 된다. 응답은 대체로 JSON 형태로 표현된다. REST API 를 좀 더 RESTful 하게 표현하기 위한 규칙은 아래와 같다. 마지막이 / (슬래시)로 끝나서는 안된다. _(언더바) 대신 .. 2022. 12. 18.