Skip to content

fundingpips/frontend-challenge

 
 

Repository files navigation

FundingPips Frontend Challenge

Here is a challenge we would like you to complete to help assess and show off your frontend skills. This is an example of a real world problem you would need to solve while working at FundingPips. We do not expect you to spend more than a couple of hours on this project.

Getting Started

  • You will need NodeJS 18.x+, NodeJS 20.x+.
  • Please do all of your work in a separate repo.
  • Use npm i to install the correct packages.
  • Use npm run start to start the development server.
  • You can view the application at http://localhost:3000.

Application Design

AccountsTable

Instructions

  • Please recreate the table (illustrated above) utilizing React and Typescript.
  • You can view the public design file in Figma.
  • All required fonts can be included directly from Google Fonts.
  • We want to see how you manage state without using external libraries.
  • For styling, you can use any libraries you want; we encourage you to use the libraries you’re most familiar with, as long as you’re writing your own styles (i.e., not utilizing frameworks like Bootstrap, SemanticUI, Blueprint, etc.).
  • We are looking at this deliverable as if it was a "miniature product", so therefore, please organize your code as you would expect to do so in a larger application, utilizing best practices for file organization, architecture, documentation, etc.
  • The included data file includes 500 records to populate.
  • Writing tests is not a requirement, but is highly encouraged. You can use any testing framework you are comfortable with.
  • Please ignore checkbox in the table design, both in header and in rows.

Acceptance Criteria

In order to complete the challenge, all acceptance criteria must be met:

  • The table should be sortable by each column.
  • The table should be able to be paged through using the Previous and Next buttons.
  • The search field should filter visible entries based on user or id.
  • Please note that we check for AI code generation and anything above 70% match will be considered AI generated.

Bonus

  • Add account button adds new account to the table. (prompts for name and randomizes the rest)

Submission

When you are ready to submit your solution, please follow these instructions:

  • Commit all of your work to your own github repo, including all of your source code, configuration files, etc.
  • Send us the link to you public github repo with any comments you have.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published