Multi-Services EG: Cleaning Services & Online Shop
Website for a professional cleaning company: services, online booking, a product shop with cart and checkout, and an admin dashboard.
- Status
- Live
- Type
- Client project
- Website
- multiserviceseg.com
About this project
Multi-Services EG is a professional cleaning company for homes and businesses. Its website presents six cleaning services, lets clients book an appointment online and sells cleaning and branded products through a built-in shop.
I built the front end from the first commit, in French, at HES Digital Service: the public site, the shop, the booking flow and the admin dashboard. It consumes a REST API written by a teammate.
My role: Front-end developer in the HES Digital Service team: I built the whole website and admin dashboard, on top of a teammate's API
Key features
Services and booking
Six service pages, from commercial and residential cleaning to post-construction and industrial work, and an online booking flow for signed-in clients with their appointment history.
Online shop
Product catalog with categories, price filter, search and sorting; product pages with a gallery, reviews and related products; cart, wishlist, checkout and order history.
Accounts
Sign-up and sign-in with email verification, and error messages translated into French.
Admin dashboard
Overview charts for revenue, appointments and top products, and management of orders, products and categories, services, appointments and availability, users, messages and newsletter campaigns. Access is limited to admin roles.
Technical approach
API integration
An Axios client with typed responses and error handling feeds SWR hooks for each resource, so pages stay in sync with the REST API.
Cart and checkout
Cart and wishlist live in persisted Zustand stores. Checkout creates the order through the API, then redirects to the payment page it returns, with success, cancel and error states.
Forms and content
Forms are validated with React Hook Form and Zod. Admins write rich content in a TipTap editor, and an availability calendar drives the booking slots.
SEO
Static metadata, Open Graph and Twitter images, a sitemap and robots rules, set up for Google Search Console.
What I built
- Built the whole front end in Next.js and TypeScript, from project setup to deployment: public site, shop, booking and admin dashboard.
- Integrated the REST API with an Axios client and SWR hooks, and kept the cart and wishlist in persisted Zustand stores.
- Built the admin dashboard: charts, orders, products and categories, services, appointments and availability, users, messages and newsletter.
- Set up authentication with email verification, role-based access to the dashboard, and the site's SEO.
Built with
- Framework
- Next.js
- React
- TypeScript
- UI
- Tailwind CSS
- Motion
- Embla Carousel
- Data
- Axios
- SWR
- Zustand
- REST APIs
- Forms
- React Hook Form
- Zod
- TipTap
- Auth
- Better Auth
- Dashboard
- Recharts