ielvisd / thuumper

Thuumper Task Manager

Thuumper

Front-End

https://thuumper.ielvis.vercel.app/

Storybook

https://thuumper-storybook.ielvis.vercel.app/

Built With

• Vue
• Nuxt
• Tailwind
• Storybook

---

Requirements

1. Node
2. npm or yarn

---

Installation

To get the project up and running, and view components in the browser, complete the following steps:

1. Download and install Node: https://nodejs.org/
2. Clone this repo git clone https://github.com/ielvisd/thuumper-practice.git
3. cd into thuumper folder
4. Install project dependancies: yarn
5. Start the development environment: yarn dev
6. Open your browser and visit http://localhost:3000

---

Accessibility

Accessibility was checked using Storybook's Accessibility Addon (https://www.npmjs.com/package/@storybook/addon-a11y) & the Axe Chrome Extension (https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US).

---

Performance

Performance was checked using Lighthouse Metrics https://lighthouse-metrics.com/one-time-tests/5fbb5fe9d4d0c7000806ca6d

---

Testing

Jest is used for unit and snapshot testing. From yarn test

---

Wishlist / Ran out of Time

A couple of items that I wanted to get to but ran out of time:

• A modal that announces that Thuumper is in closed beta when users try to sign up
• Use of Nuxt Color Mode module to trigger light/dark modes
• End to end testing for MVP flows using Cypress
• Loading states
• More validation of email & password prior to using backend services
• More components
• Reusable logic
• Further Storybook customization/add-ons
• Task Manager page/functionality

---