|
1 |
| -# protographql |
| 1 | +<p align="center" ><img src="public/assets/pictures/ProtographQLBanner.png" width="650px"></p> |
| 2 | + |
| 3 | +# ProtoGraphQL |
| 4 | + |
| 5 | +ProtoGraphQL is a **prototyping tool** that helps developers build and visualize GraphQL schemas and queries without writing any code. Users simply input their relational database tables and ProtoGraphQL will dynamically create a customized and functional GraphQL Apollo Server readily available for export. |
| 6 | + |
| 7 | +ProtoGraphQL is currently in beta. We would appreciate if you could post any issues to our GitHub – we are actively looking for areas for improvement and we welcome feedback from the community. |
| 8 | + |
| 9 | +Upcoming releases include adding visual indicators for table relationships in the “Schema” view, enabling users to create customizable GraphQL mutations, and extending support for NoSQL databases such as MongoDB. |
| 10 | + |
| 11 | +\* *We recently added support for users to view the structures and relationships of their tables using our GraphQL schema tree visualizer!* |
| 12 | + |
| 13 | +## Getting Started: |
| 14 | + |
| 15 | +### Mac / Linux |
| 16 | + |
| 17 | +1. Download [zip](INSERTURLHERE) |
| 18 | + |
| 19 | +2. Extract file |
| 20 | + |
| 21 | +3. Run app |
| 22 | + |
| 23 | +## How to Use: |
| 24 | + |
| 25 | +1. When the application loads, click on **Add Table** and populate the table form with a name and new fields. Optionally, you may also use the last three inputs in the form to create relationships to other tables. When you are done, click **Save**. |
| 26 | + |
| 27 | +2. Navigate to the **Schema**, **Code**, and **Visualize** tabs to toggle views: |
| 28 | + * **Schema** - view, edit, or delete tables you've added |
| 29 | + * **Code** - view generated GraphQL and SQL code before export |
| 30 | + * **Visualize** - view the GraphQL schema intuitively as a simple tree |
| 31 | + |
| 32 | +3. Export the code by clicking the **Export** icon. |
| 33 | + |
| 34 | +4. Enter your Postgres database URI and then select the directory you want to save your executable GraphQL server. |
| 35 | + |
| 36 | +## How to Run GraphQL Server: |
| 37 | + |
| 38 | +There are several libraries we could have used to create a GraphQL server, but we decided to use Apollo Server – the most popular library to setup an endpoint for responding to incoming GraphQL requests in JavaScript. |
| 39 | + |
| 40 | +1. Extract apollo-server.zip file |
| 41 | + |
| 42 | +2. Open the project |
| 43 | + |
| 44 | +3. Install dependencies |
| 45 | + ``` |
| 46 | + npm install |
| 47 | + ``` |
| 48 | + |
| 49 | +4. Run the server |
| 50 | + ``` |
| 51 | + npm start |
| 52 | + ``` |
| 53 | + |
| 54 | +5. Use Apollo Server Playground to mock client GraphQL queries and responses to your server. [Learn more about constructing GraphQL Queries here](https://graphql.org/learn/queries/) |
| 55 | + |
| 56 | +## Contributors: |
| 57 | + |
| 58 | +<img align="right" src="public/assets/pictures/icon/icon.png" width="125px"> |
| 59 | + |
| 60 | +- Alena Budzko [@AlenaBudzko](https://github.com/AlenaBudzko) |
| 61 | +- Bryan Fong [@bryanfong-dev](https://github.com/bryanfong-dev) |
| 62 | +- Rodolfo Guzman [@Rodolfoguzman25](https://github.com/Rodolfoguzman25) |
| 63 | +- Jarred Jack Harewood [@jackhajb](https://github.com/jackhajb) |
| 64 | +- Geoffrey Lin [@geofflin](https://github.com/geofflin) |
| 65 | + |
0 commit comments