{"id":30702396,"url":"https://github.com/the-lone-druid/space-portfolio","last_synced_at":"2026-05-07T10:33:38.923Z","repository":{"id":311182215,"uuid":"1042729093","full_name":"The-Lone-Druid/space-portfolio","owner":"The-Lone-Druid","description":"A stellar portfolio website showcasing projects, skills, and services with an immersive space-themed interface, built using Next.js 15, TypeScript, and Tailwind CSS v4 for a responsive, high-performance experience.","archived":false,"fork":false,"pushed_at":"2025-08-31T05:57:14.000Z","size":2015,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-08-31T07:19:19.590Z","etag":null,"topics":["accessibilty","nextjs","portfolio","react","responsive-design","seo-optimized","space-theme","typescript","web-development"],"latest_commit_sha":null,"homepage":"https://zahidshaikh.space","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/The-Lone-Druid.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-08-22T13:33:29.000Z","updated_at":"2025-08-31T05:57:18.000Z","dependencies_parsed_at":"2025-08-22T17:50:56.006Z","dependency_job_id":"bdba089e-fab4-4576-bb10-eab0dbe2c404","html_url":"https://github.com/The-Lone-Druid/space-portfolio","commit_stats":null,"previous_names":["the-lone-druid/space-portfolio"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/The-Lone-Druid/space-portfolio","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/The-Lone-Druid%2Fspace-portfolio","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/The-Lone-Druid%2Fspace-portfolio/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/The-Lone-Druid%2Fspace-portfolio/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/The-Lone-Druid%2Fspace-portfolio/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/The-Lone-Druid","download_url":"https://codeload.github.com/The-Lone-Druid/space-portfolio/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/The-Lone-Druid%2Fspace-portfolio/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":273302981,"owners_count":25081345,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-02T02:00:09.530Z","response_time":77,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["accessibilty","nextjs","portfolio","react","responsive-design","seo-optimized","space-theme","typescript","web-development"],"created_at":"2025-09-02T15:19:34.213Z","updated_at":"2026-05-07T10:33:38.915Z","avatar_url":"https://github.com/The-Lone-Druid.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🚀 Space Portfolio\n\nA sophisticated, space-themed personal portfolio website built with cutting-edge technologies. Features a comprehensive admin dashboard, advanced caching strategies, and beautiful cosmic design elements.\n\n![Next.js](https://img.shields.io/badge/Next.js-15.5-black?style=for-the-badge\u0026logo=next.js)\n![TypeScript](https://img.shields.io/badge/TypeScript-5.0-blue?style=for-the-badge\u0026logo=typescript)\n![Tailwind CSS](https://img.shields.io/badge/Tailwind-4.0-06B6D4?style=for-the-badge\u0026logo=tailwindcss)\n![Prisma](https://img.shields.io/badge/Prisma-6.14-2D3748?style=for-the-badge\u0026logo=prisma)\n![PostgreSQL](https://img.shields.io/badge/PostgreSQL-14+-336791?style=for-the-badge\u0026logo=postgresql)\n\n## ✨ Key Features\n\n### 🎯 Core Capabilities\n\n- **🌌 Space-Themed Design** - Cosmic animations, stellar gradients, and space-inspired UI\n- **⚡ Next.js 15 with Turbopack** - Blazing fast development and production builds\n- **🔐 Secure Authentication** - NextAuth.js with role-based access control\n- **📊 Admin Dashboard** - Complete content management system\n- **🗄️ PostgreSQL + Prisma** - Type-safe database operations with optimized queries\n- **📱 Responsive Design** - Mobile-first approach with modern layouts\n\n### 🚀 Advanced Features\n\n- **💾 ISR Cache Control** - Advanced caching with tagged invalidation\n- **📈 Portfolio Analytics** - Real-time completion tracking and statistics\n- **🎨 shadcn/ui Components** - Consistent design system with New York style\n- **📧 Email Integration** - Password reset and notifications via Resend\n- **🔄 Real-time Updates** - Dynamic content with optimistic UI updates\n- **🎭 Theme System** - Dark/light mode with seamless transitions\n\n## 🏗️ Tech Stack\n\n### Frontend \u0026 UI\n\n- **[Next.js 15.5](https://nextjs.org)** - App Router with Turbopack for lightning-fast builds\n- **[React 19](https://react.dev)** - Latest features with concurrent rendering\n- **[TypeScript 5](https://typescriptlang.org)** - Strict mode with path aliases (`@/*`)\n- **[Tailwind CSS 4](https://tailwindcss.com)** - Utility-first styling with CSS variables\n- **[shadcn/ui](https://ui.shadcn.com)** - Beautiful components (New York style)\n- **[Framer Motion](https://framer.com/motion)** - Smooth animations and page transitions\n\n### Backend \u0026 Data\n\n- **[NextAuth.js 4.24](https://next-auth.js.org)** - Secure authentication with Prisma adapter\n- **[PostgreSQL 14+](https://postgresql.org)** - Robust relational database\n- **[Prisma ORM 6.14](https://prisma.io)** - Type-safe database operations\n- **[Zod](https://zod.dev)** - Runtime validation and type safety\n- **[Resend](https://resend.com)** - Modern email delivery service\n\n### Development \u0026 Quality\n\n- **[Turbopack](https://turbo.build)** - Next-generation bundler for fast development\n- **[ESLint + Prettier](https://eslint.org)** - Code quality with auto-formatting\n- **[Husky](https://typicode.github.io/husky)** - Git hooks with commit validation\n- **[Standard Version](https://github.com/conventional-changelog/standard-version)** - Automated changelog and versioning\n\n## 📋 Prerequisites\n\nBefore you begin, ensure you have:\n\n- **Node.js 18+** - [Download here](https://nodejs.org)\n- **PostgreSQL 14+** - [Download here](https://postgresql.org/download) or use cloud provider\n- **npm/yarn/pnpm** - Package manager (npm comes with Node.js)\n- **Git** - [Download here](https://git-scm.com)\n\n## 🚀 Quick Start\n\n### 1. Clone \u0026 Install\n\n```bash\n# Clone the repository\ngit clone https://github.com/yourusername/space-portfolio.git\ncd space-portfolio\n\n# Install dependencies\nnpm install\n```\n\n### 2. Environment Setup\n\nCreate a `.env.local` file in the root directory:\n\n```bash\n# Copy the example environment file\ncp .env.example .env.local\n```\n\nEdit `.env.local` with your configuration:\n\n```env\n# Database Configuration\nDATABASE_URL=\"postgresql://username:password@localhost:5432/space_portfolio\"\n\n# Authentication (Generate a secure secret: openssl rand -base64 32)\nNEXTAUTH_SECRET=\"your-super-secret-32-character-key-here\"\nNEXTAUTH_URL=\"http://localhost:3000\"\n\n# Admin Account (for initial setup)\nADMIN_EMAIL=\"admin@yourdomain.com\"\nADMIN_PASSWORD=\"your-secure-admin-password\"\n\n# Email Configuration (for password reset)\nEMAIL_SERVICE=\"console\"  # Use \"console\" for development, \"resend\" for production\nEMAIL_FROM=\"noreply@yourdomain.com\"\nRESEND_API_KEY=\"re_your_resend_api_key_here\"  # Only needed if using Resend\n\n# Site Configuration\nSITE_URL=\"http://localhost:3000\"\nSITE_NAME=\"Space Portfolio\"\n```\n\n### 3. Database Setup\n\n```bash\n# Generate Prisma client\nnpm run db:generate\n\n# Create and run database migrations\nnpm run db:migrate\n\n# Optional: Seed with sample data\nnpm run db:seed\n```\n\n### 4. Start Development\n\n```bash\n# Start the development server\nnpm run dev\n```\n\nVisit [http://localhost:3000](http://localhost:3000) to see your portfolio! 🎉\n\n### 5. Access Admin Dashboard\n\n1. **Create Account**: Go to `/auth/signin` and create your account\n2. **Set Admin Role**: Update your user role in the database:\n   ```sql\n   -- Connect to your database and run:\n   UPDATE \"users\" SET role = 'ADMIN' WHERE email = 'your-email@example.com';\n   ```\n3. **Access Dashboard**: Navigate to `/dashboard` to manage your portfolio content\n\n## 📚 Available Scripts\n\n### Development Commands\n\n| Command              | Description                             |\n| -------------------- | --------------------------------------- |\n| `npm run dev`        | Start development server with Turbopack |\n| `npm run build`      | Build for production                    |\n| `npm run start`      | Start production server                 |\n| `npm run type-check` | Run TypeScript type checking            |\n\n### Code Quality Commands\n\n| Command                | Description                         |\n| ---------------------- | ----------------------------------- |\n| `npm run lint`         | Run ESLint checks                   |\n| `npm run lint:fix`     | Fix ESLint issues automatically     |\n| `npm run format`       | Format code with Prettier           |\n| `npm run format:check` | Check if code is properly formatted |\n\n### Database Commands\n\n| Command               | Description                       |\n| --------------------- | --------------------------------- |\n| `npm run db:generate` | Generate Prisma client            |\n| `npm run db:migrate`  | Run database migrations           |\n| `npm run db:push`     | Push schema changes (development) |\n| `npm run db:studio`   | Open Prisma Studio (database GUI) |\n| `npm run db:seed`     | Seed database with sample data    |\n| `npm run db:reset`    | ⚠️ Reset database (destructive)   |\n\n### Release Commands\n\n| Command                 | Description                    |\n| ----------------------- | ------------------------------ |\n| `npm run release`       | Auto-bump version from commits |\n| `npm run release:minor` | Force minor version bump       |\n| `npm run release:major` | Force major version bump       |\n| `npm run release:patch` | Force patch version bump       |\n\n## 📁 Project Structure\n\n```\nsrc/\n├── app/                     # Next.js 15 App Router\n│   ├── api/                # API routes with security wrappers\n│   │   ├── auth/           # Authentication endpoints\n│   │   ├── dashboard/      # Protected admin APIs\n│   │   ├── hero/           # Public portfolio APIs\n│   │   └── personal-info/  # Portfolio data APIs\n│   ├── auth/               # Authentication pages\n│   │   ├── signin/         # Sign in page\n│   │   ├── signup/         # Sign up page\n│   │   └── unauthorized/   # Access denied page\n│   ├── dashboard/          # Protected admin interface\n│   │   ├── projects/       # Project management\n│   │   ├── services/       # Service management\n│   │   ├── skills/         # Skills management\n│   │   └── settings/       # Admin settings\n│   ├── globals.css         # Global styles \u0026 CSS variables\n│   ├── layout.tsx          # Root layout with providers\n│   └── page.tsx            # Homepage (portfolio display)\n├── components/             # React components by category\n│   ├── ui/                 # shadcn/ui components ONLY\n│   ├── animations/         # Space-themed animations\n│   ├── auth/               # Authentication components\n│   ├── cards/              # Reusable card components\n│   ├── dashboard/          # Dashboard-specific components\n│   ├── forms/              # Form components with validation\n│   ├── sections/           # Page section components\n│   ├── seo/                # SEO and meta components\n│   ├── shared/             # Shared utility components\n│   └── theme/              # Theme switching components\n├── hooks/                  # Custom React hooks\n│   ├── use-auth.ts         # Authentication state\n│   ├── use-dashboard-data.ts # Dashboard data fetching\n│   ├── use-portfolio-data.ts # Portfolio data fetching\n│   └── use-*.ts            # Feature-specific hooks\n├── lib/                    # Utility libraries \u0026 config\n│   ├── auth.ts             # NextAuth configuration\n│   ├── auth-utils.ts       # Authentication helpers\n│   ├── db.ts               # Database utilities\n│   ├── email.ts            # Email service (Resend)\n│   ├── rate-limit.ts       # API rate limiting\n│   ├── utils.ts            # General utilities (cn, etc.)\n│   └── validations.ts      # Zod validation schemas\n├── services/               # Business logic layer (server-side)\n│   ├── dashboard-service.ts     # Dashboard aggregations\n│   ├── personal-info-service.ts # Personal data management\n│   ├── portfolio-service.ts     # Portfolio data fetching\n│   ├── projects-service.ts      # Project management\n│   ├── services-service.ts      # Service offerings\n│   └── skills-service.ts        # Skills management\n└── types/                  # TypeScript definitions\n    ├── auth.ts             # Authentication types\n    ├── index.ts            # Global types \u0026 API responses\n    └── *.ts                # Feature-specific types\n```\n\n## 🔐 Authentication \u0026 Security\n\n### User Roles \u0026 Access Control\n\n| Role       | Access Level       | Permissions                                              |\n| ---------- | ------------------ | -------------------------------------------------------- |\n| **ADMIN**  | Full Access        | All dashboard features, user management, system settings |\n| **EDITOR** | Content Management | Create/edit portfolio content, limited admin access      |\n| **USER**   | Public Access      | View portfolio only                                      |\n\n### Setting Up Admin Access\n\n#### Method 1: Database Update (Recommended)\n\n```sql\n-- Connect to your PostgreSQL database\nUPDATE \"users\" SET role = 'ADMIN' WHERE email = 'your-email@example.com';\n```\n\n#### Method 2: Using Prisma Studio\n\n```bash\n# Open Prisma Studio\nnpm run db:studio\n\n# Navigate to Users table\n# Find your user record\n# Change role field from 'USER' to 'ADMIN'\n# Save changes\n```\n\n### Protected Routes\n\n| Route Pattern      | Required Role | Description             |\n| ------------------ | ------------- | ----------------------- |\n| `/dashboard/*`     | ADMIN/EDITOR  | Admin dashboard access  |\n| `/api/dashboard/*` | ADMIN/EDITOR  | Protected API endpoints |\n| `/auth/*`          | Public        | Authentication pages    |\n| `/*`               | Public        | Portfolio display       |\n\n### Security Features\n\n- **JWT-based Authentication** - Secure session management\n- **Role-based Access Control** - Granular permission system\n- **Rate Limiting** - API abuse prevention\n- **CSRF Protection** - Cross-site request forgery prevention\n- **Secure Headers** - Security best practices implemented\n- **Password Hashing** - bcryptjs for secure password storage\n\n## 📧 Email Configuration\n\n### Development Setup (Console Logging)\n\nFor development, emails are logged to the console:\n\n```env\nEMAIL_SERVICE=\"console\"\nEMAIL_FROM=\"noreply@localhost.com\"\n```\n\n### Production Setup (Resend)\n\nFor production, configure [Resend](https://resend.com) for reliable email delivery:\n\n1. **Create Resend Account**: Sign up at [resend.com](https://resend.com)\n2. **Verify Domain**: Add and verify your sending domain\n3. **Get API Key**: Generate an API key from settings\n4. **Configure Environment**:\n\n```env\nEMAIL_SERVICE=\"resend\"\nEMAIL_FROM=\"noreply@yourdomain.com\"  # Must match verified domain\nRESEND_API_KEY=\"re_your_api_key_here\"\n```\n\n### Email Features\n\n- **Password Reset** - Secure token-based password recovery\n- **Welcome Emails** - Onboarding for new users\n- **Security Alerts** - Login notifications and security events\n- **Beautiful Templates** - Space-themed HTML email designs\n\n### Testing Email Setup\n\n1. Access `/dashboard/settings` as admin\n2. Use the \"Email Configuration Test\" section\n3. Send test emails to verify setup\n4. Check Resend dashboard for delivery status\n\n## 🚀 Deployment Guide\n\n### Prerequisites for Production\n\n- **PostgreSQL Database** - Cloud provider (Vercel Postgres, Supabase, Railway, etc.)\n- **Domain Name** - For email sending and OAuth callbacks\n- **Resend Account** - For email functionality (recommended)\n\n### Environment Variables (Production)\n\n```env\n# Database (Production)\nDATABASE_URL=\"postgresql://user:password@host:5432/database?sslmode=require\"\n\n# NextAuth (Production)\nNEXTAUTH_URL=\"https://yourdomain.com\"\nNEXTAUTH_SECRET=\"super-secure-secret-at-least-32-characters-long\"\n\n# Email (Production)\nEMAIL_SERVICE=\"resend\"\nEMAIL_FROM=\"noreply@yourdomain.com\"\nRESEND_API_KEY=\"re_your_production_api_key\"\n\n# Admin Account\nADMIN_EMAIL=\"admin@yourdomain.com\"\nADMIN_PASSWORD=\"secure-admin-password\"\n\n# Site Configuration\nSITE_URL=\"https://yourdomain.com\"\nSITE_NAME=\"Your Portfolio Name\"\n```\n\n### Deployment Steps\n\n#### 1. Database Setup\n\n**Option A: Vercel Postgres**\n\n```bash\n# Install Vercel CLI\nnpm i -g vercel\n\n# Create Postgres database\nvercel postgres create your-portfolio-db\n\n# Get connection string from Vercel dashboard\n```\n\n**Option B: Supabase**\n\n```bash\n# Create project at supabase.com\n# Copy PostgreSQL connection string\n# Enable row level security if needed\n```\n\n**Option C: Railway**\n\n```bash\n# Create project at railway.app\n# Add PostgreSQL service\n# Copy connection string from settings\n```\n\n#### 2. Build \u0026 Deploy\n\n**Vercel (Recommended)**\n\n```bash\n# Install Vercel CLI\nnpm i -g vercel\n\n# Deploy to Vercel\nvercel\n\n# Set environment variables in Vercel dashboard\n# Deploy again to apply changes\nvercel --prod\n```\n\n**Netlify**\n\n```bash\n# Build the project\nnpm run build\n\n# Deploy to Netlify\nnpm i -g netlify-cli\nnetlify deploy --prod --dir=.next\n```\n\n**Self-hosted**\n\n```bash\n# Build for production\nnpm run build\n\n# Start production server\nnpm start\n\n# Or use PM2 for process management\nnpm i -g pm2\npm2 start npm --name \"space-portfolio\" -- start\n```\n\n#### 3. Post-Deployment Setup\n\n1. **Run Migrations**:\n\n   ```bash\n   # SSH into your server or use your platform's console\n   npm run db:migrate\n   ```\n\n2. **Create Admin User**:\n   - Visit `/auth/signin` on your live site\n   - Create your admin account\n   - Update role in database to 'ADMIN'\n\n3. **Test Email Functionality**:\n   - Go to `/dashboard/settings`\n   - Use email test feature\n   - Verify emails are being delivered\n\n### Performance Optimizations\n\n- **Database Connection Pooling** - Configure for production load\n- **CDN Integration** - Leverage Vercel Edge Network or CloudFlare\n- **Image Optimization** - Automatic WebP/AVIF conversion\n- **Caching Strategy** - ISR with tagged invalidation\n- **Bundle Analysis** - Monitor and optimize bundle size\n\n## 🎨 Customization Guide\n\n### Theming \u0026 Design\n\n#### Color Scheme\n\nThe space theme uses CSS variables for easy customization:\n\n```css\n/* src/app/globals.css */\n:root {\n  --space-cosmic: 230 35% 7%; /* Deep space blue */\n  --space-accent: 200 98% 39%; /* Bright cosmic blue */\n  --space-gold: 45 93% 58%; /* Golden nebula */\n  --space-purple: 280 100% 70%; /* Cosmic purple */\n}\n```\n\n#### Custom Components\n\nCreate new components following the established patterns:\n\n```typescript\n// components/custom/my-component.tsx\nimport { cn } from '@/lib/utils'\n\ninterface MyComponentProps {\n  variant?: 'cosmic' | 'stellar' | 'default'\n  className?: string\n  children: React.ReactNode\n}\n\nexport function MyComponent({\n  variant = 'default',\n  className,\n  children,\n  ...props\n}: MyComponentProps) {\n  return (\n    \u003cdiv\n      className={cn(\n        'base-styles',\n        variant === 'cosmic' \u0026\u0026 'glass-cosmic',\n        variant === 'stellar' \u0026\u0026 'gradient-stellar',\n        className\n      )}\n      {...props}\n    \u003e\n      {children}\n    \u003c/div\u003e\n  )\n}\n```\n\n### Content Management\n\n#### Adding New Portfolio Sections\n\n1. **Update Database Schema**:\n\n   ```prisma\n   // prisma/schema.prisma\n   model NewSection {\n     id        String   @id @default(cuid())\n     title     String\n     content   String\n     isActive  Boolean  @default(true)\n     createdAt DateTime @default(now())\n     updatedAt DateTime @updatedAt\n\n     @@map(\"new_sections\")\n   }\n   ```\n\n2. **Create Service Layer**:\n\n   ```typescript\n   // src/services/new-section-service.ts\n   import { prisma } from '@/lib/prisma'\n   import { unstable_cache } from 'next/cache'\n\n   export const getNewSectionsServer = unstable_cache(\n     async () =\u003e {\n       return await prisma.newSection.findMany({\n         where: { isActive: true },\n         orderBy: { createdAt: 'desc' },\n       })\n     },\n     ['new-sections'],\n     {\n       tags: ['new-sections'],\n       revalidate: 60,\n     }\n   )\n   ```\n\n3. **Add API Routes**:\n\n   ```typescript\n   // src/app/api/new-sections/route.ts\n   import { publicApiRoute } from '@/lib/auth-utils'\n   import { getNewSectionsServer } from '@/services/new-section-service'\n\n   export const GET = publicApiRoute(async () =\u003e {\n     const sections = await getNewSectionsServer()\n     return NextResponse.json({ success: true, data: sections })\n   })\n   ```\n\n4. **Create Dashboard Interface**:\n\n   ```typescript\n   // src/app/dashboard/new-sections/page.tsx\n   import { NewSectionsList } from '@/components/dashboard/new-sections-list'\n   import { getNewSectionsServer } from '@/services/new-section-service'\n\n   export default async function NewSectionsPage() {\n     const sections = await getNewSectionsServer()\n\n     return (\n       \u003cdiv className=\"space-y-6\"\u003e\n         \u003ch1\u003eManage New Sections\u003c/h1\u003e\n         \u003cNewSectionsList sections={sections} /\u003e\n       \u003c/div\u003e\n     )\n   }\n   ```\n\n## 🛠️ Development Workflow\n\n### Git Workflow \u0026 Conventional Commits\n\nThis project uses conventional commits for automated versioning:\n\n```bash\n# Feature development\ngit checkout -b feature/portfolio-analytics\ngit commit -m \"feat: add portfolio completion analytics\"\n\n# Bug fixes\ngit commit -m \"fix: resolve dashboard loading issue\"\n\n# Documentation\ngit commit -m \"docs: update deployment guide\"\n\n# Styling changes\ngit commit -m \"style: improve mobile responsiveness\"\n\n# Refactoring\ngit commit -m \"refactor: optimize database queries\"\n```\n\n### Commit Types\n\n| Type       | Description      | Example                            |\n| ---------- | ---------------- | ---------------------------------- |\n| `feat`     | New feature      | `feat: add project filtering`      |\n| `fix`      | Bug fix          | `fix: resolve email sending issue` |\n| `docs`     | Documentation    | `docs: update setup guide`         |\n| `style`    | Code style       | `style: format with prettier`      |\n| `refactor` | Code refactoring | `refactor: extract auth logic`     |\n| `perf`     | Performance      | `perf: optimize image loading`     |\n| `test`     | Testing          | `test: add authentication tests`   |\n| `chore`    | Maintenance      | `chore: update dependencies`       |\n\n### Automated Quality Checks\n\nGit hooks automatically run quality checks:\n\n- **Pre-commit**: ESLint + Prettier on staged files\n- **Commit-msg**: Conventional commit format validation\n- **Pre-push**: TypeScript compilation check\n\n### Release Process\n\n```bash\n# Automated version bumping based on conventional commits\nnpm run release        # Auto-detect version bump\nnpm run release:minor  # Force minor version (1.0.0 → 1.1.0)\nnpm run release:major  # Force major version (1.0.0 → 2.0.0)\nnpm run release:patch  # Force patch version (1.0.0 → 1.0.1)\n```\n\n### VS Code Integration\n\nThe project includes VS Code configuration for optimal development:\n\n- **Auto-format on save** with Prettier\n- **ESLint integration** with auto-fix\n- **TypeScript IntelliSense** with path aliases\n- **Debugging configuration** for Next.js\n- **Recommended extensions** for best experience\n\n## 🐛 Troubleshooting\n\n### Common Issues \u0026 Solutions\n\n#### Database Connection Issues\n\n**Problem**: `Error: Can't reach database server`\n\n**Solutions**:\n\n```bash\n# Check if PostgreSQL is running\nsudo service postgresql status\n\n# Verify connection string format\nDATABASE_URL=\"postgresql://username:password@localhost:5432/database_name\"\n\n# Test connection with psql\npsql $DATABASE_URL\n\n# Reset Prisma client\nnpm run db:generate\n```\n\n#### Authentication Problems\n\n**Problem**: `NextAuth session not working`\n\n**Solutions**:\n\n```bash\n# Verify environment variables\necho $NEXTAUTH_SECRET\necho $NEXTAUTH_URL\n\n# Clear browser cookies and localStorage\n# Check if domain matches NEXTAUTH_URL\n\n# Regenerate NextAuth secret\nopenssl rand -base64 32\n```\n\n#### Build Failures\n\n**Problem**: `Type errors during build`\n\n**Solutions**:\n\n```bash\n# Check TypeScript errors\nnpm run type-check\n\n# Regenerate Prisma types\nnpm run db:generate\n\n# Clear Next.js cache\nrm -rf .next \u0026\u0026 npm run build\n```\n\n#### Email Not Sending\n\n**Problem**: `Emails not being delivered`\n\n**Solutions**:\n\n```bash\n# Check Resend API key validity\n# Verify sending domain is verified in Resend\n# Check email service configuration:\n\nEMAIL_SERVICE=\"resend\"  # Not \"console\"\nEMAIL_FROM=\"noreply@verified-domain.com\"\nRESEND_API_KEY=\"re_valid_api_key\"\n```\n\n### Performance Issues\n\n**Problem**: `Slow page loading`\n\n**Solutions**:\n\n```bash\n# Check database query performance\nnpm run db:studio\n\n# Analyze bundle size\nnpm run build \u0026\u0026 npx @next/bundle-analyzer\n\n# Enable caching\n# Check ISR cache configuration in services\n```\n\n### Getting Help\n\nIf you encounter issues not covered here:\n\n1. **Check the logs**: Browser console and server logs\n2. **Review environment variables**: Ensure all required vars are set\n3. **Verify database state**: Use Prisma Studio to inspect data\n4. **Test in development**: Ensure issues persist across environments\n5. **Create an issue**: Include error messages, environment details, and steps to reproduce\n\n## 🤝 Contributing\n\nWe welcome contributions! Please follow these guidelines:\n\n### Development Setup\n\n1. **Fork the repository**\n2. **Clone your fork**: `git clone \u003cyour-fork-url\u003e`\n3. **Install dependencies**: `npm install`\n4. **Create feature branch**: `git checkout -b feature/amazing-feature`\n5. **Make your changes** following our coding standards\n6. **Commit with conventional format**: `git commit -m \"feat: add amazing feature\"`\n7. **Push to your fork**: `git push origin feature/amazing-feature`\n8. **Create Pull Request** with detailed description\n\n### Code Standards\n\n- **TypeScript**: Use strict typing, avoid `any`\n- **Components**: Follow established patterns in `src/components/`\n- **API Routes**: Use security wrappers from `@/lib/auth-utils`\n- **Database**: Create migrations for schema changes\n- **Testing**: Add tests for new features\n- **Documentation**: Update README for significant changes\n\n### Review Process\n\n1. **Automated Checks**: All PRs must pass ESLint, Prettier, and TypeScript checks\n2. **Manual Review**: Code review focusing on architecture and security\n3. **Testing**: Verify changes work in development environment\n4. **Documentation**: Ensure changes are documented appropriately\n\n## 📄 License\n\nThis project is licensed under the **MIT License**. See the [LICENSE](LICENSE) file for details.\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n**🚀 Built with ❤️ for the cosmos 🌌**\n\n_Ready to launch your space-themed portfolio? Follow the setup guide above and start exploring the digital universe!_\n\n[⭐ Star this repo](https://github.com/yourusername/space-portfolio) if you found it helpful!\n\n\u003c/div\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthe-lone-druid%2Fspace-portfolio","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthe-lone-druid%2Fspace-portfolio","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthe-lone-druid%2Fspace-portfolio/lists"}