Using Lambda/API Gateway in ReactJS

Question

I have a frontend that I designed in ReactJS on AWS Amplify with my Senior Project team and am looking to bring in data from API Gateway. I have a link I deployed that I tested in Lambda on the AWS console which works correctly. I am looking for some guidance on pulling in the data from that url to the frontend to use for a list. I can supply more information if you would like, please let me know what you need and any tips would be great! Thank you.

user_4812170 · Answer

Assumption :

As mentioned in your question i assume that you already aware how to create API Gateway,deploy API and now you have API gateway url to access rest API.

Fetch data into react :

Example you have following cruds API

     GET /students         List all students
     GET /students/1       Load a studentsby id
     POST /students        Create a students
     PUT /students         Update a students
     DELETE /students/1    Delete a students by id

Fetching data:

           import { API } from 'aws-amplify';
             API.get('students', '/students', {}).then(result => {
             this.todos = JSON.parse(result.body);
              }).catch(err => {
                 console.log(err);
              })

Security :

You need to secure rest API either use API key or Authorizer

Using Lambda/API Gateway in ReactJS

1 Answers