Shoso Marketplace Dashboard — Responsive UI Slicing

A responsive marketplace dashboard template built from scratch using HTML, CSS (Bootstrap 5.2), and JavaScript, featuring both dark and light mode interfaces.

About the project

This project demonstrates the ability to translate modern UI/UX design into functional front-end code while maintaining consistent spacing, typography, and color usage across different display modes.

Role:

Frontend Developer (UI Slicer)

Category:

Frontend Template

Tech Stack:

HTML5, CSS3 (Bootstrap 5.2), JavaScript

Project Details

Shoso Marketplace Dashboard is a front-end web template project developed as part of a BuildWith Angga HTML template course. The goal was to slice a Figma design into a fully functional and responsive HTML template using Bootstrap 5.2 and JavaScript.

The dashboard includes user interface elements such as navigation bars, statistic cards, charts, and tables, all optimized for both light and dark mode. This project highlights precision in UI slicing, responsive layout design, and component reusability for scalable web templates.

Things I Did

Translated Figma dashboard design into a fully functional HTML template.
Implemented responsive layout using Bootstrap’s grid system and utility classes.
Developed dark and light mode themes using CSS variables and JavaScript toggles.
Built reusable components for sidebar, navbar, and dashboard cards.
Ensured cross-browser compatibility and optimized front-end performance.