A Software Engineer’s 2-Day Learning Project.Next.js, Zustand, and WebSockets: My Open-Source Instagram Clone Built in 48 Hours

Hi Dev community , As a software engineer, I love pushing my skills with challenging projects. Two months ago, I set out to build a fully functional Instagram clone from scratch in just two days. The result? A web app with core social media features, real-time functionality, and even online games for users to play—all open-sourced on GitHub! Here’s a quick rundown of the project and what I learned along the way. The Tech Stack Frontend: Next.js (for SSR and a smooth dev experience) +Zustand (for state management). Backend: Node.js with Express (handling APIs and WebSocket integration). Database: MongoDB (flexible schemas for user data, posts, and game states). Real-Time Features: WebSockets (powering live notifications and multiplayer games). Key Features User authentication, profiles, and saving posts, liking. Post creation with choosing colors, changing profile images from provided avatars with AI. Playing games online including deer hunter, racing games, platformer games etc. all made in Javascript. Real time chat features What I Learned WebSockets are a game-changer for real-time apps, but debugging race conditions is no joke. Next.js + Zustand is a powerful combo for fast prototyping without sacrificing structure. Two days forces you to focus on MVP features—great practice for production mindsets. Check It Out! The project’s live on GitHub: instagram-clone. I’d love feedback, suggestions, or even contributors! If you find it useful or inspiring, a star

Mar 30, 2025 - 13:16

A Software Engineer’s 2-Day Learning Project.Next.js, Zustand, and WebSockets: My Open-Source Instagram Clone Built in 48 Hours

Hi Dev community ,
As a software engineer, I love pushing my skills with challenging projects. Two months ago, I set out to build a fully functional Instagram clone from scratch in just two days. The result? A web app with core social media features, real-time functionality, and even online games for users to play—all open-sourced on GitHub! Here’s a quick rundown of the project and what I learned along the way.

The Tech Stack

Frontend: Next.js (for SSR and a smooth dev experience) +Zustand (for state management).
Backend: Node.js with Express (handling APIs and WebSocket integration).
Database: MongoDB (flexible schemas for user data, posts, and game states).
Real-Time Features: WebSockets (powering live notifications and multiplayer games).
**
Key Features**
User authentication, profiles, and saving posts, liking.
Post creation with choosing colors, changing profile images from provided avatars with AI.
Playing games online including deer hunter, racing games, platformer games etc. all made in Javascript.
Real time chat features

What I Learned

WebSockets are a game-changer for real-time apps, but debugging race conditions is no joke.
Next.js + Zustand is a powerful combo for fast prototyping without sacrificing structure.
Two days forces you to focus on MVP features—great practice for production mindsets.

Check It Out!
The project’s live on GitHub: instagram-clone. I’d love feedback, suggestions, or even contributors! If you find it useful or inspiring, a star