{"id":15504617,"url":"https://github.com/alanbsmith/react-graphql-starter","last_synced_at":"2025-03-28T18:43:39.550Z","repository":{"id":78448072,"uuid":"101436640","full_name":"alanbsmith/react-graphql-starter","owner":"alanbsmith","description":"[WIP] a simple starter for React + GraphQL and Express / PostgreSQL","archived":false,"fork":false,"pushed_at":"2017-09-26T06:34:50.000Z","size":83,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-02T19:27:59.689Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alanbsmith.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-08-25T19:40:42.000Z","updated_at":"2018-06-24T01:20:56.000Z","dependencies_parsed_at":"2023-04-22T21:47:38.610Z","dependency_job_id":null,"html_url":"https://github.com/alanbsmith/react-graphql-starter","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alanbsmith%2Freact-graphql-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alanbsmith%2Freact-graphql-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alanbsmith%2Freact-graphql-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alanbsmith%2Freact-graphql-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alanbsmith","download_url":"https://codeload.github.com/alanbsmith/react-graphql-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246083018,"owners_count":20720895,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-02T09:19:14.501Z","updated_at":"2025-03-28T18:43:39.528Z","avatar_url":"https://github.com/alanbsmith.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React + GraphQL Starter\n_for [Heroku](https://www.heroku.com/) deployment_\n\n## 🚨 NOTE 🚨\n_This is currently a WIP starter and isn't ready yet. I'm pushing up bits as I add new functionality. I'll bump the version to 1.0.0 when it's ready._ 🎉\n\n## OVERVIEW\nThis is a simple starter to get you up and running for React + GraphQL projects. The DB is stubbed with 'Todo list' data as a placeholder. Feel free to edit or remove this as needed.\n\nThis starter is intended to provide:\n\n* a lightweight Webpack config (for development and production)\n* some helpful tooling for development workflow\n* initial setup with PostgreSQL\n* Heroku-ready deployment setup\n\n### Tech Stack\nThis is intentionally minimalist. I feel like it's a better pattern for you to add what you want to a starter instead of dismantling cruft you don't want or need.\n\n* PostgreSQL / Knex (DB layer)\n* Node / Express (Server layer)\n* Nodemon (to auto-restart the server)\n* GraphQL / Express GraphQL (API layer)\n* ReactJS (Client layer)\n\n## UP \u0026 RUNNING\n### Install Dependencies\n```\n$ npm install\n```\n_or_\n```\n$ yarn\n```\n\n### Database Setup\n_**NOTE:** This assumes you have the Knex CLI installed. If not, first run:_\n```\n$ npm install -g knex\n```\n\n#### Creating your Database\nChange the database name on line 7 of `knexfile.js` from `react-graphql-starter` to whatever you'd like. Then in your terminal run:\n```\n$ createdb your-db-name\n```\n\nYou'll also need to create a `.env` file at the root of your project and add a username and password for your database. This file is already added to the `.gitignore`. You can follow the example in `.env.sample` to see how to set it up.\n\n```\n$ touch .env\n```\n\n```\n//.env\nDB_USER=\"your-username\"\nDB_PASSWORD=\"your-secret-password\"\n```\n\n#### Updating Migrations\nCurrently, there is a single migration file in `db/migrations` for creating Todos. You're welcome to change it to whatever you'd like by running:\n```\n$ knex migrate:make your-migration-name\n```\n\nTo run the migrations:\n```\nknex migrate:latest\n```\n\n#### Using Seeds\nCurrently, there is a single seed file in `seeds/todos` to generate some initial data. You're welcome to change it to whatever you'd like by running:\n```\n$ knex seed:make your-seed-file-name\n```\n\nTo run the seed file:\n```\n$ knex seed:run\n```\n\n### Fire Up Your Server\n```\n$ npm start\n```\n\nYou can view the GraphiQL UI at `http://localhost:8080/graphql`.\n\nIf you'd like more information on using `express-graphql`, you can find great docs [here](http://graphql.org/graphql-js/running-an-express-graphql-server/) and [here](https://github.com/graphql/express-graphql).\n\n#### GraphiQL Example Requests\n**FETCH TODOS**\n```\n{\n  fetchTodos {\n    id\n    text\n    complete\n  }\n}\n```\n\n**FETCH TODO**\n```\n{\n  fetchTodo(id: 1) {\n    id\n    text\n    complete\n  }\n}\n```\n\n**CREATE TODO**\n```\nmutation {\n  createTodo(input: {\n    text: \"get groceries\",\n  }) {\n    id\n    text\n    complete\n  }\n}\n```\n\n**UPDATE TODO**\n```\nmutation {\n  updateTodo(input: {\n    id: 2\n    text: \"get paint for the bedroom\"\n  }) {\n    id\n    text\n    complete\n  }\n}\n```\n\n**DESTROY TODO**\n```\nmutation {\n  destroyTodo(id: 4) {\n    id\n  }\n}\n```\n\n**Note:** _This is only setup for development at the moment. Nodemon is set to restart the server and GraphiQL UI is running by default._\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falanbsmith%2Freact-graphql-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falanbsmith%2Freact-graphql-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falanbsmith%2Freact-graphql-starter/lists"}