React Apollo Graphql Boilerplate

A Full-Stack React Apollo Graphql Boilerplate written in Typescript. A scalable development that focus on performance and best practices. Easily plugable client or server code to build on top.

Features

Next Generation JavaScript with Typescript

• Stop worrying about browser support and use features like template strings, object destructuring, arrow functions, JSX syntax, and more today! Include Typescript in both client and server for high performing and robust code!

Next Generation CSS

• Usage of styled-component that allow uses of the best bits of ES6 and CSS to style your apps without stress!

Quick Scaffolding

• Automate the creation of components, containers, features - and their tests - right from the CLI! Avoid fighting the glue of your code and focus on your app!

GraphQL

• GraphQL is an open-source data query and manipulation language for APIs, and a runtime for fulfilling queries with existing data

Client

• ESLint and Prettier
• Typescript
• Create React App
• React Router Dom
• React-Apollo with hooks
• Styled Components
• React Hook Form
• Ant Design
• Plop.js Code Generator

Server

• Typescript
• Node.js
• Express
• Graphql
• Apollo Server
• Mongoose
• MongoDB
• Plop.js Code Generator

Quick Start

• Create a new repository at github.com. (this is your repository)
• Run the following command in you cli.

git clone https://github.com/ayepRahman/react-apollo-graphql-boilerplate.git <YOU_PROJECT_NAME>
cd <YOU_PROJECT_NAME>
rm -rf .git
git init
git remote add origin https://github.com/<username>/<YOU_PROJECT_GIT_URL>.git
git add .
git commit -am 'initialize new project'
git push origin master

Installing

$ npm install

#or

$ yarn

• to run the project, server will run on http://localhost:3000/

$ npm run start

#or

$ yarn start

• to run tests

$ npm run test

#or

$ yarn test

TODOs

Client

• Test Cases

Server

• Test Cases
• Add Webpack
• graphql-compose
• graphql-compose-mongoose