Skip to content

Quota Table Part I #34

@Satchel05

Description

@Satchel05

AT A GLANCE

LoFi is here! 🎉

Your task is to create the table found in LoFi along with the necessary data fetching functionality.

CONTEXT

You will use the routes we have built as a data pipeline, allowing the frontend to receive and display dynamically generated information.

TECHNICAL DETAILS

  • Switch to main branch and pull the most up to date code.
  • Our branch names were a little haphazardly named last time (our fault). In order to have more consistent and professional branch names, please click "Create a branch for this issue..." under "development" in the right sidebar on this page. It should automatically populate your branch name with a name of this format: 23-create-crud-routes-tags-route. Importantly, also git checkout this new branch locally in VSCode. You will need to git pull again to get local in sync with the new branch you just created remotely on GitHub.
  • Create quotaTable.jsx in src/components/
  • Using Chakra's Table component, mirror LoFi, ignoring the styling of the column attributes. Keep everything as plain text for now. Your peers are working on some of those styled components that will be plugged in later in Quota Table Part II. For the "Progress" column, just keep the fraction part, and ignore the progress bar and arrow buttons. Please also include the "edit" icon on the far right of the row, but do not worry about making it functional right now. That will be reserved for Part II as well.
  • Feel free to use Playground.jsx as a sandbox to test your components.

LEARNING GOALS

What's Important To Understand:

  • Data fetching patterns in React using useEffect
  • How to use backend provider to access our backend.
  • How to use our routes in the frontend

RESOURCES

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions