MFM Egypt — Marketing & Media Website

MFM Egypt is a marketing and media website built with React, Vite, TypeScript, and CSS.

The website includes multiple content sections, services pages, events, gallery, clients section, media pages, white papers, videos, and responsive frontend improvements.

Live Demo

View Website

---

Overview

MFM Egypt is a marketing and media website focused on presenting the company profile, services, events, media content, clients, latest work, white papers, and contact information.

The project includes rich media assets such as images, PDFs, event videos, project visuals, client logos, and presentation files.

My work focused on frontend modifications, UI improvements, responsive fixes, media/event presentation, and visual polishing across website sections.

---

Key Features

• Home page
• Hero section
• About page
• Services page
• Events page
• Gallery section
• Clients section
• Latest work section
• Philosophy section
• Contact page
• News page
• White paper page
• Influencers marketing page
• Media monitoring page
• PDF / white paper assets
• Event images and videos
• Responsive UI improvements
• Reusable layout components

---

Tech Stack

• React.js
• TypeScript
• Vite
• CSS
• Responsive UI
• Media assets
• Video sections
• PDF files

---

Project Structure

MFM--main
├─ public
│  ├─ 11.jpg
│  └─ video
│     ├─ back.mp4
│     ├─ project4.mp4
│     └─ project5.mp4
├─ src
│  ├─ App.tsx
│  ├─ main.tsx
│  ├─ assets
│  │  ├─ files
│  │  │  ├─ influencers.pdf
│  │  │  ├─ lolaqezma.pdf
│  │  │  └─ relation.pdf
│  │  └─ images
│  │     ├─ about
│  │     ├─ clients
│  │     ├─ events
│  │     ├─ projects
│  │     ├─ work
│  │     ├─ presentaion
│  │     └─ logos
│  ├─ components
│  │  ├─ Hero.tsx
│  │  ├─ About.tsx
│  │  ├─ Clients.tsx
│  │  ├─ Gallery.tsx
│  │  ├─ Navbar.tsx
│  │  ├─ Footer.tsx
│  │  ├─ OurLatest.tsx
│  │  ├─ Philosophy.tsx
│  │  └─ ScrollToTop.tsx
│  ├─ pages
│  │  ├─ Home.tsx
│  │  ├─ About.tsx
│  │  ├─ Services.tsx
│  │  ├─ Events.tsx
│  │  ├─ Contact.tsx
│  │  ├─ News.tsx
│  │  ├─ WhitePaper.tsx
│  │  ├─ InfluencersMarketing.tsx
│  │  └─ MediaMonitoring.tsx
│  └─ styles
│     ├─ hero.css
│     ├─ about.css
│     ├─ aboutpage.css
│     ├─ clients.css
│     ├─ contact.css
│     ├─ events.css
│     ├─ footer.css
│     ├─ gallery.css
│     ├─ InfluencersMarketing.css
│     ├─ MediaMonitoring.css
│     ├─ newspage.css
│     ├─ ourlatest.css
│     ├─ philosophy.css
│     ├─ ServicesPage.css
│     └─ whitepaper.css
├─ package.json
└─ vite.config.ts

---

Main Sections

Home Page

The homepage presents the main company identity, hero section, overview content, latest work, clients, and navigation to key sections.

Services

The services pages present the company's marketing and media services in a clear and structured layout.

Events

The events section includes event images and videos to showcase company activities and previous work.

Gallery

The gallery section displays visual content and project-related media.

White Papers

The website includes PDF assets and white paper pages for downloadable or viewable company materials.

Media Pages

The website includes dedicated pages for media monitoring and influencers marketing.

---

My Role

I worked on frontend updates and UI improvements, including responsive layout fixes, media and event presentation, page styling, visual enhancements, and improving the user experience across website sections.

---

Status

Live marketing/media website.

---

Author

Built / improved by Kareem Mohamed Hanafy.

GitHub: Karrim0