Question 1. JSON Server Post
Now lets add an “interface” to add a activity to the server from a client. Note: you can just use simple JavaScript a
ay manipulation with your activities a
ay that you read in from the JSON file. You will not persist this information on the server at this time, i.e., do not write it to a file, we’ll be using a database for that later.
(a) Add Activity
Create another “interface” to your club server that receives a new activity via a JSON POST to /activities. After you add the activity to the activities a
ay on the server return the updated a
ay to the client via JSON. After testing it in part (b) show the code for this interface only here. Hint: you may need to use some “middleware” to deal with JSON.
(b) Test with Requests
Write a separate Node.js program called addActivityTest.js to test the interface in part (a) by getting and printing out the cu
ent list of activities and then adding a single activity and printing out the updated list of activities. Appropriately use promises (or async/await) to make sure these steps happen in order. Show a screen shot and your test code here. My screen shot looks like:
Question2: Activities Component
Create a Activities component in a activities.js file and have it show the club events in a nice table. You must use appropriate React idioms such as map to transform data, using key attribute to avoid warning messages etc. See course slides for more info. Pass the Activities component the event information you got from the JSON file. I added the following to my index.js for this purpose:
import React from "react";
import ReactDOM from "react-dom";
import Activities from "./activities";
Imports component
import events from "./eventData.json";
Imports event data
function Hello(props) {
A function component
return
Hello React from Your name and net ID here!
h1>;
}
Uses the function component
ReactDOM.render(Hello
div>,
document.getElementById("root")
);
Show the code for your Activities component here. Take a screen shot with the React developer tools showing the components.
My Screen shot looks like:
For question1:
Please read the assignemnt instructions. I create the clubServer, it works. But the addActivityTest.js
doesn't work, and I got stuck on it. Please fix it. Using async/await.
For Question2:
Using React(npm install --save react react-dom)
Using Parcle
I wrote the code activities.js ,but code doesn't work.
Thanks