beni1026/movie_search_vue

👉배포 사이트

Vue.js와 영화 검색 API를 활용한 프로젝트

기본 요구사항

• 검색어를 입력해 영화를 검색할 수 있어야 합니다.
• 검색된 결과를 통해 영화의 상세 정보를 볼 수 있어야 합니다.
• 클라이언트에서 API Key(7035c60c)가 노출되지 않아야 합니다.
• 실제 서비스로 배포하고 접근 가능한 링크를 추가해야 합니다.

선택 요구사항

• API 요청(Request)에 대한 로딩 애니메이션을 추가해 보세요.
• 영화 상세 검색으로 출력할 영화 포스터를 더 높은 해상도 사용해 보세요.
  • 영화 포스터 주소에 포함된 SX300를 SX700과 같이 더 큰 숫자로 수정해 요청하세요.
  • 실시간으로 이미지의 크기를 다르게 요청하는 것이 어떤 원리로 가능한지 조사해 보세요.
• 요청 주소에 HTTP가 아닌 HTTPS 프로토콜을 사용해야 하는 이유를 조사해 보세요.
• Bootstrap 등의 UI 프레임워크를 구성해 프로젝트를 최대한 예쁘게(?) 만들어 보세요.
• Open Graph 혹은 Twitter Cards로 Meta 정보를 제공해 보세요.
• NuxtJS를 활용해 Server Side Rendering(SSR)과 검색 엔진 최적화(SEO)를 도입해 보세요.
  (만약 SSR에 익숙치 않다면, SPA 프로젝트를 먼저 만들어 보고 도전하세요!)