WEB DEV PROJECT

Graceland -An eCommerce Store (In Progress)

graceland-laptop
graceland-mobile

My Role

Full-Stack Developer

Start Date

01/05/2024

End Date

31/08/2024

Technologies Used

Tech Stack

NextJS
TailwindCSS
Prisma
zustand
Supabase

Graceland is an eCommerce platform for baby products developed using the latest web technologies. The app features a dynamic homepage that showcases featured baby products, along with convenient category browsing options and a comprehensive list of available items.

I also developed the product listing page, which offers a search bar and various filtering options for users to find the perfect baby products. Additionally, it has a product details page that provides users with detailed information and suggestions for other recommended items.

Users can easily track their orders and favorite products through their profile page. Overall, I've created an intuitive and user-friendly MVP version of the platform, making shopping for Graceland baby products a seamless experience.

Problem

Problem Statement

One of the main problems that parents face when shopping for baby products is the hassle of finding a reliable and user-friendly platform to browse and purchase essential items. Navigating through the congested Lagos traffic to visit physical stores adds to the challenge, making it difficult for parents to access a wide variety of baby products conveniently and efficiently.

Way of Work

My Process

definition

definition

design

design

plan

plan

development

development

deployment

deployment

Problem

Challenges & Learnings

CHALLENGES

bullet-list

Implementing a robust authentication and authorization system using NextAuth.js and integrating various providers such as Google and custom credentials.

bullet-list

Managing product images, including uploading, storing, and retrieving them efficiently, especially in different environments (local, serverless, cloud storage).

bullet-list

Designing and maintaining a relational database schema using Prisma, handling complex relationships such as user orders, order items, and addresses.

bullet-list

Managing application state efficiently using Zustand to handle various states such as user data, product information, and cart details

LEARNINGS

bullet-list

Continuous improvement of the user interface based on feedback and testing ensures the application remains intuitive and user-friendly, which is critical for retaining users and driving sales.

bullet-list

Implementing secure and user-friendly authentication systems with NextAuth.js helps in managing user sessions effectively and provides flexibility in supporting multiple authentication providers.

bullet-list

Zustand provides a lightweight and flexible state management solution, but it requires a clear understanding of state management principles and best practices to avoid common pitfalls such as over-complication and unnecessary re-renders.

bullet-list

Effective use of an ORM like Prisma can simplify database interactions, but it requires a solid understanding of relational data modeling and ensuring data integrity through proper relations and constraints. A well-designed relational schema with an ORM like Prisma simplifies data management, making it easier to handle complex queries and maintain data integrity.