BiohazardVFX/biohazard-vfx
2
1
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Nicholai 2025-08-15 03:28:09 -06:00
parent 6be190bcf6
commit 97074d6468
1 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
README.md
View File

@ -4,11 +4,11 @@
This document details the complete modernization of the Biohazard VFX website from a static HTML/CSS/JavaScript site to a modern Next.js application with React, TypeScript, and a full content management system. This document details the complete modernization of the Biohazard VFX website from a static HTML/CSS/JavaScript site to a modern Next.js application with React, TypeScript, and a full content management system.
**Date**: August 7, 2025 **Date**: August 15, 2025
**Original Site**: Static HTML/CSS/JS in `/BiohazardVFX_Website` **Original Site**: Static HTML/CSS/JS in `/BiohazardVFX_Website`
**New Site**: Next.js app in `/BiohazardVFX_Website/nextjs-app` **New Site**: Next.js app in `/BiohazardVFX_Website/biohazard-vfx`
## 🚀 What Was Accomplished ## What Was Accomplished
### 1. **Complete Technology Stack Upgrade** ### 1. **Complete Technology Stack Upgrade**
@ -50,7 +50,7 @@ This document details the complete modernization of the Biohazard VFX website fr
- Preserved original dark theme aesthetic - Preserved original dark theme aesthetic
- Smooth animations and transitions - Smooth animations and transitions
- Mobile-responsive design - Mobile-responsive design
- Improved navigation with blog section - Improved navigation with left-side slide-in menu
- Interactive team menu overlay - Interactive team menu overlay
### 3. **Technical Improvements** ### 3. **Technical Improvements**
@ -74,10 +74,10 @@ This document details the complete modernization of the Biohazard VFX website fr
- ARIA labels for accessibility - ARIA labels for accessibility
- Semantic HTML structure - Semantic HTML structure
## 📁 Project Structure ## Project Structure
``` ```
nextjs-app/ biohazard-vfx/
├── src/ ├── src/
│ ├── app/ # Next.js App Router pages │ ├── app/ # Next.js App Router pages
│ │ ├── admin/ # Admin dashboard pages │ │ ├── admin/ # Admin dashboard pages
@ -95,9 +95,9 @@ nextjs-app/
│ │ ├── layout.tsx # Root layout │ │ ├── layout.tsx # Root layout
│ │ └── page.tsx # Homepage │ │ └── page.tsx # Homepage
│ ├── components/ # Reusable React components │ ├── components/ # Reusable React components
│ │ ├── Navigation.tsx # Site navigation │ │ ├── Navigation.tsx # Site navigation (updated)
│ │ ├── HeroSection.tsx # Hero video section │ │ ├── HeroSection.tsx # Hero video section
│ │ ├── ProjectGrid.tsx # Project portfolio grid │ │ ├── ProjectsGrid.tsx # Project portfolio grid
│ │ ├── TeamMenu.tsx # Team overlay menu │ │ ├── TeamMenu.tsx # Team overlay menu
│ │ ├── Footer.tsx # Site footer │ │ ├── Footer.tsx # Site footer
│ │ └── Providers.tsx # Auth providers │ │ └── Providers.tsx # Auth providers
@ -127,15 +127,15 @@ nextjs-app/
### Starting the Development Server ### Starting the Development Server
```bash ```bash
cd /home/Nicholai/Nextcloud/Dev/BiohazardVFX_Website/nextjs-app cd /home/Nicholai/Nextcloud/Dev/BiohazardVFX_Website/biohazard-vfx
npm run dev npm run dev
``` ```
The site will be available at: http://localhost:3005 The site will be available at: http://localhost:3000
### Accessing the Admin Dashboard ### Accessing the Admin Dashboard
1. **Navigate to**: http://localhost:3005/admin/login 1. **Navigate to**: http://localhost:3000/admin/login
2. **Login with**: 2. **Login with**:
- Email: `admin@biohazardvfx.com` - Email: `admin@biohazardvfx.com`
- Password: `admin123` - Password: `admin123`
@ -166,7 +166,7 @@ npm run build
npm start npm start
``` ```
## 🗺️ Site Map ## Site Map
### Public Pages ### Public Pages
- **/** - Homepage with hero video, about, projects, team, crew sections - **/** - Homepage with hero video, about, projects, team, crew sections
@ -205,6 +205,15 @@ All 8 projects from the original site have been preserved:
- FAQ data from `written/faq.json` - FAQ data from `written/faq.json`
- All project credits and info files maintained - All project credits and info files maintained
## Recent Improvements
### Navigation System (August 2025)
- **Redesigned Navigation**: Replaced the full-screen overlay menu with a sleek left-side sliding panel
- **Less Intrusive**: The new navigation slides in from the left and only covers a portion of the screen
- **Improved UX**: Added backdrop blur, outside click detection, and keyboard escape functionality
- **Consistent Design**: Matches the site's dark theme with subtle borders and proper spacing
- **Better Mobile Experience**: More compact and easier to use on mobile devices
## 📋 What Needs to Be Done Next ## 📋 What Needs to Be Done Next
### High Priority ### High Priority
@ -274,7 +283,7 @@ All 8 projects from the original site have been preserved:
- Create API documentation - Create API documentation
- Write deployment guide - Write deployment guide
## 🚀 Deployment Considerations ## Deployment Considerations
### Environment Variables ### Environment Variables
Create a `.env.production` file with: Create a `.env.production` file with:
@ -300,7 +309,7 @@ WEB3FORMS_ACCESS_KEY="your-web3forms-key"
- Optimize image delivery - Optimize image delivery
- Implement proper caching headers - Implement proper caching headers
## 🎯 Summary ## Summary
The Biohazard VFX website has been successfully modernized from a static site to a dynamic, database-driven Next.js application. The new architecture provides: The Biohazard VFX website has been successfully modernized from a static site to a dynamic, database-driven Next.js application. The new architecture provides: