YourSpace

YourSpace is an innovative and interactive social media platform built to foster meaningful connections in a community-driven environment. Designed with a polished UI and seamless user experience, YourSpace enables users to create personalized profiles, share posts, and interact with others through likes, comments, and real-time engagement. It is a full-stack application deployed on Render and designed using the latest technologies, following the MVC paradigm for scalability and maintainability.

Table of Contents

• Overview
• Features
• Technologies Used
• Project Requirements Fulfilled
• Future Enhancements
• Screenshots
• Usage
• Credits
• License

Overview

YourSpace provides a secure and interactive platform for users to connect and engage with others through posts, likes, and comments. Built with scalability and responsiveness in mind, YourSpace offers a polished user experience on devices of all screen sizes.

Features

• User Authentication: Secure login and signup functionality using express-session and bcrypt for password encryption.
• Profile Management: Users can create, update, and personalize their profiles, including uploading profile pictures with Multer.
• Posting: Users can create, view, and delete posts in real-time, with seamless integration of media uploads.
• Likes: Foster positive engagement by liking posts.
• User Search: Search and connect with other users via a responsive search feature.
• Comments: A working threaded comment system for user discussions.
• Responsive Design: A user-friendly interface adaptable to various screen sizes.
• Protected API: Secure API keys and sensitive data managed via environment variables.

Technologies Used

Frontend

• Handlebars.js: For templating and dynamic rendering.
• JavaScript: Handles UI interactivity and client-side logic.
• CSS: Ensures a responsive and polished design.

Backend

• Node.js: Handles server-side logic and API requests.
• Express.js: Framework for routing and middleware.
• PostgreSQL: Relational database for structured data storage.
• Sequelize: ORM for database interactions.
• Multer: Middleware for secure media file uploads.

Authentication

• express-session: Session management.
• bcrypt: Password hashing and security.

Deployment

• Render: Hosting for the live application and database.

Project Requirements Fulfilled

• Node.js and Express.js: RESTful API with GET and POST routes.
• Handlebars.js: Dynamic and responsive templating engine.
• PostgreSQL and Sequelize: Relational database with ORM for efficient data management.
• Authentication: Secure login system using express-session and cookies.
• New Technology: Integration of Multer for secure media file uploads.
• MVC Structure: Organized folder structure ensuring scalability.
• Responsive and Polished UI: Clean, user-friendly, and device-adaptive interface.
• Deployment: Fully functional and error-free deployment on Render.

Future Enhancements

• Real-Time Messaging: Enable live chat functionality for direct user interaction.
• Notifications: Activity alerts for likes, comments, and new connections.
• Dark Mode: Improve usability with a dark theme toggle.
• Marketplace: Build a platform for buying, selling, or trading within the community.
• Advanced Commenting: Enhance the comment system with editing, deleting, and nested replies.
• Geolocation Matching: Match users based on their location.

Screenshots

Usage

• GitHub Repository: View
• Live Website: View

Credits

The project is a collaborative effort by:

Additional Resources and References

License