From a0e6751dbd751546059bdda6000e8a60efa7a35b Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 30 Oct 2025 08:45:23 +0000 Subject: [PATCH 1/4] Initial plan From 720186de11d2746fda8701c150402f038609c68b Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 30 Oct 2025 08:51:53 +0000 Subject: [PATCH 2/4] Rewrite README with professional structure and architectural diagrams Co-authored-by: mianjunaid1223 <111676821+mianjunaid1223@users.noreply.github.com> --- README.md | 1181 +++++++++++++++++++++++++++++------------------------ 1 file changed, 644 insertions(+), 537 deletions(-) diff --git a/README.md b/README.md index edb21ce..1b339f6 100644 --- a/README.md +++ b/README.md @@ -1,714 +1,821 @@ # NSCP-SPADES - Startup Networking Platform -A professional networking platform designed for startup founders, entrepreneurs, and innovators. Connect with like-minded people, showcase your startup, share projects, and build real professional relationships. +A professional networking platform designed for startup founders, entrepreneurs, and innovators. Connect with like-minded people, showcase your startup, share projects, and build professional relationships. ## Table of Contents -1. [What This Project Does](#what-this-project-does) -2. [Tech Stack](#tech-stack) -3. [How It's Built](#how-its-built) +1. [Overview](#overview) +2. [Architecture](#architecture) +3. [Tech Stack](#tech-stack) 4. [Project Structure](#project-structure) 5. [Data Models](#data-models) 6. [Core Features](#core-features) 7. [Setup Guide](#setup-guide) 8. [Environment Configuration](#environment-configuration) -9. [Running the App](#running-the-app) -10. [How Everything Works](#how-everything-works) -11. [API Endpoints](#api-endpoints) -12. [Authentication](#authentication) +9. [Running the Application](#running-the-application) +10. [API Endpoints](#api-endpoints) +11. [Authentication](#authentication) --- -## What This Project Does +## Overview -This web application lets startup founders and entrepreneurs: +### What This Application Does + +NSCP-SPADES is a comprehensive networking platform that enables startup founders and entrepreneurs to: - Build professional profiles with skills and experience - Register and showcase startups with complete details -- Share updates and posts about their journey +- Share updates and posts about their entrepreneurial journey - Create and display projects -- Connect with others by following them +- Connect with others through a following system - Message other members directly - Search for startups, projects, and people - Network and collaborate within the startup ecosystem --- -## Tech Stack - -### Frontend -- *Next.js 15.5.4*: React framework handling both frontend and backend. Think of it as the foundation. -- *React 19.2.0*: JavaScript library for building the user interface. -- *Tailwind CSS*: Utility-first styling system. -- *Shadcn UI Components*: Pre-built UI elements. -- *Framer Motion*: Smooth animations and transitions. -- *Next Themes*: Dark/light mode support. - -### Backend -- *Next.js API Routes*: Backend functionality built into Next.js. -- *MongoDB*: Database storing all application data. -- *Mongoose*: MongoDB object modeling tool. -- *NextAuth.js*: Handles authentication and sessions. - -### Security -- *NextAuth.js v5*: Modern authentication system. -- *bcryptjs*: Password encryption. -- *JWT*: Secure session tokens. - -### AI Integration -- *Google Generative AI*: Powers AI features like message reply suggestions. - -### Additional Tools -- *Zod*: Data validation. -- *React Hook Form*: Form handling. -- *date-fns*: Date formatting. -- *Lucide React*: Icon library. +## Architecture + +### System Architecture Diagram + +``` +┌─────────────────────────────────────────────────────────────────┐ +│ Client Browser │ +│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │ +│ │ Landing │ │ Auth Pages │ │ Main App │ │ +│ │ Page │ │ (Login/Reg) │ │ (Protected) │ │ +│ └──────────────┘ └──────────────┘ └──────────────┘ │ +└────────────────────────────┬────────────────────────────────────┘ + │ + │ HTTP/HTTPS + │ +┌────────────────────────────┴────────────────────────────────────┐ +│ Next.js Application Server │ +│ │ +│ ┌───────────────────────────────────────────────────────────┐ │ +│ │ Middleware Layer │ │ +│ │ (Authentication & Route Protection) │ │ +│ └───────────────────────────────────────────────────────────┘ │ +│ │ +│ ┌─────────────────┐ ┌─────────────────────────┐ │ +│ │ Server Pages │ │ API Routes │ │ +│ │ (SSR/SSG) │ │ (/api/*) │ │ +│ │ │ │ │ │ +│ │ • Home Feed │ │ • Auth APIs │ │ +│ │ • Profile │ │ • User Operations │ │ +│ │ • Startups │ │ • Post Management │ │ +│ │ • Projects │ │ • Startup Management │ │ +│ │ • Messages │ │ • Messaging │ │ +│ │ • Search │ │ • File Upload │ │ +│ └─────────────────┘ └─────────────────────────┘ │ +│ │ +│ ┌───────────────────────────────────────────────────────────┐ │ +│ │ NextAuth.js Layer │ │ +│ │ (Session Management & JWT Tokens) │ │ +│ └───────────────────────────────────────────────────────────┘ │ +└───────────────────────────────┬───────────────────────────────────┘ + │ + ┌───────────┴───────────┐ + │ │ + ┌─────────▼────────┐ ┌────────▼─────────┐ + │ MongoDB Atlas │ │ Google AI API │ + │ (Database) │ │ (AI Features) │ + │ │ │ │ + │ • Users │ │ • Reply │ + │ • Startups │ │ Suggestions │ + │ • Posts │ │ │ + │ • Projects │ │ │ + │ • Messages │ │ │ + └──────────────────┘ └──────────────────┘ +``` + +### Data Flow Architecture + +``` +User Action Flow: +┌──────────────────────────────────────────────────────────────────┐ +│ │ +│ User Interaction → Client Component → API Request │ +│ │ +│ 1. Registration/Login │ +│ User Input → /api/auth/* → Validate → Hash Password │ +│ → Save to MongoDB → Create JWT Session → Redirect │ +│ │ +│ 2. Creating Content (Posts/Startups/Projects) │ +│ User Input → Upload Images → /api/upload │ +│ → Save Files → /api/{resource} → Validate │ +│ → Save to MongoDB → Update UI │ +│ │ +│ 3. Social Interactions (Follow/Like/Comment) │ +│ User Action → /api/{resource}/{id}/{action} │ +│ → Authenticate → Update MongoDB → Real-time Update │ +│ │ +│ 4. Messaging │ +│ Send Message → /api/conversations → Check Existing │ +│ → Create/Update Conversation → Save Message │ +│ → AI Suggestion (Optional) → Deliver to Recipient │ +│ │ +│ 5. Search │ +│ Search Query → /api/{resource}/search │ +│ → MongoDB Text Search → Filter Results → Display │ +│ │ +└──────────────────────────────────────────────────────────────────┘ + +Authentication Flow: +┌──────────────────────────────────────────────────────────────────┐ +│ │ +│ Page Request → Middleware → Check Session │ +│ │ +│ ├─ No Session & Protected Route → Redirect to /auth/login │ +│ ├─ Session & Auth Route → Redirect to /home │ +│ └─ Valid Access → Continue to Requested Page │ +│ │ +└──────────────────────────────────────────────────────────────────┘ +``` --- -## How It's Built - -This is a full-stack application combining: -1. *Frontend*: What users see in their browser -2. *Backend*: Server logic processing requests -3. *Database*: Permanent data storage +## Tech Stack -### How Next.js Works Here +### Frontend Technologies +- Next.js 15.5.4 - Full-stack React framework +- React 18.3.1 - UI component library +- Tailwind CSS - Utility-first CSS framework +- Shadcn UI - Accessible component library +- Framer Motion - Animation library +- Next Themes - Theme management system -Next.js combines frontend and backend: +### Backend Technologies +- Next.js API Routes - RESTful API endpoints +- MongoDB - NoSQL database +- Mongoose - MongoDB object modeling +- NextAuth.js 5.0 - Authentication framework -1. *Pages/Routes*: Files in app folder become web pages - - app/page.js → homepage - - app/home/page.jsx → /home - - app/profile/page.jsx → /profile +### Security +- NextAuth.js v5 - Session-based authentication +- bcryptjs - Password hashing +- JWT - JSON Web Tokens for sessions -2. *API Routes*: Files in app/api become backend endpoints - - app/api/posts/route.js → handles posts - - app/api/users/[id]/route.js → handles user data +### AI Integration +- Google Generative AI - AI-powered features -3. *Server Components*: Some components render on the server first, making the app faster. +### Development Tools +- Zod - Schema validation +- React Hook Form - Form state management +- date-fns - Date manipulation +- Lucide React - Icon components --- ## Project Structure - -hackathon/ -├── app/ # Main application -│ ├── page.js # Landing page -│ ├── layout.js # App wrapper -│ ├── globals.css # Global styles +``` +StartupLink/ +├── app/ # Next.js application directory +│ ├── page.js # Landing page +│ ├── layout.js # Root layout wrapper +│ ├── globals.css # Global styles │ │ -│ ├── (main)/ # Protected pages (login required) -│ │ ├── home/ # Dashboard/feed -│ │ ├── messages/ # Messaging -│ │ ├── network/ # Connections -│ │ ├── profile/ # User profiles -│ │ ├── post/[id]/ # Post details -│ │ ├── project/[id]/ # Project details -│ │ ├── startup/[id]/ # Startup pages -│ │ ├── startups/ # Browse startups -│ │ └── search/ # Search +│ ├── (main)/ # Protected routes group +│ │ ├── home/ # Main dashboard feed +│ │ ├── messages/ # Direct messaging +│ │ ├── network/ # User connections +│ │ ├── profile/ # User profile pages +│ │ ├── post/[id]/ # Individual post view +│ │ ├── project/[id]/ # Project detail pages +│ │ ├── startup/[id]/ # Startup detail pages +│ │ ├── startups/ # Startup directory +│ │ └── search/ # Search functionality │ │ -│ ├── auth/ # Authentication -│ │ ├── login/ # Login page -│ │ └── register/ # Sign up page +│ ├── auth/ # Authentication routes +│ │ ├── login/ # User login +│ │ └── register/ # User registration │ │ -│ └── api/ # Backend endpoints -│ ├── auth/ # Auth APIs -│ ├── posts/ # Post management -│ ├── projects/ # Project management -│ ├── startups/ # Startup management -│ ├── users/ # User operations -│ ├── conversations/ # Messaging -│ └── upload/ # File uploads +│ └── api/ # API route handlers +│ ├── auth/ # Authentication endpoints +│ ├── posts/ # Post CRUD operations +│ ├── projects/ # Project management +│ ├── startups/ # Startup management +│ ├── users/ # User operations +│ ├── conversations/ # Messaging system +│ └── upload/ # File upload handling │ -├── components/ # Reusable UI components -│ ├── ui/ # Basic elements -│ ├── auth/ # Auth forms -│ ├── layout/ # Header/footer -│ ├── project/ # Project components -│ └── startup/ # Startup components +├── components/ # React components +│ ├── ui/ # Base UI components +│ ├── auth/ # Authentication forms +│ ├── layout/ # Layout components +│ ├── project/ # Project-specific components +│ └── startup/ # Startup-specific components │ -├── lib/ # Utilities -│ ├── models/ # Database schemas -│ │ ├── user.model.js -│ │ ├── post.model.js -│ │ ├── startup.model.js -│ │ ├── project.model.js -│ │ └── message.model.js -│ ├── mongoose.js # Database connection -│ └── utils.js # Helper functions +├── lib/ # Core utilities and configurations +│ ├── models/ # Mongoose schema definitions +│ │ ├── user.model.js # User schema +│ │ ├── post.model.js # Post schema +│ │ ├── startup.model.js # Startup schema +│ │ ├── project.model.js # Project schema +│ │ └── message.model.js # Message schema +│ ├── mongoose.js # Database connection +│ └── utils.js # Utility functions │ -├── contexts/ # React state management -├── auth.js # Auth configuration -├── middleware.js # Route protection -└── package.json # Dependencies - - -### Structure Breakdown - -- *app/*: All pages and API routes -- *components/*: Reusable UI pieces -- *lib/models/*: Database data structure definitions -- *lib/mongoose.js*: Database connection -- *auth.js*: Authentication setup -- *middleware.js*: Checks login status before page access +├── contexts/ # React Context providers +├── auth.js # NextAuth configuration +├── middleware.js # Route protection middleware +├── auth.config.js # Auth configuration +└── package.json # Project dependencies +``` + +### Directory Responsibilities + +| Directory | Purpose | +|-----------|---------| +| app/ | Next.js pages and API routes using App Router | +| components/ | Reusable React components | +| lib/models/ | MongoDB schema definitions | +| lib/mongoose.js | Database connection configuration | +| auth.js | NextAuth.js authentication setup | +| middleware.js | Route protection and authentication checks | --- ## Data Models -Data models define how information is structured in the database. +The application uses MongoDB with Mongoose for data modeling. Below are the core schemas: ### User Model -User account information. - -*Fields:* -- name: Full name -- email: Email (unique, used for login) -- username: Unique username -- password: Encrypted password -- bio: User description -- skills: Array of skills -- avatar: Profile picture -- coverImage: Banner image -- location: City/country -- position: Job title -- company: Current company -- website: Personal website -- social: Social media links -- followers: Array of follower IDs -- following: Array of following IDs -- createdAt: Account creation date + +Stores user account information and profile data. + +| Field | Type | Description | +|-------|------|-------------| +| name | String | Full name of the user | +| email | String | Unique email address (used for login) | +| username | String | Unique username | +| password | String | Hashed password (bcrypt) | +| bio | String | User biography | +| skills | Array | List of user skills | +| avatar | String | Profile picture URL | +| coverImage | String | Profile banner image URL | +| location | String | User location | +| position | String | Job title | +| company | String | Current company | +| website | String | Personal website URL | +| social | Object | Social media links | +| followers | Array | User IDs of followers | +| following | Array | User IDs being followed | +| createdAt | Date | Account creation timestamp | ### Startup Model -Company information. - -*Fields:* -- name: Startup name -- slug: URL-friendly name -- description: Company description -- logo: Company logo -- coverImage: Banner image -- industry: Business sector -- stage: Funding stage -- location: Company location -- website: Company website -- foundedDate: Launch date -- founder: Founder user ID -- team: Team members and roles -- showcase: Featured projects -- social: Social media links -- followers: Follower IDs -- projects: Project IDs + +Represents startup/company information. + +| Field | Type | Description | +|-------|------|-------------| +| name | String | Startup name | +| slug | String | URL-friendly identifier | +| description | String | Company description | +| logo | String | Company logo URL | +| coverImage | String | Banner image URL | +| industry | String | Business sector/industry | +| stage | String | Current funding stage | +| location | String | Company headquarters location | +| website | String | Company website URL | +| foundedDate | Date | Company founding date | +| founder | ObjectId | Reference to User model | +| team | Array | Team members with roles | +| showcase | Array | Featured projects | +| social | Object | Social media links | +| followers | Array | User IDs following the startup | +| projects | Array | Associated project IDs | ### Post Model -Social media posts. - -*Fields:* -- content: Post text -- author: Author user ID -- startup: Related startup (optional) -- images: Image URLs -- likes: User IDs who liked -- comments: Array of comments -- shares: Share information -- createdAt: Post timestamp + +Social media post content. + +| Field | Type | Description | +|-------|------|-------------| +| content | String | Post text content | +| author | ObjectId | Reference to User model | +| startup | ObjectId | Optional reference to Startup | +| images | Array | Image URLs | +| likes | Array | User IDs who liked | +| comments | Array | Comment objects | +| shares | Array | Share information | +| createdAt | Date | Post creation timestamp | ### Project Model -Startup projects. - -*Fields:* -- title: Project name -- description: Project details -- startup: Parent startup ID -- creator: Creator user ID -- status: Current status -- tags: Keywords -- links: Related URLs -- images: Screenshots -- startDate: Start date -- endDate: End date (optional) -- likes: User IDs who liked -- comments: Project comments - -### Message & Conversation Models -Direct messaging. - -*Message Fields:* -- conversation: Conversation ID -- sender: Sender user ID -- content: Message text -- read: Read status -- createdAt: Timestamp - -*Conversation Fields:* -- participants: User IDs in conversation -- lastMessage: Most recent message -- updatedAt: Last activity + +Startup project information. + +| Field | Type | Description | +|-------|------|-------------| +| title | String | Project name | +| description | String | Project details | +| startup | ObjectId | Reference to Startup model | +| creator | ObjectId | Reference to User model | +| status | String | Project status | +| tags | Array | Keywords/tags | +| links | Array | Related URLs | +| images | Array | Screenshot URLs | +| startDate | Date | Project start date | +| endDate | Date | Project end date (optional) | +| likes | Array | User IDs who liked | +| comments | Array | Comment objects | + +### Message Model + +Direct message content. + +| Field | Type | Description | +|-------|------|-------------| +| conversation | ObjectId | Reference to Conversation model | +| sender | ObjectId | Reference to User model | +| content | String | Message text | +| read | Boolean | Read status | +| createdAt | Date | Message timestamp | + +### Conversation Model + +Message thread between users. + +| Field | Type | Description | +|-------|------|-------------| +| participants | Array | User IDs in conversation | +| lastMessage | ObjectId | Reference to last Message | +| updatedAt | Date | Last activity timestamp | --- ## Core Features -### User Authentication -- Email and password registration -- Encrypted password storage -- Secure login with session management -- Automatic redirects based on auth status -- Protected routes - -### User Profiles -- Create and edit profiles -- Add skills, bio, location, social links -- Upload profile and cover images -- View other profiles -- Follow/unfollow system - -### Startup Management -- Register startups with complete details -- Upload logos and covers -- Add team members -- Display showcase projects -- Track followers -- Edit information - -### Social Feed -- Create posts with text and images -- Like and comment -- Share posts -- View feed from followed accounts -- Search posts - -### Project Showcase -- Create projects linked to startups -- Add descriptions, images, links -- Tag with keywords -- Track status -- Get likes and comments - -### Networking +### 1. User Authentication +- Secure registration with email and password +- Password encryption using bcryptjs +- Session-based authentication via NextAuth.js +- Protected route middleware +- Automatic redirection based on authentication status + +### 2. User Profile Management +- Comprehensive profile creation and editing +- Skills, biography, and location information +- Profile picture and cover image upload +- Social media link integration +- Follow and unfollow functionality +- View other user profiles + +### 3. Startup Management +- Complete startup registration system +- Logo and cover image upload +- Team member management +- Project showcase display +- Follower tracking +- Full CRUD operations for startup information + +### 4. Social Feed +- Create posts with text and image content +- Like and comment functionality +- Post sharing capabilities +- Personalized feed from followed accounts +- Post search functionality + +### 5. Project Showcase +- Link projects to startups +- Rich project descriptions with images +- External link management +- Keyword tagging system +- Status tracking +- Social engagement (likes and comments) + +### 6. Networking System - Follow users and startups -- Browse connections -- Search by name, skills, location +- Browse user connections +- Search by name, skills, or location - View mutual connections +- Network exploration -### Messaging -- Direct messages to users -- Real-time delivery +### 7. Direct Messaging +- One-to-one messaging between users - Conversation history -- AI-powered reply suggestions +- Message read status tracking +- AI-powered reply suggestions (Google Generative AI) -### Search -- Search startups by name or industry -- Search users by name or skills -- Search projects by title or tags -- Filter and sort results +### 8. Search Functionality +- Multi-resource search (startups, users, projects) +- Filter by industry, skills, tags +- Sort and organize results +- Text-based search using MongoDB -### Dark Mode -- Toggle light/dark themes -- Saved per user +### 9. Theme Support +- Light and dark mode toggle +- User preference persistence +- System-wide theme application --- ## Setup Guide -### Quick Start Decision Tree - -**Have .env.local with MongoDB configured?** -- *Yes + Have Node.js/pnpm*: Run pnpm install → pnpm dev (5 min) -- *Yes + Fresh device*: Install Node.js/pnpm → pnpm install → pnpm dev (20 min) -- *No*: Follow complete setup below (40 min) - -### Complete Setup (Fresh Start) - -#### Step 1: Install Software - -*1.1 Install Node.js* -1. Download from https://nodejs.org/ (LTS version) -2. Run installer with default settings -3. Verify: node --version +### Prerequisites -*1.2 Install pnpm* -powershell -npm install -g pnpm +Before starting, ensure you have: +- Node.js (version 18 or higher) +- npm or pnpm package manager +- MongoDB Atlas account (free tier available) +- Git (for cloning the repository) -Verify: pnpm --version +### Installation Steps -#### Step 2: Get Project Files +#### 1. Clone the Repository -*Option A: Clone* -bash -git clone https://github.com/Adil027/NSCP-SPADES.git -cd NSCP-SPADES +```bash +git clone https://github.com/mianjunaid1223/StartupLink.git +cd StartupLink +``` +#### 2. Install Dependencies -*Option B: Download ZIP* -Extract to Desktop, open terminal in folder. - -#### Step 3: Install Dependencies - -powershell -cd C:\Users\YourUsername\Desktop\NSCP-SPADES-main +Using pnpm (recommended): +```bash pnpm install - - -This downloads all required packages (3-5 minutes). - -#### Step 4: Setup MongoDB - -*4.1 Create Account* -1. Go to https://www.mongodb.com/cloud/atlas -2. Sign up (free tier) -3. Create cluster (M0 Sandbox, AWS, closest region) - -*4.2 Create Database User* -1. Database Access → Add New Database User -2. Username: admin -3. Password: Autogenerate (save it!) -4. Privileges: Read and write to any database - -*4.3 Whitelist IP* -1. Network Access → Add IP Address -2. Allow Access from Anywhere - -*4.4 Get Connection String* -1. Database → Connect → Connect your application -2. Copy connection string -3. Replace with your actual password - -Example: - +``` + +Using npm: +```bash +npm install +``` + +Installation typically takes 3-5 minutes depending on your internet connection. + +#### 3. MongoDB Setup + +##### 3.1 Create MongoDB Atlas Account +1. Navigate to [MongoDB Atlas](https://www.mongodb.com/cloud/atlas) +2. Create a free account +3. Create a new cluster (select M0 Sandbox tier for free usage) + +##### 3.2 Configure Database Access +1. Go to Database Access in the left sidebar +2. Click "Add New Database User" +3. Create username and password (save these credentials) +4. Set privileges to "Read and write to any database" + +##### 3.3 Configure Network Access +1. Go to Network Access in the left sidebar +2. Click "Add IP Address" +3. Select "Allow Access from Anywhere" for development +4. For production, restrict to specific IP addresses + +##### 3.4 Get Connection String +1. Click "Connect" on your cluster +2. Select "Connect your application" +3. Copy the connection string +4. Replace `` with your database user password + +Example connection string: +``` mongodb+srv://admin:YourPassword@cluster0.xxxxx.mongodb.net/?retryWrites=true&w=majority +``` +#### 4. Environment Configuration -#### Step 5: Configure Environment - -Create .env.local in project root: +Create a `.env.local` file in the project root directory: -env -# MongoDB Connection -MONGODB_URL="mongodb+srv://admin:YourPassword@cluster0.xxxxx.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0" +```env +# Database Configuration +MONGODB_URL="mongodb+srv://username:password@cluster.mongodb.net/?retryWrites=true&w=majority" # NextAuth Configuration NEXTAUTH_URL="http://localhost:3000" -NEXTAUTH_SECRET="generate-random-32-character-string" +NEXTAUTH_SECRET="your-generated-secret-key" -# Google AI (optional) -GEMINI_API_KEY="your-key-here" +# AI Features (Optional) +GEMINI_API_KEY="your-google-ai-api-key" +``` +##### Generate NEXTAUTH_SECRET -*Generate NEXTAUTH_SECRET:* -powershell +Run this command to generate a secure secret: +```bash node -e "console.log(require('crypto').randomBytes(32).toString('hex'))" +``` +##### Get GEMINI_API_KEY (Optional) -*Get GEMINI_API_KEY (optional):* -Visit https://makersuite.google.com/app/apikey +For AI-powered features, obtain an API key from [Google AI Studio](https://makersuite.google.com/app/apikey) -#### Step 6: Run Application +#### 5. Run the Application -powershell -# Clear cache (first time) -Remove-Item -Recurse -Force .next -ErrorAction SilentlyContinue - -# Start server +Development mode with hot reload: +```bash pnpm dev +``` +Or with npm: +```bash +npm run dev +``` -Wait for "Ready" message, then visit http://localhost:3000 - -#### Step 7: Create Account +The application will start at [http://localhost:3000](http://localhost:3000) -1. Click "Sign Up" -2. Fill in details -3. Register -4. Login +#### 6. Initial Setup -Done! +1. Navigate to [http://localhost:3000](http://localhost:3000) +2. Click "Join Now" to create an account +3. Complete the registration form +4. Log in with your credentials --- ## Environment Configuration -All variables go in .env.local in project root. +### Environment Variables -### Required Variables +All environment variables must be defined in a `.env.local` file in the project root directory. -*MONGODB_URL* -env -MONGODB_URL="mongodb+srv://username:password@cluster.mongodb.net/?retryWrites=true&w=majority" - -Your MongoDB Atlas connection string. +#### Required Variables -*NEXTAUTH_URL* -env -NEXTAUTH_URL="http://localhost:3000" +| Variable | Description | Example | +|----------|-------------|---------| +| MONGODB_URL | MongoDB Atlas connection string | `mongodb+srv://user:pass@cluster.mongodb.net/` | +| NEXTAUTH_URL | Application base URL | `http://localhost:3000` | +| NEXTAUTH_SECRET | Secret key for session encryption | Generated 32-character string | -Base URL (use http://localhost:3000 for development). +#### Optional Variables -*NEXTAUTH_SECRET* -env -NEXTAUTH_SECRET="your-random-32-character-secret" - -Random secret for encrypting sessions. Generate with: -powershell -node -e "console.log(require('crypto').randomBytes(32).toString('hex'))" +| Variable | Description | Required For | +|----------|-------------|--------------| +| GEMINI_API_KEY | Google AI API key | AI-powered reply suggestions | +### Configuration Template -### Optional Variables +```env +# Database Connection +MONGODB_URL="mongodb+srv://username:password@cluster.mongodb.net/?retryWrites=true&w=majority" -*GEMINI_API_KEY* -env -GEMINI_API_KEY="your-api-key" +# Authentication +NEXTAUTH_URL="http://localhost:3000" +NEXTAUTH_SECRET="generated-random-secret-key" -For AI-powered features. Get from https://makersuite.google.com/app/apikey +# AI Features (Optional) +GEMINI_API_KEY="your-google-ai-api-key" +``` -### Complete Template +### Security Notes -env -MONGODB_URL="mongodb+srv://admin:Password123@cluster0.xxxxx.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0" -NEXTAUTH_URL="http://localhost:3000" -NEXTAUTH_SECRET="a8f5f167f44f4964e6c998dee827110c" -GEMINI_API_KEY="AIzaSyAZIlbFjSPa3q2hyFcSvtjw2d3iUGUX4w0" +- Never commit `.env.local` to version control +- Generate strong, unique secrets for production +- Restrict MongoDB network access in production +- Use environment-specific URLs for NEXTAUTH_URL +--- -**Never commit .env.local to Git.** +## Running the Application ---- +### Development Commands -## Running the App +| Command | Description | +|---------|-------------| +| `pnpm dev` | Start development server with hot reload | +| `pnpm build` | Build application for production | +| `pnpm start` | Run production build | +| `pnpm lint` | Run ESLint code quality checks | -### Development Mode +### Development Server -powershell +Start the development server: +```bash pnpm dev +``` +The application will be available at [http://localhost:3000](http://localhost:3000) -Starts server at http://localhost:3000 with hot reload. +### Custom Port -### Different Port - -powershell +To run on a different port: +```bash pnpm dev -- -p 3001 - +``` ### Production Build -bash +Build and run for production: +```bash pnpm build pnpm start +``` +### Stopping the Server -### Available Commands - -| Command | Purpose | -|---------|---------| -| pnpm install | Install dependencies | -| pnpm dev | Start dev server | -| pnpm build | Build for production | -| pnpm start | Run production build | -| pnpm lint | Check code quality | - -### Stopping Server - -Press Ctrl + C in terminal. - ---- - -## How Everything Works - -### User Registration -1. User fills registration form -2. Data sent to /api/auth/register -3. Email checked for duplicates -4. Password encrypted with bcryptjs -5. User saved to MongoDB -6. Redirect to login - -### User Login -1. User enters credentials -2. NextAuth validates -3. Database queried for user -4. Password compared -5. JWT token created -6. Token stored in secure cookie -7. Redirect to /home - -### Creating Posts -1. User types content, uploads images -2. Images uploaded to /api/upload -3. Saved in public/uploads/ -4. Post data sent to /api/posts -5. Validated and saved to MongoDB -6. Appears in feed - -### Creating Startups -1. User fills startup form -2. Images uploaded -3. Data sent to /api/startups -4. Unique slug generated -5. Startup saved with user as founder -6. Accessible at /startup/[id] - -### Following Users -1. Click "Follow" -2. Request to /api/users/[id]/follow -3. Your ID added to their followers -4. Their ID added to your following -5. Button updates to "Unfollow" - -### Messaging -1. User sends message -2. Check for existing conversation -3. Create conversation if needed -4. Message saved with conversation ID -5. Recipient sees in inbox -6. AI suggests replies - -### Search -1. User enters query -2. Request to appropriate API -3. MongoDB text search performed -4. Results filtered -5. Matches returned - -### Route Protection -1. Request goes through middleware.js -2. Checks for valid session -3. Logged in + accessing auth pages → redirect to /home -4. Not logged in + accessing protected pages → redirect to /auth/login -5. Public routes accessible to everyone +Press `Ctrl + C` in the terminal to stop the development server. --- ## API Endpoints -### Authentication -- POST /api/auth/register - Register -- POST /api/auth/[...nextauth] - Login/logout - -### Users -- GET /api/users/[id] - Get user -- PUT /api/users/[id] - Update profile -- POST /api/users/[id]/follow - Follow/unfollow -- GET /api/users/search - Search users - -### Startups -- GET /api/startups - List startups -- POST /api/startups - Create startup -- GET /api/startups/[id] - Get startup -- PUT /api/startups/[id] - Update startup -- DELETE /api/startups/[id] - Delete startup -- POST /api/startups/[id]/follow - Follow startup -- GET /api/startups/search - Search startups - -### Posts -- GET /api/posts - Get feed -- POST /api/posts - Create post -- GET /api/posts/[id] - Get post -- POST /api/posts/[id]/like - Like/unlike -- POST /api/posts/[id]/comments - Comment -- GET /api/posts/search - Search posts - -### Projects -- GET /api/projects - List projects -- POST /api/projects - Create project -- GET /api/projects/[id] - Get project -- PUT /api/projects/[id] - Update project -- POST /api/projects/[id]/like - Like project - -### Messaging -- GET /api/conversations - Get conversations -- POST /api/conversations - Create conversation -- GET /api/conversations/[id]/messages - Get messages -- POST /api/conversations/[id]/messages - Send message - -### Other -- POST /api/upload - Upload files -- POST /api/ai/suggest-replies - AI suggestions +### Authentication Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| POST | `/api/auth/register` | Register new user account | +| POST | `/api/auth/[...nextauth]` | Handle login and logout | + +### User Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| GET | `/api/users/[id]` | Retrieve user profile | +| PUT | `/api/users/[id]` | Update user profile | +| POST | `/api/users/[id]/follow` | Follow or unfollow user | +| GET | `/api/users/search` | Search users by criteria | + +### Startup Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| GET | `/api/startups` | List all startups | +| POST | `/api/startups` | Create new startup | +| GET | `/api/startups/[id]` | Retrieve startup details | +| PUT | `/api/startups/[id]` | Update startup information | +| DELETE | `/api/startups/[id]` | Delete startup | +| POST | `/api/startups/[id]/follow` | Follow or unfollow startup | +| GET | `/api/startups/search` | Search startups | + +### Post Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| GET | `/api/posts` | Retrieve feed posts | +| POST | `/api/posts` | Create new post | +| GET | `/api/posts/[id]` | Retrieve single post | +| POST | `/api/posts/[id]/like` | Like or unlike post | +| POST | `/api/posts/[id]/comments` | Add comment to post | +| GET | `/api/posts/search` | Search posts | + +### Project Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| GET | `/api/projects` | List all projects | +| POST | `/api/projects` | Create new project | +| GET | `/api/projects/[id]` | Retrieve project details | +| PUT | `/api/projects/[id]` | Update project | +| POST | `/api/projects/[id]/like` | Like project | + +### Messaging Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| GET | `/api/conversations` | List user conversations | +| POST | `/api/conversations` | Create new conversation | +| GET | `/api/conversations/[id]/messages` | Retrieve conversation messages | +| POST | `/api/conversations/[id]/messages` | Send message | + +### Utility Endpoints + +| Method | Endpoint | Description | +|--------|----------|-------------| +| POST | `/api/upload` | Upload files (images) | +| POST | `/api/ai/suggest-replies` | Generate AI reply suggestions | --- ## Authentication -### How It Works +### Authentication Flow + +The application uses NextAuth.js v5 with session-based authentication and JWT tokens. + +#### Login Process +1. User submits credentials via login form +2. Request sent to `/api/auth/[...nextauth]` +3. Credentials validated against MongoDB user collection +4. Password verified using bcryptjs comparison +5. JWT token generated with user information +6. Token stored in secure HTTP-only cookie +7. User redirected to dashboard -*Session-Based with JWT:* -1. User logs in -2. Credentials validated -3. JWT created with user info -4. Stored in secure HTTP-only cookie -5. Cookie sent with every request -6. Server validates token +#### Session Management +- Sessions persist for 30 days by default +- JWT tokens contain: user ID, email, name, profile image +- Tokens automatically refresh on user activity +- HTTP-only cookies prevent XSS attacks -*Token Contains:* -- User ID -- Email -- Name -- Profile image -- Expiration (30 days) +#### Route Protection -*Protected Routes:* -Routes under app/(main) require login. Middleware checks and redirects if needed. +The middleware (`middleware.js`) protects routes: +- Public routes: `/`, `/auth/login`, `/auth/register` +- Protected routes: All routes under `/app/(main)` +- Authenticated users accessing auth pages are redirected to `/home` +- Unauthenticated users accessing protected pages are redirected to `/auth/login` -### Getting User Data +### Accessing Session Data -*Server Components:* -javascript +#### In Server Components +```javascript import { auth } from "@/auth"; export default async function Page() { const session = await auth(); const user = session?.user; + return
Welcome {user?.name}
; } +``` - -*Client Components:* -javascript +#### In Client Components +```javascript import { useSession } from "next-auth/react"; export default function Component() { - const { data: session } = useSession(); - const user = session?.user; + const { data: session, status } = useSession(); + + if (status === "loading") return
Loading...
; + if (status === "unauthenticated") return
Please log in
; + + return
Welcome {session?.user?.name}
; } - +``` --- ## Deployment -### Production Checklist -1. Set environment variables on hosting platform -2. Ensure MongoDB accessible from production -3. Run pnpm build -4. Test with pnpm start +### Prerequisites for Production + +Before deploying, ensure: +1. MongoDB Atlas cluster is accessible from production environment +2. All environment variables are configured on hosting platform +3. Application builds successfully without errors +4. Database connection is tested and working + +### Deployment Steps + +#### Using Vercel (Recommended) + +1. Push code to GitHub repository +2. Connect repository to Vercel +3. Configure environment variables in Vercel dashboard +4. Deploy automatically on every push to main branch + +#### Manual Deployment + +1. Build the application: + ```bash + pnpm build + ``` + +2. Set production environment variables -### Recommended Hosts -- Vercel (recommended for Next.js) -- Netlify -- Railway +3. Start the production server: + ```bash + pnpm start + ``` -### Vercel Deployment -1. Push to GitHub -2. Connect repo to Vercel -3. Add environment variables -4. Auto-deploy on push +### Environment Variables for Production + +Update these variables for production: +- `NEXTAUTH_URL`: Your production domain (e.g., `https://yourdomain.com`) +- `MONGODB_URL`: Ensure proper network access configuration +- `NEXTAUTH_SECRET`: Use a strong, unique secret + +### Recommended Hosting Platforms + +| Platform | Best For | Features | +|----------|----------|----------| +| Vercel | Next.js applications | Automatic deployments, edge functions | +| Railway | Full-stack applications | Database hosting, automatic scaling | +| Netlify | Jamstack applications | CDN, serverless functions | --- ## License -Built for educational purposes as part of a hackathon. +This project was built for educational purposes. + +--- + +## Support and Contribution + +### Reporting Issues + +If you encounter any problems: +1. Check existing [GitHub Issues](https://github.com/mianjunaid1223/StartupLink/issues) +2. Create a new issue with detailed description +3. Include steps to reproduce the problem + +### Getting Help + +For assistance: +- Review the documentation above +- Check the MongoDB connection configuration +- Verify all environment variables are set correctly +- Ensure Node.js version compatibility --- -## Support +## Additional Resources -For issues: -- Open GitHub issue -- Contact development team -- Check documentation above +- [Next.js Documentation](https://nextjs.org/docs) +- [NextAuth.js Documentation](https://next-auth.js.org/) +- [MongoDB Atlas Documentation](https://docs.atlas.mongodb.com/) +- [Tailwind CSS Documentation](https://tailwindcss.com/docs) --- From cd38abc209fad9fa62dbe2758fc953b03ba6c80f Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 30 Oct 2025 08:56:19 +0000 Subject: [PATCH 3/4] Fix naming inconsistencies in README documentation Co-authored-by: mianjunaid1223 <111676821+mianjunaid1223@users.noreply.github.com> --- README.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 1b339f6..cfd0089 100644 --- a/README.md +++ b/README.md @@ -170,7 +170,7 @@ Authentication Flow: ## Project Structure ``` -StartupLink/ +NSCP-SPADES/ ├── app/ # Next.js application directory │ ├── page.js # Landing page │ ├── layout.js # Root layout wrapper @@ -430,6 +430,8 @@ git clone https://github.com/mianjunaid1223/StartupLink.git cd StartupLink ``` +Note: The repository name is "StartupLink" on GitHub, which is the project codebase for NSCP-SPADES platform. + #### 2. Install Dependencies Using pnpm (recommended): From 20d329e9860643bacc513160b1587388f7523a53 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 30 Oct 2025 08:57:12 +0000 Subject: [PATCH 4/4] Fix project structure directory name to match repository Co-authored-by: mianjunaid1223 <111676821+mianjunaid1223@users.noreply.github.com> --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index cfd0089..c82b2ca 100644 --- a/README.md +++ b/README.md @@ -170,7 +170,7 @@ Authentication Flow: ## Project Structure ``` -NSCP-SPADES/ +StartupLink/ ├── app/ # Next.js application directory │ ├── page.js # Landing page │ ├── layout.js # Root layout wrapper