Frontend Challenge - Mohamed Benabdellah

[Pooreffects]

FE Challenge Completed ✅

The Implementation :

A Transactions SPA with CRUD functionalities crafted in Vue.js + Vue-router + Vite + Pinia + TailwindCSS
Utilizing the latest features such as the Composition API, Data Persistence, and built-in methods to the setup.

Approach :

)

Functionalities achieved:

• ✅ Animated Header component with the ability to invoke methods that handle data fetching and HTTP POST request
• ✅ Transactions List component with ref data binding, received data, and nodes manipulation
• ✅ Perform iteration over data and apply actions upon the data returned
• ✅ Implement add new transaction and check it against duplicates, and light input validation
• ✅ Implement the delete transaction based on the index, leave with a transition
• ✅ Implement hover effects and scoped styling for transitions and different state appearances
• ✅Implement toasts based on server response status, form validation, and built-in V-conditionals
• ✅ Access the Pinia store and apply direct and async mutations and actions
• ✅ Use Vue-router for 404 redirects, and futuristic scalability
• ✅ Maintain a clean and documented codebase, component tree, and a unidirectional source of truth

I am looking forward to chit-chatting and discussing my tech decision-making and problem-solving patterns, enjoy my code review 🤭