In this exercise, craft and implement a page from one of the Saleswhale apps. Link to a mockup on figma. You will need to sign up for a figma account to make full use of the available functionality.
The task is to implement a react app that looks as close as possible to the mockup. In addition to the layout, the following functionality is also expected:
- When the user clicks the All tab, they should see All Teams
- When the user clicks the Favorites tab, they should only see their Favorited Teams
- When the user clicks on the Archived tab, they should only see Archived teams.
Interface with a mock API response is expected and can be found at src\mock-data.json. Loading the data directly from the file is not required.
- node.js v14.x
- npm v6.14.x
# Clone Repository
git clone https://github.com/DavidLHW/saleswhale-teams-clone.git# Change directory
cd saleswhale-teams-clone# Install dependencies with clean install
npm ci# Make build
npm run build# Serve build with a static server
npx serve -s buildLocated in
/src/locale/index.ts
The locale file specifies the string used throughout the web app. Its purpose is to allow easy reconfiguration of the string texts in the app.
Located in
/src/config/teams.ts
Specifies the total number of team categories and their string representation (order-sensitive).
Specifies the string rendering behavior in respect to the type of actions in the activity component.