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.
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.
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.
* We recently added support for users to view the structures and relationships of their tables using our GraphQL schema tree visualizer!
- 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.
-
Navigate to the Schema, Code, and Visualize tabs to toggle views:
- Schema - view, edit, or delete tables you've added
- Code - view generated GraphQL and SQL code before export
- Visualize - view the GraphQL schema intuitively as a simple tree
- Export the code by clicking the Export icon.
- Enter your Postgres database URI and then select the directory you want to save your executable GraphQL server.
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.
-
Extract apollo-server.zip file
-
Open the project
-
Install dependencies
npm install
- Run the server and visit localhost:3000
npm start
- Use Apollo Server Playground to mock client GraphQL queries and responses to your server. Learn more about constructing GraphQL Queries here
- Alena Budzko @AlenaBudzko
- Bryan Fong @bryanfong-dev
- Rodolfo Guzman @Rodolfoguzman25
- Jarred Jack Harewood @jackhajb
- Geoffrey Lin @geofflin