This is a personnal project using NextJs, Apollo, Graphql, Typescript and The Movie Database (TMDB) API.
- Nextjs The React Framework for the Web.
- React React 18.
- Typescript JavaScript with syntax for types.
- ESLint Find and fix problems in JavaScript and typescript code.
- Prettier Code formatter.
- husky Husky improves your commits.
- materialUI Move faster with intuitive React UI tools.
- tailwindcss A utility-first CSS framework.
- apollo-client Apollo Client is a comprehensive state management library for JavaScript that enables you to manage both local and remote data with GraphQL.
- Apollo-server Apollo Server is a spec-compliant GraphQL server that's compatible with any GraphQL client.
- codegen CodeGen is a family of open-source model for program synthesis.
- Graphql A query language for an API.
- Prisma Next-generation Node.js and TypeScript ORM.
node
npm
Install dependencies :
npm install
Creates the .env file in the root directory of the api folder :
cd api && touch .env
In the .env, set the environment variables
Example :
DATABASE_URL=your-mongodb-url
TMDB_API_KEY=your-TMDB-api-key # Get your TMDb API key and paste here
NEXT_PUBLIC_API_URL="http://localhost:8080/api/graphql"
Run your GraphQL server and your React app with this command :
npx prisma generate
npm run dev
Navigate to http://localhost:8080/graphql/api in your browser to explore the API with the Apollo Playground.
Navigate to http://localhost:8080 in your browser to run the React app.