Overview

The Fullstack React & GraphQL - Next JS and Hasura Starter Kit is a boilerplate for building fullstack React and GraphQL applications using Next JS and Hasura. The kit includes a basic todo app example and provides a minimal JWT setup for authentication and authorization. It leverages Next JS’s serverless capabilities by exposing API routes for login and registration. The kit also utilizes a range of open source technologies and practices, including Next JS, Hasura, PostgreSQL, JWT, React Query, and Axios.

Features

• Next JS: Provides flexibility in choosing the rendering approach for each page and includes API routes to act as a minimal Express server.
• Hasura: A GraphQL engine that connects databases and other services with the app by automatically generating a GraphQL backend.
• PostgreSQL: A powerful open source object-relational database system that extends the SQL language.
• JWT: An industry-standard for securely representing claims between parties. The implementation includes a short-lived access token stored in memory and a long-lived refresh token stored in an HTTP-only secure cookie.
• React Query: A data state management tool in React that provides caching, refetching, deduping, and other features.
• Axios: A flexible HTTP client that works in the browser and the server, used as the REST API and GraphQL client in the project.

Installation

To get started with the Fullstack React & GraphQL - Next JS and Hasura Starter Kit, follow these steps:

1. Install the following prerequisites:
   • NodeJS
   • Docker
   • Docker Compose
   • Hasura CLI
2. Clone the repository.
3. Run the backend locally using Hasura.
4. Run the frontend locally using Next JS.

Note: It is important to properly manage and secure the secrets used in this kit, and to review the official documentation for Next JS and Hasura for instructions on changing and adding secrets before going to production.

Summary

The Fullstack React & GraphQL - Next JS and Hasura Starter Kit is a comprehensive boilerplate for building fullstack React and GraphQL applications. It provides a todo app example and incorporates a range of technologies and practices to enable efficient development and secure authentication. With the flexibility of Next JS, the power of Hasura, and the features of React Query and Axios, this starter kit offers a solid foundation for creating robust applications.