Overview
MardoTech Solutions is a modern showcase website project developed to present a fictional business specialising in digital engineering, software development and embedded systems in Lubumbashi.
The project demonstrates the creation of a professional digital presence without presenting MardoTech as a real client.
Objectives
The website was designed to achieve several objectives:
- establish a professional visual identity;
- clearly present the service catalogue;
- display a project gallery;
- simplify contact with potential customers;
- provide smooth navigation on computers and mobile devices.
Technical architecture
MardoTech Solutions is a Single Page Application developed with React.js.
The application uses a single entry point. React Router DOM intercepts URL changes and displays the appropriate views without completely reloading the page.
The project follows a component-based architecture with reusable interface elements and separate page components.
Main sections
The website contains five principal sections:
- Home;
- About;
- Services;
- Projects;
- Contact.
The Navbar and Footer are shared across the application to maintain consistent navigation and visual identity.
Technologies used
React.js
React is the main interface library. It allows the website to be divided into modular and reusable components.
Vite.js
Vite is used to initialise the project, run the development server and generate optimised production files.
Tailwind CSS 4
Tailwind CSS provides the responsive design system, colour management and website layout.
React Router DOM
React Router DOM manages the SPA routes without requiring complete page reloads.
Lucide React
Lucide React provides the vector icons used throughout the services, navigation and contact sections.
Features
The project includes:
- smooth navigation between views;
- a responsive interface;
- a structured presentation of services;
- a project gallery;
- a contact form based on a
mailto:link; - location and contact information;
- consistent icons provided by Lucide React.
Deployment
The source code is versioned with Git and stored in a private GitHub repository.
The website was deployed to Netlify using the production files generated by Vite.
A _redirects file ensures that React Router routes continue working after a page is refreshed.
Current limitations
The project is frontend-only and does not currently include a backend or database.
The contact form opens the user’s email application instead of sending messages through a dedicated server.
Possible improvements
The project could later include:
- a Node.js and Express backend;
- a database;
- a direct message delivery system;
- a CMS such as Strapi or Contentful;
- French and English localisation.
