Giter Club home page Giter Club logo

oslabs-beta / qlens Goto Github PK

View Code? Open in Web Editor NEW
118.0 6.0 15.0 2.58 MB

QLens is an electron app which dynamically generates GraphQL Schemas and Mongo Schema visualization. QLens significantly cuts development time by automating the formation of their GraphQL schemas based on information fetched from their non-relational database.

Home Page: http://qlensapp.com

JavaScript 79.53% CSS 20.47%
react graphql-tools graphql graphql-server graphql-client nosql-database nosql codemirror electron-app electron electron-builder jest-tests enzyme-testing enzyme-adapter-react-16

qlens's Introduction

License: MIT Build Status GitHub package.json version contributions welcome Tweet

QLens

Using GraphQL with MongoDB can cause data mismatch and schema duplication requiring developers to write similar code multiple times. This can significantly slow down development time. In addition, there aren't many libraries that tackle MongoDB conversion to GraphQL schemas. Most libraries tackling this issue are focused on relational databases. QLens solves that problem.

QLens — Open source tool to extract metadata from your MongoDB database to generate GraphQL schemas, resolvers and server setup.

Accelerated by OS Labs

Getting Started

  1. Globally install extract mongo schema on your machine: npm -g install extract-mongo-schema
  2. Download QLens onto your desktop by going to www.qlensapp.com

Features

  • GraphQL schema (including resolvers, and mutations)
  • Visual interactive diagram of Hierarchy Display
  • Download Schemas
  • GraphQL's Playground GUI

How does QLens work?

QLens.gif

1. Enter URI

Simply enter your non-relational database (MongoDB) URI in the input form at the top of the screen and press enter. You will see a dropdown menu on the left hand side of the screen revealing all of your database schemas. Click the schemas you would like converted to GraphQL and then click the ‘Add Selected Schemas’ button.

QLens.gif

Please see below gif to reset the URI:

QLens.gif

2. Select GraphQL Schemas

On the right side of the screen is where your life just got a whole lot easier. You will find your GraphQL schema boilerplate already entirely formatted for your project complete with resolvers and mutations. At the top of the text editor, you will see a tab to toggle to see your MongoDB schemas in their own editor. Here is where you can either copy your GraphQL schemas and paste right into your code editor, or click the download button.

3. Download Schemas

Click the Download Schemas button at the bottom of the code editor and the GraphQL schema code will download into a folder on your desktop. Drag the folder into your preferred code editor and voilà! Formatted GraphQL schemas right there in your code editor! It’s that easy!

4. Playground:

Back in QLens, you can see your GraphQL schemas in action by clicking on the Playground button at the top right-hand side of the screen which will take you to GraphQL’s very own integrated development environment, GraphiQL where you can make queries and test your code.

QLens.gif

How To Contribute

We would love for you to test our application and submit any issues you encouter. Please feel free to fork your own repository to and submit your own pull requests.

Built With

  • Electron
  • React
  • Codemirror
  • Jest
  • Node.js
  • Express
  • Graphiql
  • Graphql
  • Lodash
  • Babel
  • Webpack
  • Enzyme
  • React-Testing-Library
  • Spectron

How you can contribute:

  • Bug fixes
  • Implementing features
  • Submitting or resolving GitHub issues
  • Help market our application

Developers

License

This project is licensed under the MIT License

Upcoming Features

Currently QLens does not support playground functionality and has limited functionality for creating resolvers. Currently we are working on implementing the following features:

  • Playground functionality for testing queries and mutations
  • Generating mutations for updating
  • Generating resolvers for Mongo documents with "ref" or foreign keys
  • Allowing for conversion of SQL databases

qlens's People

Contributors

choyeewinag avatar jdiorio2393 avatar judanator avatar stevenlabrie avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

qlens's Issues

On enter Mongo URI receive Error

After enter Mongo URI i receive Error in console:

Uncaught SyntaxError: Unexpected token / in JSON at position 0
    at JSON.parse (<anonymous>)
    at EventEmitter.<anonymous> (main.js:2)
    at EventEmitter.emit (events.js:315)
    at Object.onMessage (electron/js2c/renderer_init.js:91)
(anonymous) @ main.js:2
emit @ events.js:315
onMessage @ electron/js2c/renderer_init.js:91

My System: MacOS + MongoDB shell version v4.2.5 + QLens 1.1.0

Are there any extra instructions for running it on Linux?

To run it on Ubuntu am I supposed to just download source, npm i deps and npm start it?

Doing that it just hangs after entering the (local) MonggoDB URI. No errors on the console or anything.

My point is, any extra recommendations on how to make it work on Linux? I'm not sure what to do next.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.