GANS

Create applications with GraphQL 🌁, Apollo 👩‍🚀, Next.js 👉 and Styled-components 💅. All on firebase 🔥

Why?

Simple, I like all the technology which was involved in this repository. I wanted to use GraphQ for a while and Apollo is a good way to work with GraphQL. Also, I use React at my office so it was natural that I used something that I can understand (mostly) and manage. Next.js is for the SSR (Server side rendering) part, I want to have a SEO ready app but also to load the app as fast as possible! Styled-components is a personal choice, I like how it works.

I should write something more interesting than that... Hey I'm not a writer :D.

Installation

clone the repo
yarn install

Graphcool

GANS is using GraphQL to make it easier, and also because I love the service, GANS is using Graphcool. Graphcool develops and deploys production-ready serverless GraphQL backends. Including GraphQL database mapping, real-time subscriptions & flexible permission system. The documentation is really great and the support is top notch!

To use Graphcool with GANS, please register on the website.

cd server
graphchool deploy

Of course you can use a different GraphQL provider!

Environment

Create a file .env at the root of your project. GANS uses dotenv make keys available in the project. It's also a good way to hide your keys.

# GRAPHQL
GRAPHQL_ENDPOINT = your_endpoint
GRAPHQL_SUBSCRIPTIONS = your_subscription

You can add your own keys to the project too, the example here is like the minimum for the project.

Next.js Development

Standard Next.js development with Hot-module Reloading etc

yarn dev

You can see the local development on http://localhost:3000/

Next-routes

GANS is using next-routes to manage routing for the project. You can manage your routes inside routes.js file. Check Next-routes documentation for usage.

Deploy to Firebase

You will need to connect the project to your Firebase project. Edit the name in .firebaserc or run firebase init and choose not to override any files.

Deploy Hosting resources and the rewrite Cloud Function

yarn deploy-app

Deploy functions not used for the SSR

Deploy all functions specified in the function group. Edit this script to add more function groups. - see Partial deploys docs for how to use function groups.

yarn deploy-funcs

Deploy everything to Firebase

yarn deploy-all

Clean dist Folder

yarn clean

Contributing

You are more then welcome to help GANS to be successful! Let's do it together!

1. Fork it ( https://github.com/JulienHe/GANS/fork )
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create a new Pull Request

Special thanks!

Special shoutout to @jthegedus, you kill it!