Build an Instagram Clone with Laravel and MongoDB: Full Stack Tutorial

Project Setup and Environment Configuration

• 🚀 Laravel and MongoDB are combined for a flexible and scalable full-stack web development experience.
• ⚙️ Prerequisites include PHP, Composer, and MongoDB installed locally.
• 💻 The tutorial guides through setting up a Laravel project, installing the MongoDB PHP extension, and configuring the php.ini file.
• 📦 The Laravel MongoDB package is installed via Composer to enable integration.

Database and Model Configuration

• 🔌 The database.php and .env files are updated to configure the connection to a MongoDB database named instagram_clone.
• 🗄️ Laravel's cache store and session connection are also set to use MongoDB for consistency.
• 🧱 The MongoDB service provider is registered in bootstrap/providers.php to integrate MongoDB into Laravel.
• 👤 The User model is updated to extend MongoDB\(Laravel)\(Auth)\User for MongoDB authentication, defining relationships and fillable fields.
• 📝 New models for Post, Comment, and Like are created, each extending MongoDB's Eloquent model and defining their respective fields and relationships.

Authentication and Controllers

• 🔐 Laravel UI is installed and used to generate authentication scaffolding with Bootstrap styling, including login, registration, and password reset views.
• 🔒 The config/auth.php file is explicitly configured to use the App\Models\User model for authentication.
• 🏗️ Resource controllers are created for Posts, Profiles, Comments, and Likes, handling CRUD operations and user interactions.
• 🖼️ Controllers manage image uploads, storing them locally initially, with notes on future S3 integration.
• 🔗 Eloquent relationships are used to manage connections between models, abstracting MongoDB's document references.

Routing and Views

• 🗺️ The routes/web.php file is configured with routes for authentication, posts, users, comments, and likes, utilizing RESTful conventions.
• 🏠 A redirect is set up for the /home route to direct users to the main feed.
• 🎨 The main application layout (app.blade.php) is created using Blade templating, including navigation, conditional display for logged-in users, and a content placeholder.
• 📰 The post index view displays posts in a card format, including user info, images, like/comment buttons, captions, and timestamps.
• 📝 Views for creating, showing, and editing posts are developed, including forms for input and image uploads.
• 👤 The user profile page displays user information and posts, with an option to edit the profile.
• ✏️ The edit profile view allows users to update their name, username, bio, and profile image.

File Storage and Deployment

• 🔗 A public storage link is created using php artisan storage:link to make uploaded files accessible via URL.
• ☁️ The .env file is updated to configure file system disks, setting the default to public for local storage.
• 🔄 The application is tested locally, demonstrating user registration, profile editing, post creation, liking, and commenting.
• ☁️ The tutorial covers migrating the database to MongoDB Atlas for production, including creating a free cluster and updating the connection string in the .env file.
• 📊 MongoDB Atlas collections (users, posts, likes, comments) are browsed to verify data storage and dynamic collection creation based on usage.
• ☁️ Instructions for integrating AWS S3 for image storage are provided, including installing the AWS SDK and updating controllers and views.