Photosnap Project

DesignDevelopmentHostingNextJSCSSMongoDBRest-API

Developed a comprehensive web platform where users can read and share their stories, complete with both images and written content. The website is fully responsive, ensuring a smooth user experience across all devices. It features seamless image uploads and content management, facilitated by an integrated admin panel with secure login.

LiveWebsite

Key

Features

Key

Features

Key Features

Enabled image uploads and content management with an integrated admin panel.
Implemented a responsive design for optimal user experience.
Developed reusable components like image-content grid and svg icon render component to enhance code maintainability and scalability.

Development

Phase

Development

Phase

Development Phase

Utilized Next.js with SSR for the frontend and integrated set-up of MongoDB within it, focusing on modular and scalable architecture.
Created Custom Icon component to render svg icons throughout website. An approach I preferred over re-styling whole svg again to suit the specific page or component needs.
MongoDB API, model and admin authentication was integrated as well using SSR approach of NextJS and Next-Auth for authentication process. It involves username and password auth for validation to admin page where I can upload new story directly instead of going through manual addition through database.

Key

Learning

Key

Learning

Key Learning

Improved skills in building and managing content-rich web applications.
Gained experience in integrating secure authentication mechanisms.
Enhanced understanding of maintaining and optimizing web application performance.

Project