DEV Community

loading...
Cover image for React, Prisma, GraphQL Boilerplate

React, Prisma, GraphQL Boilerplate

Médéric Burlet
『  』| Passionate Coder | Idea Hurricane
Updated on ・1 min read

Introduction

I find myself often recreating simple landing pages, login, logout, signup flows and I got really tired of it. Especially when its for small projects.

I decided to make a nice easy to use boilerplate accessible for all.

GitHub logo crimson-med / react-prisma2-graphql-boilerplate

Simple React, Prisma2, GraphQL, Boilerplate

This project is open to Hacktoberfest contributions as long as the CONTRIBUTING.md is respected.

Quick Start

First:

git clone https://github.com/crimson-med/react-prisma2-graphql-boilerplate.git
Enter fullscreen mode Exit fullscreen mode

Then follow the following instructions.

Open two terminals and follow the following commands:


Terminal 1 Terminal 2
cd backend cd frontend
yarn install yarn install
yarn dev yarn start

That's it you are up and running!

Frontend

In this frontend we leverage React for all the rendering. We also user OvermindJS for state management and ApolloClient for GraphQL interactions.

Backend

An implementation of a GraphQL server with an email-password-based authentication workflow and authentication rules, based on Prisma, graphql-yoga, graphql-shield & Nexus Schema. It is based on a SQLite database.

Since we are using prisma the database can easily be switched to anything (postgre, mysql, etc.)

Screenshots:

Homepage:

homepage

Login:

login

Signup:

signup

Dashboard:

dashboard


Burlet Mederic
https://medericburlet.com
https://mederic.me
https://twitter.com/crimson_med

Discussion (2)

Collapse
olivia101 profile image
Cristian

Blitz.js has login, logout, signup flows built in. Check it out at blitzjs.com/

Collapse
crimsonmed profile image
Médéric Burlet Author

Thanks however I was looking to use graphql. As of now blitz uses its own system for handling field only.I was also looking to have my own state management for various management hence OvermindJS which I really enjoy working with.

Blitz is a really nice framework but that wasn't really needed for what I was trying to do.