Basic Web Gallery

A single-page web application where users can share pictures and comments with enhanced authentication and personalized galleries.

About

The Basic Web Gallery is my very first web application project. It allows users to create and manage personal galleries with features such as authentication, image uploads, and a comment system. Users can upload images to their own galleries, explore galleries created by others, and leave comments on images. The application is designed to be user-friendly and straightforward.

Features

  • Authenticated user sessions with secure login/logout
  • Personalized galleries for each user
  • Image upload, navigation, and deletion functionality
  • Commenting system

Technologies Used

  • Frontend: HTML, CSS, JavaScript
  • Backend: Node.js, Express.js
  • Database: NeDB (NoSQL)
  • Deployment: GitHub Pages
  • Testing: Mocha and Chai
Web Gallery Image 1

Users can create an account to get started or log in with their email to access their personalized gallery.

Web Gallery Image 2

Users can upload and organize images in their personalized galleries, making it easy to manage and showcase their content.

Web Gallery Image 3

Users can browse through their own galleries, or discover and browse through other users' galleries.

Web Gallery Image 4

Only registered users who are signed in can engage with galleries, by leaving comments on images shared by others.

Reflection

Developing the Web Gallery was my first experience implementing user authentication and access control. I designed a secure login system where only authenticated users could access galleries, ensuring data privacy. Additionally, I implemented role-based permissions, allowing users to manage their own content, by restricting comment deletion to either the gallery owner or the comment author. This deepened my understanding of secure session management, password encryption, and user authentication best practices.

Beyond authentication, this project introduced me to RESTful API design and frontend-backend integration. I built some basic API endpoints to handle image uploads, user sessions, and gallery navigation, enabling communication between the Node.js backend and JavaScript frontend.

I also learned the importance of testing API endpoints to prevent security vulnerabilities and ensure reliability. I wrote and executed unit tests using Mocha and Chai, strengthening the application’s robustness and reinforcing my ability to debug complex web interactions efficiently.