Integrating the GraphQL API with the ReactJS app
For the ReactJS project, we must open the App.tsx
file under the src
folder to look at the JavaScript code that was generated by the Amplify CLI. Then, we must change the TypeScript code, as follows:
- The following code was generated without any semi-colons. We will add them back in the TypeScript version. This code imports the essential libraries for React, Amplify, and GraphQL:
import React, { useEffect, useState } from 'react' import Amplify, { API, graphqlOperation } from 'aws-amplify' import { createTodo } from './graphql/mutations' import { listTodos } from './graphql/queries'
- The following code block imports your AWS account settings and your own credentials. These have been marked so that they not submitted to GitHub. This is because your credentials are supposed to be private to everyone. Therefore, if someone needs to pull from your repository, they need to set up their own...