Graphile Next Example

Preview: https://graphile-next-example.mdluo.com (Note: this preview app (together with the PostgreSQL server) is running on a free-tier e2-micro GCE VM, and it can get fairly slow due to the limited CPU and memory resources).

This is a full-stack web app developed with PostGraphile and Next.js, featuring NextAuth for 3rd party account login, Apollo Client as the React GraphQL client, and BlueprintJS and Tailwind CSS as the UI framework.

This app is inspired by Graphile Starter, please refer to it for more features and integration examples.

Features

• Log in (and sign up) with GitHub and Google accounts.
• Cookie-based JWT tokens for user identification.
• Cursor-based pagination (Relay style).
• PostgreSQL triggers and GraphQL subscription (realtime updates).
• Twitter-like user follow functionality.

Local development

Requirements:

• GitHub OAuth App and/or Google OAuth 2.0 Client ID
• Docker machine and docker-compose (for running PostgreSQL, optional if you installed PostgreSQL natively).
• Node.js (recommend >= 16) and npm (recommend >= 8) or yarn.

Step 1. Start PostgreSQL with docker-compose

docker-compose up -d

Step 2. Install dependences

npm ci

Step 3. Set up .env file

cp .env.example .env

And edit the .env file to ensure all the missing variables are set. Tip: you can use openssl rand -base64 30 | tr '+/' '-_' to generate a random string for passwords and secrets.

Step 4. Set up database

npm run db:init
npm run db:migrate

Step 5. (You can stop the npm run db:migrate once finished) Start the local development server

npm run dev

And got the http://localhost:3000