3ad55721d1
**Reasons for making this change:**
- it is contained within `node_modules/`, which is already ignored
- the previous versions, which were not in `node_modules/`, did not have
a period at the beginning of the filename
Links to documentation supporting these rule changes:
**Changelog with proof here:**
|
||
|---|---|---|
| .. | ||
| components | ||
| pages | ||
| setup | ||
| utils | ||
| .env.local.example | ||
| .gitignore | ||
| package.json | ||
| README.md | ||
Auth & Realtime GraphQL Example Using Next.js and Nhost
This example showcases Next.js as the frontend using Nhost as the backend.
Demo
https://nhost-nextjs-example.vercel.app/
Deploy Your Own
Once you have created a Nhost project and have access to the environment variables you'll need, deploy the example using Vercel:
How to use
Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:
npx create-next-app --example with-nhost-auth-realtime-graphql nhost-app
# or
yarn create next-app --example with-nhost-auth-realtime-graphql nhost-app
# or
pnpm create next-app --example with-nhost-auth-realtime-graphql nhost-app
Configuration
Step 1. Create an account and a project on Nhost
Create an account and project on Nhost.
Step 2. Create items database
Go to your project's Hasura console. Go to the DATA tab in the top menu and click SQL in the bottom left menu.
Then copy the content from setup/data.sql in this example and paste it in the Raw SQL form in the Hasura Console. Make sure Track this is checked and click Run!
Step 3. Add API metadata
Again, in the Hasura console, click on the gearwheel (settings) in the top right menu. Click on Import metadata and select the file setup/hasura-metadata.json in this repository.
Step 4. Add environment variables
Copy .env.local.example to .env.local and update the two URLs with your Nhost project URLs. You find the URLs in the Nhost console dashboard of your project.
Step 5. Run Next.js in development mode
npm install
npm run dev
# or
yarn install
yarn dev
Your app should be up and running on http://localhost:3000! If it doesn't work, post on GitHub discussions.
Step 6. Deploy on Vercel
You can deploy this app to the cloud with Vercel (Documentation).