MicroHub

Challenges

In developing this application, I encountered a few challenges. One of the hurdles was building a feature that allows users to swap one ingredient in a meal for another ingredient they prefer. Additionally, ensuring a smooth and intuitive flow of actions for the users was another challenge to tackle.

Solutions

To overcome this challenge, I adopted a collaborative approach by closely working with the project manager, the backend team, and the design team. Additionally, I leveraged the capabilities offered by React, such as hooks and context, to effectively manage the action flow and access control within the application.

Process

To begin the project, I was provided with a Figma design. My initial step was to thoroughly review the design and engage in short sessions with the project manager to gain a comprehensive understanding of the project's objectives. Having deeper insight, I finalized the technology stack and initiated the development of the application.

I opted for TypeScript as the programming language, NextJS as the frontend framework, and Socket for building the messaging functionalities of the application. To enhance maintainability, I componentized the entire application into smaller, manageable pieces. One of my goals was to minimize reliance on third-party dependencies and maximize the use of native technologies.

During the development process, I encountered instances where design elements were missing, such as the profile page and its sub-sections. In such cases, I took the initiative to design the user interface and experience myself, ensuring alignment with the overall UI and UX of the application to maintain a seamless user journey.

Once the user interface was built, I connected the components with their respective APIs. Close collaboration with the backend team was essential to identify and solve any issues. Next, I rigorously tested the application's performance and functionality across multiple browsers. Finally, I delivered the project to the client when the application demonstrated exceptional performance and passed all testing criteria.

Feature highlights

• Scalable to host millions of clients
• Pixel-perfect user interface and experience
• Implementation of the latest security standards
• 99% performance and 100% structure optimized (GTmetrix)

Key functionalities

• User authentication
• Notification system
• Ingredient swapper
• Ability to bind client with a nutritionist
• Live messaging with the nutritionist
• Ability to create meals and programs and assign them to self