Apartment Pulse — Next.js 14, TypeScript, React 18

Apartment Pulse

Apartment Pulse منصة تأجير متكاملة مبنية بـ Next.js، تضم بحثًا بالمرشحات وخرائط تفاعلية وتسجيل دخول بحساب Google ومراسلة مباشرة بين المستأجر والمالك.

السنة: 2024
النوع: تطبيق ويب
الحالة: متاح

دراسة الحالة الكاملة متوفرة بالإنجليزية.

A modern, full-stack apartment rental platform that revolutionizes how people find and manage rental properties. Built with Next.js 14 and TypeScript, it provides a comprehensive solution for both property seekers and landlords.

📊 Project Impact:

🏠 User Experience: Streamlined apartment search with advanced filtering and interactive maps
💬 Communication: Built-in messaging system connecting renters and landlords directly
📱 Mobile-First: Fully responsive design optimized for mobile apartment hunting
🔐 Security: Secure authentication with Google OAuth and protected routes

🛠️ Key Features:

🔐 Google OAuth authentication with NextAuth.js and user profiles
🏠 Full CRUD operations for apartment listings with advanced search filters
📸 Multiple image uploads with Cloudinary integration and photo galleries
🗺️ Interactive maps powered by Mapbox with geocoding capabilities
💬 Internal messaging system with real-time notifications
⭐ Apartment bookmarking and saved listings functionality
📱 Responsive design with loading skeletons and toast notifications
🔗 Social media sharing integration

🔧 Technical Highlights:

Built with 100% TypeScript for enterprise-level type safety
Implemented clean architecture with proper interface organization
Created custom React hooks for data management and state handling
Integrated multiple external APIs (Google, Mapbox, Cloudinary)
Developed professional form validation with Formik and Yup
Implemented MongoDB database design with Mongoose ODM
Added error boundaries and comprehensive error handling
Configured ESLint and Prettier for code quality standards

دوري

Full-Stack Developer
Architected and developed the entire platform from conception to deployment:

🏗️ Architecture: Designed scalable Next.js 14 application with App Router
🗄️ Backend: Built MongoDB database schema and API routes with TypeScript
🎨 Frontend: Developed responsive UI components with Tailwind CSS
🔐 Authentication: Implemented secure Google OAuth with NextAuth.js
🗺️ Maps Integration: Integrated Mapbox for interactive property location features
☁️ Cloud Services: Configured Cloudinary for image upload and optimization
💬 Real-time Features: Built internal messaging system with notifications
🚀 Deployment: Set up production deployment pipeline on Vercel

Next.js 14

TypeScript

React 18

MongoDB

Mongoose

NextAuth.js

Tailwind CSS

Cloudinary

Mapbox

Google APIs

Formik

Yup

React Icons

Photoswipe

React Map GL

React Toastify

Framer Motion