WebX

Live Demo: https://web-x-faci.vercel.app/

WebX is an advanced web application platform that enables users to generate, manage, and publish business websites. The project features a modern React frontend and a robust Express/MongoDB backend, offering tools for business profile management, content generation, and seamless publishing.

Features

• User Authentication: Secure login and registration using JWT.
• Business Management: Manage business profiles, portfolios, and configurations.
• Website Generation: Automated website content generation and management.
• File & Document Uploads: Supports various file and PDF uploads for content parsing.
• Publishing System: Publish generated sites seamlessly to be hosted or downloaded.
• Dashboard: Comprehensive analytics and management dashboard for users.

Tech Stack

Frontend (Client)

• Framework: React 19
• Build Tool: Vite
• Routing: React Router DOM
• HTTP Client: Axios

Backend (Server)

• Runtime: Node.js
• Framework: Express.js
• Database: MongoDB (Mongoose for Object Data Modeling)
• Authentication: bcryptjs, jsonwebtoken (JWT)
• File Uploads: Multer
• Document Parsing: pdf-parse
• Email Delivery: Nodemailer

Getting Started

Prerequisites

• Node.js (v18+ recommended)
• MongoDB Atlas account or local MongoDB instance

Installation

1. Clone the repository:

   git clone <repository-url>
   cd WebX

2. Install dependencies for both client and server:

   # Install backend dependencies
   cd server
   npm install
   
   # Install frontend dependencies
   cd ../client
   npm install

3. Environment Variables setup: Create a .env file in the server directory and configure the necessary variables:

   PORT=5000
   MONGO_URI=your_mongodb_connection_string
   FRONTEND_URL=http://localhost:5173
   # Add your JWT_SECRET and email credentials if required

4. Run the application locally:

   # Start the backend server (runs on port 5000 by default)
   cd server
   npm run dev
   
   # Open a new terminal and start the frontend development server
   cd client
   npm run dev

Project Structure

• /client: Contains the React application (UI/UX).
• /server: Contains the Node.js API, routes, middleware, and models.