/omdb-series

Primary LanguageTypeScript

OMDB Series application

🗂 Monorepo structure

Package Description
web Front end application created with NextJS
ui React components with stories

💥 Features

  • Mobile first
  • Carousel with all episodes of the season made with scroll-snap css
  • Dynamically loaded episodes
  • Details about the episodes

⚒️ Stack

  • Lerna with NPM monorepo
  • NextJS
  • React-query
  • Cypress (E2E test)
  • Testing Library (Unit test)
  • React Loading Skeleton
  • Vitest
  • Storybook
  • Github actions with Release
  • Component library with React
  • Conventional commits
  • Semantic releases

Demo

Mobile

Desktop

⚠️ Requirements

  • Node >= v18.12.1
  • NPM >= 8.19.2

Create an .env file in web:

NEXT_PUBLIC_OMBD_API_KEY=ENTER_YOUR_OMBD_API_KEY

🌐 Link

  • Front end application: Demo

🚀 Run locally

In the root folder run the following commands:

  1. Install dependencies
  npm i
  1. Run the project
  npm run dev

🚦 Testing

Unit tests: To run unit tests go to ui and then run the following command:

## omdb-series/packages/ui
  npm run test

E2E tests: Go to web and then run the following command:

  1. Running the project
  npm run dev
  1. Start Cypress
  npx cypress open