search

ActoKids / AD440_W19_CloudPracticum

3 stars 1 forks source link

UI Forms: dashboard>GET/events #47

Closed coultergeist closed 5 years ago

coultergeist commented 5 years ago

Connect forms to corresponding API endpoints: dashboard>GET/events.

Once assigned, annotate your estimated time. Then, keep regular updates on your issue. Comment your approach, tutorials, articles, updates, links, photos, etc. Comment often. When closing your issue include the following in your final comment.

Time estimated: 8 hours Time spent: 7 so far Pull Request link: Wiki link: Deployed Code link:

erikNeville commented 5 years ago

As I refine the dashboard page I will begin to call the API in order to populate the page with event information. Estimated time: 8 hours

erikNeville commented 5 years ago

So far I have made a dashboard with a backend through firebase. My challenge so far is working with our AWS Lambda function so that is what I will be working on the coming week. Here is a link to the app: https://event-list-e6d08.firebaseapp.com/

To see it in action, sign in as test@test.com, password: test1234

The wiki: https://github.com/ActoKids/web-ui/wiki/Dashboard

Estimated time: 8hrs Time so far: 7hrs

erikNeville commented 5 years ago

The dashboard is currently pulling information from a firebase database, until the GET method of our API is created. I also have information called from a local API.

screen shot 2019-02-20 at 5 24 44 pm

The information is shown on the dashboard as in this example:

screen shot 2019-02-20 at 5 25 55 pm

I am still working on formatting the page to match the wireframe, but that task is lower on my priority list. Higher on my priority list is adding buttons to delete or edit an event on the dashboard.

The app still functions here: https://event-list-e6d08.firebaseapp.com/ So far I have put 14 hours into this task. Wiki link: https://github.com/ActoKids/web-ui/wiki/Dashboard

coultergeist commented 5 years ago

Erik, Everything is looking really good. Downloaded and tested the brand new repo, the work you all did to get all the repos closed and create one template looks great. So my feedback is more directed to the Firebase portion? Will this be replaced with the API endpoint when we get it?

erikNeville commented 5 years ago

I have connected links from the dashboard to an API using mockaroo, a fake API builder used for testing. Right now when a link from the dashboard is clicked, data is loaded into the details page of the app. This works by fetching the API from the URL, then getting an API response, receiving JSON data, then using the setState() method to update the state of the object that will be displayed. I'm storing the props id in a variable called id, and the specific event id in a variable called eventID. I then compare the two in order to tell the app which event to display.

A challenge I'm having is that I believe the API is being called for each event that exists, every time a link is clicked, and that cannot be good. So that is something I intend to fix before using the actual API.

Here are some screen shots: displayevent displayevent-page

Estimated time: 8hrs Total time: 14hrs

Link to my fake API: https://my.api.mockaroo.com/events.json?key=ab42ca00 Link to my pull request: https://github.com/ActoKids/web-ui/pull/25 Link to wiki: https://github.com/ActoKids/web-ui/wiki/Dashboard Link to functioning app: http://enevilledash.s3-website.us-east-2.amazonaws.com