Sonal-Maurya/portfolioSite

This is a portfolio site used to show case your work.

graphlatte

Next.js template with GraphQL, Urql, Prisma, Nexus and Tailwind

What is in Graphlatte

1. GraphQL Helix with GraphQL Playground
2. Nexus with Prisma (nexus-prisma)
3. GraphQL Codegen
   • TypedDocumentNode
   • Near operation files
4. Tailwind (JIT mode) with a base configuration
5. Docker Compose for local Postgres database
6. On-save Code generation with VSCode plugin Save and Run
7. Next.js built-in ESLint integration
8. Easy global typing with definitions.d.ts file (e.g. typing .env)
9. Using next-iron-session for authentication/session handling
10. Envelop included

Installation

• There are two main options to create a new project with Graphlatte

1. Use this template directly on GitHub

   • https://github.com/graphlatte/graphlatte/generate

2. Or clone with git

In your terminal

git clone https://github.com/graphlatte/graphlatte.git project-name
cd project-name

Install dependencies, generate code and run

With yarn

yarn
yarn generate:env
yarn dev

Or with npm

npm install
npm run generate:env
npm run dev

• Graphlatte comes with a base docker-compose file for running local Postgres

Requires installed and running Docker.

yarn db

# or
npm run db

• You can also use something like Concurrently to run the next dev and docker-compose in one command

// package.json
{
  // ...
  "scripts": {
    "dev": "concurrently \"next\" \"docker-compose\""
  }
}

This will install dependencies, generate Prisma schema + example .env file and start the Next development server

• Prisma schema gets regenerated after every yarn/npm add or install.

Deployment

Hosting

Recommended hosting choice is Vercel, which works well with Graphlatte.

You can also run Graphlatte on your server behind Nginx reverse proxy.

Database

• Railway (only US regions right now)

• Supabase (where you can also use PgBouncer just by adding ?pgbouncer=true flag https://supabase.io/blog/2021/04/02/supabase-pgbouncer 🤯 )

• Any Cloud Provider

  • with DBaaS like Cloud SQL on GCP or RDS on AWS, ...
  • or with VM (you will need to set up the database yourself)

Thanks

Big thanks to huv1k.

If you would like to use Next-Auth, Dependabot and configure GraphQL Codegen differently (e.g. use generated urql hooks), check out his great boilerplate https://github.com/huv1k/nextjs-auth-prisma.

License

The MIT License.