Skip to content
View aixnetwork's full-sized avatar

Block or report aixnetwork

Block user

Prevent this user from interacting with your repositories and sending you notifications. Learn more about blocking users.

You must be logged in to block users.

Maximum 250 characters. Please don't include any personal information such as legal names or email addresses. Markdown supported. This note will be visible to only you.
Report abuse

Contact GitHub support about this user’s behavior. Learn more about reporting abuse.

Report abuse
aixnetwork/README.md

AI X Network

A modern Next.js website for AI X Network featuring a sleek design, contact forms, and user authentication.

πŸš€ Features

  • Modern Design: Clean, professional interface with responsive design
  • Contact Forms: Multiple contact forms with database storage
  • User Authentication: NextAuth.js integration for secure user management
  • Email Integration: Resend API for email notifications
  • Database: PostgreSQL database for data persistence
  • Responsive: Mobile-first design that works on all devices

πŸ› οΈ Tech Stack

  • Frontend: Next.js 14, React, TypeScript
  • Styling: Tailwind CSS
  • Authentication: NextAuth.js
  • Database: PostgreSQL
  • Email: Resend API
  • Deployment: Vercel/Netlify ready

πŸ“‹ Prerequisites

Before you begin, ensure you have:

  • Node.js 18+ installed
  • npm or yarn package manager
  • PostgreSQL database (or use the provided connection)
  • Resend API key (for email functionality)

πŸ”§ Local Development Setup

  1. Clone the repository

    git clone <your-repo-url>
    cd aixnetwork
  2. Navigate to the app directory

    cd app
  3. Install dependencies

    npm install
    # or
    yarn install
  4. Set up environment variables

    Copy the .env.example to .env and update the values:

    cp .env.example .env

    Required environment variables:

    # Database Configuration
    DATABASE_URL="your_postgresql_connection_string"
    
    # Email Configuration (Resend API)
    RESEND_API_KEY="your_resend_api_key"
    SALES_EMAIL="sales@yourdomain.com"
    FROM_EMAIL="noreply@yourdomain.com"
    
    # NextAuth Configuration
    NEXTAUTH_SECRET="your_secure_random_string"
    NEXTAUTH_URL="http://localhost:3000"  # For local development
  5. Run the development server

    npm run dev
    # or
    yarn dev
  6. Open your browser

    Navigate to http://localhost:3000 to see the application.

🌍 Environment Variables Guide

Required Variables

Variable Description Example
DATABASE_URL PostgreSQL connection string postgresql://user:pass@host:5432/db
RESEND_API_KEY Resend API key for emails re_xxxxxxxxxxxxxxxx
SALES_EMAIL Email for receiving contact forms sales@yourdomain.com
FROM_EMAIL Email address for sending notifications noreply@yourdomain.com
NEXTAUTH_SECRET Secret for NextAuth.js sessions your_secure_random_string
NEXTAUTH_URL Base URL of your application https://yourdomain.com

Getting API Keys

  1. Resend API Key:

    • Sign up at resend.com
    • Go to API Keys section
    • Create a new API key
    • Add your domain for email sending
  2. NextAuth Secret:

    • Generate a secure random string
    • You can use: openssl rand -base64 32

πŸš€ Deployment Guide

Option 1: Vercel (Recommended)

  1. Push your code to GitHub (see GitHub Setup section below)

  2. Deploy to Vercel:

    • Go to vercel.com
    • Click "New Project"
    • Import your GitHub repository
    • Set the root directory to app
    • Add environment variables in Vercel dashboard
    • Deploy!
  3. Configure Environment Variables in Vercel:

    • Go to your project settings
    • Navigate to "Environment Variables"
    • Add all required variables from your .env file
    • Update NEXTAUTH_URL to your Vercel domain

Option 2: Netlify

  1. Push your code to GitHub

  2. Deploy to Netlify:

    • Go to netlify.com
    • Click "New site from Git"
    • Choose your GitHub repository
    • Set build directory to app
    • Set build command to npm run build
    • Set publish directory to app/.next
    • Add environment variables
    • Deploy!

Option 3: GitHub Pages (Static Export)

For static deployment without server-side features:

  1. Configure Next.js for static export (in app/next.config.js):

    /** @type {import('next').NextConfig} */
    const nextConfig = {
      output: 'export',
      trailingSlash: true,
      images: {
        unoptimized: true
      }
    }
    module.exports = nextConfig
  2. Build and export:

    cd app
    npm run build
  3. Deploy the out folder to GitHub Pages

πŸ“š GitHub Setup Instructions

1. Create GitHub Repository

  1. Go to github.com and sign in
  2. Click the "+" icon in the top right corner
  3. Select "New repository"
  4. Choose a repository name (e.g., ai-x-network)
  5. Add a description: "AI X Network - Modern Next.js website"
  6. Choose visibility:
    • Public: Anyone can see this repository
    • Private: Only you and collaborators can see it
  7. Don't initialize with README, .gitignore, or license (we already have these)
  8. Click "Create repository"

2. Push Your Code to GitHub

After creating the repository, run these commands in your project root:

# Add the GitHub repository as remote origin
git remote add origin https://github.com/YOUR_USERNAME/YOUR_REPOSITORY_NAME.git

# Push your code to GitHub
git branch -M main
git push -u origin main

Replace YOUR_USERNAME and YOUR_REPOSITORY_NAME with your actual GitHub username and repository name.

3. Verify Upload

  • Go to your GitHub repository page
  • You should see all your project files
  • Check that the .env file is NOT uploaded (it should be in .gitignore)

πŸ”’ Security Notes

  • Never commit .env files to version control
  • Always use environment variables for sensitive data
  • Generate strong secrets for production
  • Use HTTPS in production
  • Keep dependencies updated regularly

πŸ§ͺ Testing Your Deployment

After deployment, test these features:

  1. Homepage loads correctly
  2. Navigation works on all pages
  3. Contact forms submit (check database)
  4. Email notifications work (if configured)
  5. Authentication flows work properly
  6. Responsive design on mobile devices

πŸ“ Project Structure

aixnetwork/
β”œβ”€β”€ app/                    # Next.js application
β”‚   β”œβ”€β”€ components/         # React components
β”‚   β”œβ”€β”€ pages/             # Next.js pages
β”‚   β”œβ”€β”€ styles/            # CSS and styling
β”‚   β”œβ”€β”€ public/            # Static assets
β”‚   β”œβ”€β”€ .env               # Environment variables (not in git)
β”‚   β”œβ”€β”€ package.json       # Dependencies
β”‚   └── next.config.js     # Next.js configuration
β”œβ”€β”€ .gitignore             # Git ignore rules
β”œβ”€β”€ README.md              # This file
└── DEPLOYMENT.md          # Detailed deployment guide

🀝 Contributing

  1. Fork the repository
  2. Create a feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

πŸ“„ License

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

πŸ†˜ Support

If you encounter any issues:

  1. Check the Issues page
  2. Create a new issue with detailed description
  3. Include error messages and steps to reproduce

πŸ”— Links

  • Live Site: [Your deployed URL]
  • Documentation: [Link to detailed docs]
  • API Reference: [Link to API docs if applicable]

Made with ❀️ for AI X Network

Popular repositories Loading

  1. meeting-minutes meeting-minutes Public

    Forked from Zackriya-Solutions/meeting-minutes

    An open source Live Ai based meeting note taker and minutes generator that can completely run in your Local device (Mac OS support is added. Will add windows and linux support soon)

    C++ 1

  2. bolt.diy bolt.diy Public template

    Forked from stackblitz-labs/bolt.diy

    Prompt, run, edit, and deploy full-stack web applications using any LLM you want!

    TypeScript

  3. srcbook srcbook Public

    Forked from srcbookdev/srcbook

    TypeScript-centric app development platform: notebook and AI app builder

    TypeScript

  4. llamacoder llamacoder Public

    Forked from Nutlope/llamacoder

    Open source Claude Artifacts – built with Llama 3.1 405B

    TypeScript

  5. laravel-crm laravel-crm Public

    Forked from krayin/laravel-crm

    Free & Opensource Laravel CRM solution for SMEs and Enterprises for complete customer lifecycle management.

    Blade

  6. 5-Day-Gen-AI-Intensive-Course-with-Google 5-Day-Gen-AI-Intensive-Course-with-Google Public

    Forked from ahmadi-analyst/5-Day-Gen-AI-Intensive-Course-with-Google

    This repository contains links and short descriptions to the resources used for the 5-Day Gen AI Intensive Course with Google