A high-performance, modern, and multilingual portfolio website built with Next.js, TypeScript, and Framer Motion. This project showcases advanced web development skills, featuring a responsive design, real-time animations, and a production-ready contact system.
- 🌐 Multilingual Support (i18n): Fully translated into English, Arabic (RTL), and German using
i18next. - 📧 Production Contact Form: Integrated with Resend API for reliable email delivery with server-side validation.
- ✨ Premium UI/UX:
- Dynamic backgrounds and floating particles.
- Smooth page transitions and scroll-driven animations using Framer Motion.
- Glassmorphism effects and modern typography.
- 📱 Fully Responsive: Optimized for all devices from 320px mobile to ultra-wide desktops.
- 🛠️ Tech Stack:
- Framework: Next.js 15+ (App Router)
- Language: TypeScript (Strict Mode)
- Styling: Tailwind CSS & Lucide Icons
- Animation: Framer Motion & Aceternity UI components
- Forms: React Hook Form & Zod Validation
- Email: Resend
-
Clone the repository:
git clone https://github.com/MohammedNaderAlGhussin/mohammednaderalghussin.me.git cd portfolio -
Install dependencies:
npm install
-
Environment Variables: Create a
.env.localfile in the root directory and add your Resend API Key:RESEND_API_KEY=your_resend_api_key_here
(See
.env.examplefor reference) -
Run the development server:
npm run dev
-
Build for production:
npm run build
├── actions/ # Server actions (Email handling)
├── app/ # Next.js App Router (Localized /[locale] routes)
├── components/ # Reusable React components & UI kits
├── locales/ # Translation JSON files (EN, AR, DE)
├── public/ # Static assets (CV, Images)
└── lib/ # Utility functions & shared config
MohammedNader AlGhussin
Full-Stack Developer
📍 Cairo, Egypt (Remote Friendly)
📧 mohammendnaderalghussin@gmail.com
🔗 LinkedIn | GitHub
Designed and engineered with passion.