Aws Mobile Appsync Events Starter React

screenshot of Aws Mobile Appsync Events Starter React
react

Aws Mobile Appsync Events Starter React

GraphQL starter application with Realtime and Offline functionality using AWS AppSync

Overview

This is a Starter React application for using the Sample app in the AWS AppSync console to build a GraphQL API. The Sample app creates a GraphQL schema and provisions Amazon DynamoDB resources, demonstrating GraphQL Mutations, Queries, and Subscriptions using AWS AppSync.

Features

  • GraphQL Mutations: Create new events, create comments on existing events.
  • GraphQL Queries: Get all events, get an event by ID.
  • GraphQL Subscriptions: Real-time updates for comments on an event.
  • Authorization: The app uses API Key as the authorization mechanism.

Installation

To install and set up the app, follow these steps:

  1. Clone this repository.
  2. Wait until the progress bar at the top has completed deploying your resources.
  3. From the integration page of your GraphQL API, select JavaScript at the bottom to download the aws-exports.js configuration file.
  4. Replace the aws-exports.js file in the root of your app with the file you just downloaded.
  5. Install the app's dependencies.
  6. Start the application.

Summary

This Starter React application allows users to build a GraphQL API using the Sample app in the AWS AppSync console. It provides features for creating new events, adding comments to existing events, querying events, and subscribing to real-time updates for comments. The app uses API Key as the authorization mechanism.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

graphql
Graphql

A website that uses GraphQL as a query language to manage data fetching and state management. This includes features such as a strongly typed schema, client-side caching, and declarative data fetching to streamline data management and optimize website performance.