https://github.com/teamstarter/gsg-boilerplate
A boilerplate to quickly get started with graphql-sequelize-generator using ES2016.
https://github.com/teamstarter/gsg-boilerplate
database graphql graphql-sequelize-generator sequelize
Last synced: 2 months ago
JSON representation
A boilerplate to quickly get started with graphql-sequelize-generator using ES2016.
- Host: GitHub
- URL: https://github.com/teamstarter/gsg-boilerplate
- Owner: teamstarter
- Created: 2020-10-19T11:35:18.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2023-02-28T16:50:33.000Z (over 3 years ago)
- Last Synced: 2025-01-12T08:43:14.924Z (over 1 year ago)
- Topics: database, graphql, graphql-sequelize-generator, sequelize
- Language: JavaScript
- Homepage: https://teamstarter.github.io/gsg-documentation/
- Size: 251 KB
- Stars: 0
- Watchers: 5
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# gsg-boilerplate
This project is a boilerplate to quickly get started with graphql-sequelize-generator.
It's a simple To Do list app based on [this codepen](https://codepen.io/karlomajer/pen/rvyyvV) that allows you to manage tasks (create, update, delete, count).
## Getting Started
First you need to clone the project.
```
$ git clone git@github.com:teamstarter/gsg-boilerplate.git
```
This project uses the 12.18.1 version of Node. You can switch to the right version using nvm. Install nvm if you don't have it
```
$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.36.0/install.sh | bash
```
Then choose the rigth version
```
$ nvm use
```
Then install all the dependencies of the project
```
$ yarn
```
Then you need to initialize the database before starting the project. It is configured by default with an sqlite database as described in ./config/config.json. The following command will create or replace the ./data/database.sqlite and run the migrations and the seeds.
You can use any [Sequelize](https://sequelize.org/master/manual/getting-started.html)-compatible database (Postgresql, MySQL, etc...)
```
$ yarn db-reset
```
Once the database is initialized, you can run the project
```
$ yarn dev
```
You can then test the app at this address: http://locahost:3000.
## The Server
It's a node server written in Typescript. It generates a GraphQL schema based on a few declarations of queries, mutations and subscriptions.
```javascript
graphqlSchemaDeclaration.task = {
model: models.task,
actions: ['list', 'create', 'update', 'delete', 'count'],
subscriptions: ['create', 'update', 'delete']
}
```
GSG requires a task model (in the models folder), to work with the above configuration.
```javascript
export default function Task(sequelize) {
var Task = sequelize.define(
'task',
{
id: {
type: DataTypes.INTEGER,
primaryKey: true,
autoIncrement: true
},
name: {
type: DataTypes.STRING,
allowNull: false
},
active: {
type: DataTypes.BOOLEAN,
allowNull: false
}
},
{
sequelize,
freezeTableName: true,
modelName: 'task',
paranoid: true,
timestamps: true
}
)
return Task
}
```
The server generates an endpoint (/graphql) to execute get/post queries from the app.
## The App
This boilerplace uses React. It was initialized using create-react-app.
The app uses apollo (the @apollo/client package) which allows you
to quickly send queries to the server to get or send data. In the following example, the query gets a list of tasks.
```javascript
const GET_TASKS = gql`
query GetTasks($order: String, $where: SequelizeJSON) {
task(order: $order, where: $where) {
id
name
active
}
}
```
## Available Commands
In the project directory, you can run:
### `yarn dev`
Runs the app in the development mode.
Open [http://localhost:3000](http://localhost:3000) to view it in the browser while reloading if you make edits.
The `yarn dev` command runs the app and the server with pm2.
### `yarn db-reset`
Creates a sqlite database file in the data folder and runs the migrations and seeds. If the database file already exists the file is replaced by a new one. This command is useful to clean the database and get a default one.
### `./node_modules/.bin/pm2 log`
Use this command to print logs in the terminal. It's useful to have some realtime logs when you need to debug your app.
### `./node_modules/.bin/pm2 delete all`
This command will stop your app.
## Learn More
You can learn more about graphql-sequelize-generator [here](https://teamstarter.github.io/gsg-documentation/).
To learn React, check out the [React documentation](https://reactjs.org/).
To learn Graphql, check out the [GraphQL documentation](https://graphql.org/)
You can learn more about pm2 [here](https://pm2.keymetrics.io/)