Front end and GraphiQL IDE for serverless graphql jukebox app.

The code for the creation of a lambda function and api gateway endpoint can be found here https://github.com/nikhilaravi/serverless-graphql Follow the steps to create the api and lambda first!! You'll need an api invoke url in order to deploy the UI.

Demo app: http://demo-v1.s3-website-us-east-1.amazonaws.com/app/

Demo GraphiQL: http://demo-v1.s3-website-us-east-1.amazonaws.com/graphiql/

To try out GraphiQL paste this query into the query editor

query($query: String) {
  suggestions(query: $query) {
    name,
    artist,
    url,
    imageUrl
  }
}

and paste this into the query variables editor on the bottom left of the screen.

{
  "query": "name of a song"
}

Then hit the 'play' button!

• AWS s3 - host a static website for the UI
• GraphiQL - IDE to inspect and query a GraphQl schema
• React
• Babel
• Webpack

export AWS_ACCESS_KEY_ID='yourkey'
export AWS_ACCESS_KEY_SECRET='yoursecretkey'
export AWS_REGION='region'

Set the name of the bucket in the ./scripts/s3-create-app.sh file as well as in the ./scripts/s3-update-app.sh and ./scripts/s3-update-graphiql.sh

Create the bucket by typing the command:

npm run create-s3

This the url that will be used to invoke the API gateway endpoint to trigger the GraphQL lambda function

The app and GraphiQL can be run individually using

npm run app:serve

or

npm run graphiql:serve

To deploy both the App and Graphiql use the command:

npm run deploy:ui

or to deploy each separately use:

npm run deploy:app

or

npm run deploy:graphiql

Great your app is now live!

To view the app visit the url: http://bucketname.s3-website-eu-west-1.amazonaws.com/ Swap bucketname for the name of your bucket!!!*

Add /app at the end of the url to view the app or /graphiql to view GraphiQL.