Nuxt Apollo Hasura Example

Made by @ctwhome

Project idea: Full Stack Recipes

ChangeLog: Changelog

Tech Stack: Nuxt.js, Vuetify, Hasura, Postgres, Passport.js.

Features list:

• Authotization with Auth0 -> JWT -> Hasura
• CRUD example with Subscriptions
• Roles definitions
• Federated login with Google and Github
• Deploy to Firebase Hosting and Github pages
• Licensing Notes
• DB migrations between environments

Template setup

From Github, you can click on Use this template to create a new repository based on this one.

Alternatively, you can create a new repository from your terminal:

# Clone this repo
$ git clone https://github.com/NLeSC/nuxt-apollo-hasura -b master --single-branch <project-name>

# Enter the new directory
$ cd <project-name>

# Replace origin with your repository url
$ git remote set-url origin <git repository>

# Send this repository to the remote
$ git push --origin master

# Add template repository
$ git remote add template https://github.com/NLeSC/nuxt-apollo-hasura

Environment variables

Modify the .env file to use the urls from NHost. You will need to add urls for GraphQL and auth.

Getting started

You will need to have installed in your machine: Node, Yarn, Docker compose and Prettier

# Install the dependencies
$ yarn

# Start the development server
$ yarn serve

To run in production, use the start command

$ yarn start

Updating from template

Fetch from the `template` remote. If you cloned via Github, you will need to add the remote origin.

# Add template repository
git remote add template https://github.com/NLeSC/nuxt-apollo-hasura

# Update repo
git fetch --all 

# Merge the branch you want from the remote template
git merge template/main --allow-unrelated-histories

Licensing Notes

Tracking and understanding licensing Node applications can be tedious due to the 3rd party packages involved in the project.

You can run this command locally to check the number of licensing for the installed packages. npx license-checker --summary

See only production packages: npx license-checker --production

See all option here

Example:

 $ npx license-checker --production --summary
├─ MIT: 988
├─ ISC: 89
├─ CC0-1.0: 24
├─ BSD-2-Clause: 22
├─ BSD-3-Clause: 12
├─ Apache-2.0: 6
├─ (MIT OR CC0-1.0): 3
├─ Public Domain: 2
├─ BSD*: 2
├─ 0BSD: 2
├─ (MIT OR Apache-2.0): 1
├─ CC-BY-4.0: 1
├─ UNLICENSED: 1
├─ (WTFPL OR MIT): 1
├─ (MIT AND Zlib): 1
└─ (MIT AND BSD-3-Clause): 1