hxdy-1 / eventscape

EventScape

EventScape is a full-stack web application built with the MERN (MongoDB, Express.js, React, Node.js) stack. It serves as an admin-only platform for managing events. Registered users can perform operations such as viewing, updating, deleting, and posting new events. Non-registered users have the ability to browse and view all events along with their details.

Table of Contents

• Features
• Technologies Used
• Installation
• Usage
• Contributing
• Preview

Features

1. User Authentication: Secure user authentication using JWT (JSON Web Tokens) and bcrypt for password hashing.

2. Event Operations:

   • View: Registered users can view a list of events.
   • Update: Users with admin privileges can update event details.
   • Delete: Admins can delete events.
   • Post: Admins can post new events.

3. Non-Registered User Access: Non-registered users can browse and view all events and their details.

Technologies Used

Backend

• Node.js
• Express.js
• MongoDB (Database)
• Mongoose (Object Modeling for MongoDB)
• JWT (JSON Web Tokens for authentication)
• Bcrypt.js (Password hashing)

Frontend

• React.js
• React Router DOM (Declarative routing for React.js)

Installation

1. Clone the repository:

   git clone https://github.com/your-username/EventScape.git

2. Navigate to the project directory:

   cd EventScape

3. Install dependencies:

   # Install global dependencies
   npm install
   
   # Navigate to the backend directory and install server-side dependencies
   cd backend
   npm install
   
   # Navigate to the frontend directory and install client-side dependencies
   cd frontend
   npm install

Usage

1. Set up MongoDB: Make sure to have MongoDB installed and running.

2. Configure Environment Variables: Create a .env file in the root directory and set the necessary environment variables, including MongoDB connection URI, JWT secret, etc.

   MONGODB_URI=your-mongodb-connection-uri
   JWT_SECRET=your-jwt-secret

3. Start the application:

   # Start the server
   cd backend
   npm start
   
   # Navigate to the client directory and start the React app
   cd client
   npm start

4. Open your browser and go to http://localhost:3000 to access the application.

Contributing

Contributions are welcome! (want to add user and admin logins separately, as per now whoever login, is an admin)

Preview

Home page:

All events page:

Add new event:

Event details page:

Newsletter page:

Login & Register page:

Users collection in MongoDB:

Events collection in MongoDB: