Skip to content
why-GitHupPublic

About

Resources

Stars

0 stars

Watchers

0 watching

Forks

Repository files navigation

πŸš€ Startup Ideas Platform

A modern, full-stack web application for entrepreneurs to share, discover, and collaborate on startup ideas. Built with Next.js 16, TypeScript, Prisma, and NextAuth, this platform provides a seamless experience for the startup community to connect and innovate.

Next.js TypeScript Prisma Tailwind CSS


πŸŽ₯ Demo

https://user-images.githubusercontent.com/Screen%20Recording%202026-01-23%20114757.mp4

Watch the platform in action - from browsing startup ideas to creating your own


πŸ“‹ Table of Contents


✨ Features

Core Functionality

  • 🎯 Share Startup Ideas: Create and publish your startup concepts with detailed descriptions
  • πŸ” Browse & Discover: Explore innovative startup ideas from entrepreneurs worldwide
  • πŸ‘€ User Profiles: Manage your startups and track your submissions
  • πŸ” Secure Authentication: GitHub OAuth integration via NextAuth v5
  • πŸ“Š View Tracking: Monitor engagement with view counts on each startup
  • 🏷️ Category System: Organize startups by categories (Tech, Health, Finance, Education, etc.)
  • πŸ“± Fully Responsive: Mobile-first design with seamless experience across all devices

Technical Features

  • ⚑ Server-Side Rendering: Optimized performance with Next.js App Router
  • 🎨 Modern UI: Beautiful interface with Tailwind CSS and custom animations
  • πŸ”„ Real-time Updates: Form submissions with React Server Actions
  • πŸ—ƒοΈ Type-Safe Database: Prisma ORM with PostgreSQL
  • πŸ›‘οΈ Form Validation: Comprehensive client and server-side validation
  • 🎭 Animated Components: Smooth animations and transitions
  • πŸ“ Rich Content: Support for detailed pitches and descriptions

πŸ›  Tech Stack

Frontend

Backend

Development Tools


πŸ“ Project Structure

startup/
β”œβ”€β”€ app/                          # Next.js App Router
β”‚   β”œβ”€β”€ (root)/                  # Root route group
β”‚   β”‚   β”œβ”€β”€ layout.tsx           # Root layout wrapper
β”‚   β”‚   └── page.tsx             # Homepage with hero section
β”‚   β”œβ”€β”€ api/                     # API routes
β”‚   β”‚   └── auth/                # Authentication endpoints
β”‚   β”‚       └── [...nextauth]/   # NextAuth.js handler
β”‚   β”‚           └── route.ts     # Auth API route
β”‚   β”œβ”€β”€ components/              # Shared components
β”‚   β”‚   └── Navbar.tsx           # Navigation bar component
β”‚   β”œβ”€β”€ startup/                 # Startup feature routes
β”‚   β”‚   └── create/              # Create startup page
β”‚   β”‚       β”œβ”€β”€ page.tsx         # Create page wrapper
β”‚   β”‚       └── StartupForm.tsx  # Startup creation form
β”‚   β”œβ”€β”€ startups/                # Browse startups
β”‚   β”‚   └── page.tsx             # Startups listing page
β”‚   β”œβ”€β”€ globals.css              # Global styles
β”‚   └── layout.tsx               # Root application layout
β”œβ”€β”€ data/                        # Static data files
β”‚   └── startups.json            # Sample startup data
β”œβ”€β”€ lib/                         # Utility functions
β”‚   β”œβ”€β”€ actions.ts               # Server actions
β”‚   β”œβ”€β”€ db.ts                    # Database operations
β”‚   └── utils.ts                 # Helper functions
β”œβ”€β”€ prisma/                      # Database configuration
β”‚   β”œβ”€β”€ schema.prisma            # Database schema
β”‚   └── prisma.config.ts         # Prisma configuration
β”œβ”€β”€ public/                      # Static assets
β”œβ”€β”€ auth.ts                      # NextAuth configuration
β”œβ”€β”€ components.json              # shadcn/ui configuration
β”œβ”€β”€ eslint.config.mjs            # ESLint configuration
β”œβ”€β”€ next-env.d.ts                # Next.js TypeScript declarations
β”œβ”€β”€ next.config.ts               # Next.js configuration
β”œβ”€β”€ package.json                 # Project dependencies
β”œβ”€β”€ postcss.config.mjs           # PostCSS configuration
β”œβ”€β”€ tailwind.config.ts           # Tailwind CSS configuration
β”œβ”€β”€ tsconfig.json                # TypeScript configuration
└── README.md                    # Project documentation

πŸš€ Getting Started

Prerequisites

Before you begin, ensure you have the following installed:

  • Node.js: Version 20 or higher (Download)
  • npm: Version 11.6.2 or higher (comes with Node.js)
  • PostgreSQL: Version 12 or higher (Download)
  • Git: For version control (Download)
  • GitHub Account: For OAuth authentication

Installation

  1. Clone the repository

    git clone <your-repository-url>
    cd startup
  2. Install dependencies

    npm install
  3. Set up environment variables (see Environment Variables)

  4. Initialize the database (see Database Setup)

Environment Variables

Create a .env file in the root directory with the following variables:

# Database Configuration
DATABASE_URL="postgresql://username:password@localhost:5432/startup_db?schema=public"

# Alternative LibSQL Configuration (optional)
# TURSO_DATABASE_URL="libsql://your-database.turso.io"
# TURSO_AUTH_TOKEN="your-auth-token"

# NextAuth Configuration
AUTH_SECRET="your-super-secret-key-here"  # Generate with: openssl rand -base64 32
AUTH_GITHUB_ID="your-github-oauth-app-id"
AUTH_GITHUB_SECRET="your-github-oauth-app-secret"

# Application URL
NEXTAUTH_URL="http://localhost:3000"

Setting up GitHub OAuth

  1. Go to GitHub Developer Settings
  2. Click "New OAuth App"
  3. Fill in the details:
    • Application name: Startup Ideas Platform
    • Homepage URL: http://localhost:3000
    • Authorization callback URL: http://localhost:3000/api/auth/callback/github
  4. Copy the Client ID to AUTH_GITHUB_ID
  5. Generate a Client Secret and copy it to AUTH_GITHUB_SECRET

Database Setup

  1. Create a PostgreSQL database

    # Using psql
    psql -U postgres
    CREATE DATABASE startup_db;
    \q
  2. Generate Prisma client

    npx prisma generate
  3. Run database migrations

    npx prisma db push
  4. Optional: Seed the database

    # You can create a seed script or manually add data through the app
    npx prisma studio  # Opens Prisma Studio for manual data entry

πŸ’» Development

Running the Development Server

npm run dev

Open http://localhost:3000 in your browser to see the application.

The development server features:

  • πŸ”₯ Hot Module Replacement: Instant updates as you edit files
  • πŸ“ TypeScript Support: Real-time type checking
  • 🎨 Tailwind JIT: Just-in-time CSS compilation
  • πŸ” Error Overlay: Detailed error messages in the browser

Available Scripts

Command Description
npm run dev Start development server on port 3000
npm run build Create production build
npm start Start production server
npm run lint Run ESLint for code quality
npx prisma studio Open Prisma Studio (database GUI)
npx prisma generate Generate Prisma client
npx prisma db push Push schema changes to database
npx prisma migrate dev Create and apply migrations

Development Workflow

  1. Create a new feature branch

    git checkout -b feature/your-feature-name
  2. Make your changes with hot reloading enabled

  3. Run linter to check code quality

    npm run lint
  4. Test your changes in the browser

  5. Commit and push

    git add .
    git commit -m "Add: your feature description"
    git push origin feature/your-feature-name

πŸ“– Usage

Creating a Startup

  1. Sign in with your GitHub account
  2. Navigate to "Share Your Idea" or click the button on the homepage
  3. Fill in the startup form:
    • Title: Name of your startup (min. 3 characters)
    • Category: Select from available categories
    • Description: Detailed description (min. 100 characters)
    • Image URL: Optional image for your startup
    • Pitch: Your elevator pitch
    • Stage: Current stage (Idea, MVP, Growth, etc.)
  4. Click "Submit Your Startup"

Browsing Startups

  1. Navigate to "Browse Startups" from the homepage
  2. Browse through all submitted startup ideas
  3. Click on any card to view more details
  4. View counts are automatically tracked

Managing Your Startups

  • View all your submissions in the Startups page
  • Each startup displays:
    • Title and category
    • Description and pitch
    • Current stage
    • View count
    • Creation date
    • Author information

πŸ”Œ API Routes

Authentication Routes

GET/POST /api/auth/[...nextauth]

NextAuth.js catch-all route handling all authentication requests.

Supported Providers:

  • GitHub OAuth

Endpoints:

  • /api/auth/signin - Sign in page
  • /api/auth/signout - Sign out
  • /api/auth/session - Get current session
  • /api/auth/callback/github - GitHub OAuth callback

Server Actions

createStartup

Server action to create a new startup.

Location: lib/actions.ts

Parameters:

  • formData: FormData object containing:
    • title (string, required, min 3 chars)
    • category (string, required)
    • description (string, required, min 100 chars)
    • image (string, optional)
    • pitch (string, optional)
    • stage (string, default: "idea")

Returns:

  • Success: { success: true } + redirect to startups page
  • Error: { error: string, success: false }

Authentication: Required


πŸ—„ Database Schema

User Model

model User {
  id            String    @id @default(cuid())
  name          String?
  email         String    @unique
  emailVerified DateTime?
  image         String?
  createdAt     DateTime  @default(now())
  
  startups      Startup[] // One-to-many relationship
}

Fields:

  • id: Unique identifier (CUID)
  • name: User's display name
  • email: Unique email address
  • emailVerified: Email verification timestamp
  • image: Profile image URL
  • createdAt: Account creation timestamp

Startup Model

model Startup {
  id          String   @id @default(cuid())
  title       String
  category    String
  description String
  image       String?
  pitch       String?
  stage       String   @default("idea")
  views       Int      @default(0)
  createdAt   DateTime @default(now())
  updatedAt   DateTime @updatedAt
  
  authorId    String
  author      User     @relation(fields: [authorId], references: [id], onDelete: Cascade)
  
  @@index([authorId])
  @@index([createdAt])
}

Fields:

  • id: Unique identifier (CUID)
  • title: Startup name/title
  • category: Startup category
  • description: Full description
  • image: Optional image URL
  • pitch: Elevator pitch
  • stage: Development stage (idea, mvp, growth, etc.)
  • views: View count
  • createdAt: Creation timestamp
  • updatedAt: Last update timestamp
  • authorId: Foreign key to User
  • author: Relation to User model

Indexes:

  • authorId: For efficient user startup queries
  • createdAt: For chronological sorting

πŸ” Authentication

This application uses NextAuth.js v5 (Beta) for authentication.

Authentication Flow

  1. User clicks "Sign In" on the Navbar
  2. Redirected to GitHub OAuth consent page
  3. User authorizes the application
  4. GitHub redirects back with authorization code
  5. NextAuth exchanges code for access token
  6. User session is created and stored
  7. User is redirected back to the application

Session Management

  • Sessions are handled server-side
  • Session data is encrypted and stored in cookies
  • Protected routes check for valid session
  • auth() helper provides current user information

Protected Routes

Routes that require authentication:

  • /startup/create - Create new startup

Authorization

  • Users can only create startups when authenticated
  • All users can browse public startup listings
  • User information is embedded in startup submissions

🚒 Deployment

Deploy on Vercel (Recommended)

Deploy with Vercel

  1. Push your code to GitHub

    git add .
    git commit -m "Initial commit"
    git push origin main
  2. Import your repository on Vercel

    • Go to Vercel
    • Click "Import Project"
    • Select your repository
  3. Configure environment variables

    • Add all variables from your .env file
    • Update NEXTAUTH_URL to your production domain
  4. Set up PostgreSQL database

  5. Deploy

    • Vercel will automatically build and deploy
    • Run database migrations after first deployment

Alternative Deployment Options

Docker

FROM node:20-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npx prisma generate
RUN npm run build
EXPOSE 3000
CMD ["npm", "start"]

Manual Deployment

  1. Build the application

    npm run build
  2. Set up environment variables on your server

  3. Run database migrations

    npx prisma db push
  4. Start the production server

    npm start

🀝 Contributing

Contributions are welcome! Here's how you can help:

Reporting Bugs

  1. Check if the bug has already been reported in Issues
  2. If not, create a new issue with:
    • Clear title and description
    • Steps to reproduce
    • Expected vs actual behavior
    • Screenshots if applicable
    • Your environment (OS, Node version, etc.)

Suggesting Features

  1. Check Issues for existing feature requests
  2. Create a new issue with:
    • Clear description of the feature
    • Use cases and benefits
    • Possible implementation approach

Pull Requests

  1. Fork the repository
  2. Create a feature branch
    git checkout -b feature/amazing-feature
  3. Make your changes
  4. Run linter and tests
    npm run lint
  5. Commit your changes
    git commit -m "Add: amazing feature"
  6. Push to your fork
    git push origin feature/amazing-feature
  7. Open a Pull Request

Code Style

  • Follow existing code conventions
  • Use TypeScript for type safety
  • Write meaningful commit messages
  • Comment complex logic
  • Keep functions small and focused

πŸ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.


πŸ™ Acknowledgments


πŸ“ž Support

If you have any questions or need help, please:

  • πŸ“§ Open an issue in this repository
  • πŸ’¬ Start a discussion in the Discussions tab
  • πŸ“– Check the Next.js Documentation
  • πŸ” Search existing issues and discussions

πŸ—ΊοΈ Roadmap

Future features and improvements:

  • User profiles with bio and social links
  • Startup detail pages with comments
  • Like/upvote system
  • Search and filtering functionality
  • Tags/hashtags for better discovery
  • Email notifications
  • Startup collaboration features
  • Analytics dashboard
  • Export startup data
  • Dark mode support
  • Multi-language support
  • Admin panel
  • Rate limiting
  • API documentation
  • Mobile app

Built with ❀️ by entrepreneurs, for entrepreneurs

Last Updated: January 2026

About

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages