Olamide - Frontend Developer

Demo of Shop Sphere — a modern e-commerce application that brings together seller dashboards, product management, and shopper order tracking in one seamless experience.

Showcase

Shop Sphere

Shop Sphere is a modern e-commerce platform built with the goal of serving both sellers and shoppers. It provides a complete environment where sellers can manage products, track sales, and engage with customers, while shoppers enjoy a smooth browsing, checkout, and order-tracking experience.

Rather than just being a demo, the project was designed to be close to production-ready, with real authentication, payment integration, and scalable backend logic.

About This Project

I created Shop Sphere as a way to dive deeper into what it takes to build an end-to-end web application. The idea was to go beyond static prototypes and craft something that feels practical and usable. Sellers get the tools they need to run their online stores effectively, while shoppers can interact with a storefront that feels clean, responsive, and trustworthy.

This project also gave me space to experiment with newer technologies like TanStack Start and Drizzle ORM while keeping a focus on real-world workflows: product management, order handling, secure payments, and role-based access.

Project Goals

Design an interface that feels intuitive on both desktop and mobile for sellers and shoppers.
Implement role-based authentication and secure session management using Better Auth.
Add Paystack integration for real payments and checkout flows.
Build a relational database schema that can grow as the app scales.
Explore modern full-stack tools like TanStack Start and Drizzle ORM to simplify development while keeping flexibility.
Structure backend logic around server functions for performance and easier deployment.

Features

Seller Features

Dashboard Metrics: View sales performance at a glance, with quick access to recent activity and store insights.

Dashboard Metrics Example
Product Management: Add, update, and organize products, complete with categories and descriptions for easier browsing.

Managing products in the dashboard
Order Management: Track incoming orders, update their status, and keep customers informed with shipping and delivery progress.

Order details and actions
Discounts: Run promotional campaigns by creating and managing discounts directly from the seller dashboard.

Managing discounts in the dashboard
Categories: Keep products organized by assigning them to categories, making it easier for shoppers to find what they need.

Managing categories in the dashboard

Shopper Features

Checkout & Payments: A streamlined checkout experience powered by Paystack, ensuring safe and secure payments.

Seamless checkout and payment
Order Tracking: Shoppers can keep up with delivery progress and revisit their order history from a single place.

Order history & tracking

Tech Stack