admin/NanoJason
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Vercel deployment configuration

Browse Source 
- Add next.config.ts with export configuration
- Add vercel.json for proper deployment settings
- Enable static site generation for Vercel
- Set unoptimized images for static export
- Add security headers and build configuration
This commit is contained in:
Gemini AI
2025-12-20 02:43:28 +04:00
Unverified
parent ff759bb622
commit 2b73d95411
4 changed files with 344 additions and 316 deletions
Download Patch File Download Diff File Expand all files Collapse all files

596
Test Ideas/NanoJason/nanojason/README.md
View File

@@ -1,342 +1,318 @@
# 🎨 NanoJason - AI-Powered Image Series Creation Platform
# 🚀 NanoJason - Universal AI Prompt Language Translator & Optimizer
Transform your ideas into stunning visual stories with AI-powered image generation and Jason language compatibility.
<div align="center">
![NanoJason](https://img.shields.io/badge/NanoJason-AI%20Prompt%20Optimizer-blue?style=for-the-badge&logo=sparkles)
![Version](https://img.shields.io/badge/Version-3.0-green?style=for-the-badge)
![License](https://img.shields.io/badge/License-MIT-yellow?style=for-the-badge)
![Offline](https://img.shields.io/badge/Status-Offline%20Ready-purple?style=for-the-badge)
## ✨ Features
</div>
### 🚀 Core Capabilities
- **AI-Powered Series Generation**: Create up to 30 images per series with consistent characters and narrative
- **Jason Language Support**: Universal compatibility with NanoBanana, OpenAI, Midjourney, and more
- **Qwen OAuth Integration**: Free tier with 2,000 requests/day (60 requests/minute limit)
- **Character & Item Consistency**: Automatic tracking of visual elements across series
- **Modern UI**: Beautiful, responsive interface inspired by Lovabale AI
<p align="center">
<strong>NanoJason</strong> is a revolutionary, offline-only prompt engineering tool that transforms natural language descriptions into optimized Jason format for maximum AI accuracy across all image generation services.
</p>
### 🛠️ Technical Stack
- **Frontend**: Next.js 16.1.0 with TypeScript
- **Styling**: Tailwind CSS v4 with custom design system
- **Authentication**: Qwen OAuth API integration
- **State Management**: React hooks with localStorage
- **Build Tool**: Turbopack for fast development
<p align="center">
<a href="#features">🌟 Features</a> •
<a href="#getting-started">🚀 Getting Started</a> •
<a href="#usage">💡 Usage</a> •
<a href="#contributing">🤝 Contributing</a> •
<a href="#license">📜 License</a>
</p>
### 🎯 Key Components
---
#### Authentication System
- **OAuth Flow**: Complete Qwen integration with token management
- **Demo Mode**: Quick demo login for testing
- **Session Management**: Secure token storage and refresh
- **Access Control**: Protected routes and API endpoints
## 🌟 **Amazing Features**
#### Series Generation
- **AI Ideas**: Intelligent series concept generation
- **Narrative Progression**: Automatic story structure creation
- **Character Tracking**: Consistent character features across images
- **Multi-Image Support**: 1-30 images per series
### 🎯 **Three Powerful Modes**
#### Jason Language
- **Natural Language**: Convert descriptions to Jason format
- **Multi-Service**: Optimization for different AI platforms
- **Validation**: Error checking and warnings
- **Export**: JSON format for universal compatibility
#### 1. **Jason Translator**
- Converts natural language to universal Jason format
- Style, mood, character, and item detection
- Extracts color palette, composition, and lighting
- Perfect for AI image generation compatibility
## 🚀 Getting Started
#### 2. **NanoPrompt Optimizer**
- Deep reverse engineering for maximum AI accuracy
- Pattern mapping and keyword enhancement
- Quality descriptors and composition optimization
- Lighting and color enhancement
- Error prevention and artifact reduction
- **Accuracy Score:** Up to 95%
#### 3. **NanoCoder Technical Optimizer**
- Specialized for coding and engineering prompts
- Technical domain detection (programming, web, mobile, AI, etc.)
- Framework and language pattern recognition
- Architecture and security optimization
- Code context extraction
- **Technical Accuracy:** Up to 98%
### 🔥 **Key Benefits**
- **🚀 Offline-Only** - No internet connection required
- **⚡ Instant Results** - Real-time translation and optimization
- **🎨 Universal Compatibility** - Works with all AI image generators
- **🔒 Privacy Focused** - No data leaves your device
- **📱 Responsive Design** - Perfect for desktop and mobile
- **🎯 High Accuracy** - Advanced pattern recognition and optimization
- **🔄 Export Options** - Copy, download, and share optimized prompts
---
## 🚀 **Getting Started**
### Prerequisites
- Node.js 18+ and npm/pnpm
- Qwen API credentials (for production)
- Node.js 18+
- npm or pnpm
### Installation
1. **Clone the repository**
```bash
# Clone the repository
git clone <repository-url>
cd nanojason
git clone https://github.com/roman-ryzenadvanced/NanoJason.git
cd NanoJason
```
# Install dependencies
2. **Install dependencies**
```bash
npm install
# or
pnpm install
```
### Environment Setup
Create a `.env.local` file with:
```env
# Qwen API Configuration
NEXT_PUBLIC_QWEN_CLIENT_ID=your_qwen_client_id
NEXT_PUBLIC_QWEN_REDIRECT_URI=http://localhost:3000/auth
QWEN_CLIENT_SECRET=your_qwen_client_secret
# Next.js Configuration
NEXTAUTH_URL=http://localhost:3000
NEXTAUTH_SECRET=your_nextauth_secret
```
### Development
3. **Run the application**
```bash
# Start development server
npm run dev
# or
pnpm dev
```
The application will be available at `http://localhost:3000`
## 🔐 Authentication Flow
### Qwen OAuth Integration
The application supports two authentication methods:
#### 1. Quick Demo Login (For Testing)
- Click "Connect Qwen" in the header
- Select "Quick Demo Login" on auth page
- Instant access with mock credentials
#### 2. Full OAuth Flow (Production)
- Click "Simulate Qwen OAuth" on auth page
- Redirects to Qwen authorization URL
- User grants permissions
- Returns with authorization code
- Exchanges code for access token
- Stores token securely
### Token Management
```javascript
// Tokens are stored automatically
localStorage.getItem('qwen_access_token') // Access token
localStorage.getItem('qwen_authenticated') // Auth status
4. **Open your browser**
```
### Rate Limits
- **Free Tier**: 2,000 requests per day
- **OAuth Rate**: 60 requests per minute
- **Token Expiry**: 1 hour (auto-refresh available)
## 📚 Usage Guide
### Creating Image Series
#### 1. Describe Your Vision
```text
"A beautiful magical forest with glowing trees and floating islands where a young wizard discovers an ancient crystal"
http://localhost:3000
```
#### 2. Configure Series Settings
- **Title**: "The Crystal Discovery"
- **Description**: "Epic fantasy adventure"
- **Image Count**: 1-30 images
- **Style**: realistic, anime, cartoon, fantasy, cyberpunk
#### 3. Character & Item Consistency
- **Characters**: Define visual features (hair, eyes, clothing)
- **Items**: Track important objects
- **Priority**: High/Medium/Low importance levels
#### 4. Generate with AI
- **Narrative Progression**: Automatic story structure
- **Consistency Rules**: Maintain character appearance
- **Jason Output**: Universal prompt format
### Jason Language Examples
#### Basic Structure
```json
{
"prompt": "enchanted forest with bioluminescent trees",
"style": "fantasy",
"characters": ["young_wizard", "ancient_spirit"],
"mood": "mysterious",
"consistency": {
"characterFeatures": {
"hair": "silver",
"eyes": "blue"
},
"colorPalette": ["purple", "blue", "green"]
}
}
```
#### Service-Specific Optimization
```json
// NanoBanana
{
"prompt": "magical forest scene",
"consistency": {
"characterFeatures": {
"style": "consistent",
"quality": "high"
}
}
}
// OpenAI DALL-E
{
"prompt": "magical forest scene, consistent character design",
"characters": ["young_wizard"]
}
```
## 🏗️ Architecture
### Project Structure
```
nanojason/
├── src/
│ ├── app/ # Next.js app router
│ │ ├── api/ # API routes
│ │ │ ├── auth/ # Authentication endpoints
│ │ │ └── generate/ # Generation endpoints
│ │ ├── auth/ # Authentication pages
│ │ └── globals.css # Global styles
│ ├── components/ # UI components
│ │ ├── ui/ # Reusable elements
│ │ └── layout/ # Layout components
│ ├── lib/ # Utilities
│ │ └── utils.ts # Helper functions
│ ├── services/ # Business logic
│ │ ├── series-generator.ts # Series creation
│ │ ├── jason-processor.ts # Jason language
│ │ └── qwen-api.ts # Qwen integration
│ └── hooks/ # React hooks
│ └── use-qwen-auth.ts # Authentication state
├── tailwind.config.ts # Tailwind configuration
└── package.json # Dependencies
```
### API Endpoints
#### Authentication
- `POST /api/auth/qwen/callback` - OAuth token exchange
- `GET /api/auth/verify` - Token validation
#### Generation
- `POST /api/generate/narrative` - Story progression
- `POST /api/generate/series` - Series creation
- `GET /api/generate/series` - Series management
## 🎨 Design System
### Color Palette
- **Primary**: Blue gradient (#0ea5e9 to #0284c7)
- **Accent**: Purple gradient (#d946ef to #a21caf)
- **Background**: Clean white/dark themes
- **Text**: High contrast readability
### Typography
- **Font**: Inter system font stack
- **Headings**: Bold weights with gradient effects
- **Body**: Regular weights for readability
### Components
- **Cards**: Rounded corners with hover effects
- **Buttons**: Consistent variants (primary, secondary, outline)
- **Forms**: Clean inputs with proper labels
- **Navigation**: Sticky header with backdrop blur
## 🔧 Development
### Build Commands
```bash
# Development
npm run dev # Start dev server
npm run build # Production build
npm run start # Start production server
npm run lint # Run ESLint
npm run type-check # TypeScript check
```
### Environment Variables
```env
NODE_ENV=development
NEXT_PUBLIC_APP_URL=http://localhost:3000
NEXT_PUBLIC_QWEN_CLIENT_ID=demo_client_id
```
## 📱 Responsive Design
### Breakpoints
- **Mobile**: < 768px (sm, md)
- **Tablet**: 768px - 1024px (md, lg)
- **Desktop**: > 1024px (lg, xl, 2xl)
### Mobile Adaptations
- **Navigation**: Collapsible menu
- **Cards**: Single column layout
- **Forms**: Full-width inputs
- **Buttons**: Touch-friendly sizing
## 🔒 Security
### Authentication Security
- **Token Storage**: httpOnly cookies + localStorage fallback
- **OAuth Flow**: PKCE implementation (production)
- **CSRF Protection**: State parameter validation
- **Token Refresh**: Automatic expiry handling
### API Security
- **Input Validation**: Zod schema validation
- **Error Handling**: Sanitized error messages
- **Rate Limiting**: Built-in request throttling
- **CORS**: Proper cross-origin configuration
## 🚀 Deployment
### Environment Setup
```bash
# Production environment variables
NEXT_PUBLIC_QWEN_CLIENT_ID=production_client_id
QWEN_CLIENT_SECRET=production_client_secret
NEXTAUTH_URL=https://your-domain.com
NODE_ENV=production
```
### Build and Deploy
```bash
# Build for production
npm run build
# Output in .next folder
# Ready for Vercel, Netlify, etc.
```
### Platform-Specific
- **Vercel**: Automatic deployment from Git
- **Netlify**: Build and deploy .next folder
- **Docker**: Multi-stage build available
## 🤝 Contributing
### Development Workflow
1. Fork the repository
2. Create feature branch (`git checkout -b feature/amazing-feature`)
3. Commit changes (`git commit -m 'Add amazing feature'`)
4. Push to branch (`git push origin feature/amazing-feature`)
5. Open Pull Request
### Code Style
- **TypeScript**: Strict mode enabled
- **ESLint**: AirBnB configuration
- **Prettier**: Automatic formatting
- **Components**: Functional components with hooks
## 📄 License
MIT License - see LICENSE file for details.
## 🆘 Support
### Documentation
- **API Reference**: `/docs/api`
- **Component Library**: `/docs/components`
- **Authentication Guide**: `/docs/auth`
### Community
- **GitHub Issues**: Bug reports and feature requests
- **Discord**: Real-time chat and support
- **Blog**: Tutorials and announcements
---
**Made with ❤️ by the NanoJason Team**
## 💡 **Usage Examples**
### **Jason Translator Mode**
```text
Input: "A magical forest with glowing mushrooms and fairies"
Output:
{
"prompt": "A magical forest with glowing mushrooms and fairies",
"style": "fantasy",
"mood": "peaceful",
"characters": ["fairies"],
"items": ["mushrooms", "forest"],
"setting": "forest",
"action": undefined,
"color_palette": ["glowing", "magical"],
"composition": undefined,
"lighting": "glowing"
}
```
### **NanoPrompt Optimizer Mode**
```text
Input: "A beautiful landscape"
Output:
- **Original:** "A beautiful landscape"
- **Optimized:** "A beautiful landscape, breathtakingly beautiful, ultra-detailed, photorealistic, perfect composition, dramatic lighting, high resolution, no artifacts"
- **Accuracy Score:** 85%
```
### **NanoCoder Technical Mode**
```text
Input: "React web application with TypeScript"
Output:
- **Original:** "React web application with TypeScript"
- **Technical:** "React web application with TypeScript, well-structured and maintainable, clean code, DRY principle, SOLID principles, responsive and accessible web application, technical excellence"
- **Technical Accuracy:** 92%
```
---
## 🏗️ **Architecture**
### **Core Components**
#### **JasonTranslator** (`src/services/jason-translator.ts`)
- Natural language to Jason format conversion
- Pattern recognition for style, mood, characters, items
- Setting, action, color palette extraction
- Composition and lighting detection
#### **NanoPrompt** (`src/services/nano-prompt.ts`)
- Deep reverse engineering optimization
- Pattern mapping and keyword enhancement
- Quality descriptors and technical specifications
- Performance optimization and error prevention
#### **NanoCoder** (`src/services/nano-coder.ts`)
- Technical prompt optimization
- Programming language and framework detection
- Architecture and security enhancement
- Code context extraction
---
## 🎨 **UI Components**
### **Tabbed Interface**
- **Jason Translator** - Blue theme for basic translation
- **NanoPrompt** - Purple theme for AI optimization
- **NanoCoder** - Green theme for technical optimization
### **Interactive Features**
- Quick templates for each mode
- Real-time processing with loading indicators
- Copy/download functionality for results
- Accuracy score display
- Performance tips and optimization details
---
## 🛠️ **Development**
### **Project Structure**
```
src/
├── app/
│ ├── page.tsx # Main application page
│ ├── layout.tsx # Root layout
│ └── globals.css # Global styles
├── components/
│ ├── layout/
│ │ ├── header.tsx # Navigation header
│ │ └── footer.tsx # Footer section
│ └── ui/
│ ├── button.tsx # Button component
│ ├── card.tsx # Card component
│ └── input.tsx # Input component
└── services/
├── jason-translator.ts # Jason translation service
├── nano-prompt.ts # NanoPrompt optimization
├── nano-coder.ts # NanoCoder technical optimization
└── api-utils.ts # API utilities
```
### **Technologies Used**
- **Next.js** - React framework with App Router
- **TypeScript** - Type-safe development
- **Tailwind CSS** - Modern utility-first styling
- **Lucide React** - Beautiful icon library
### **Build & Development**
```bash
# Development server
npm run dev
# Build for production
npm run build
# Start production server
npm start
# Linting
npm run lint
```
---
## 🤝 **Contributing**
We welcome contributions! Here's how you can help:
1. **Fork the repository**
2. **Create a feature branch** (`git checkout -b feature/amazing-feature`)
3. **Make your changes**
4. **Commit your changes** (`git commit -m 'Add some amazing feature'`)
5. **Push to the branch** (`git push origin feature/amazing-feature`)
6. **Open a Pull Request**
### **Development Guidelines**
- Follow TypeScript best practices
- Use Tailwind CSS for styling
- Write clean, readable code
- Add comments for complex logic
- Test your changes thoroughly
---
## 📜 **License**
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
---
## 👨‍💻 **About the Developer**
**NanoJason** is developed by **Roman | RyzenAdvanced**
- **GitHub:** [roman-ryzenadvanced](https://github.com/roman-ryzenadvanced)
- **Project Hub:** [Custom Engineered Agents and Tools for Vibe Coders](https://github.com/roman-ryzenadvanced/Custom-Engineered-Agents-and-Tools-for-Vibe-Coders)
- **Tools:** [GLM 4.6 Coding Model](https://z.ai/subscribe?ic=R0K78RJKNW)
- **Built with:** [TRAE IDE](https://www.trae.ai/s/WJtxyE)
### **Special Thanks**
- **GLM 4.6** - Advanced coding model for AI assistance
- **TRAE IDE** - Amazing development environment
- **Open Source Community** - For inspiration and collaboration
---
## 🚀 **Deployment**
### **Vercel (Recommended)**
```bash
# Deploy to Vercel
npm i -g vercel
vercel
```
### **GitHub Pages**
```bash
# Build and deploy
npm run build
npm run export
```
### **Other Platforms**
- Netlify
- Railway
- DigitalOcean App Platform
- AWS Amplify
---
## 🌟 **Show Your Support**
If you find NanoJason useful, please consider:
- ⭐ **Star the repository** on GitHub
- 🐛 **Report bugs** or suggest features
- 📢 **Share** with fellow developers
- 💡 **Contribute** to make it even better
---
## 📞 **Contact**
- **Issues:** [GitHub Issues](https://github.com/roman-ryzenadvanced/NanoJason/issues)
- **Discussions:** [GitHub Discussions](https://github.com/roman-ryzenadvanced/NanoJason/discussions)
- **Email:** [Create an issue](https://github.com/roman-ryzenadvanced/NanoJason/issues) for contact
---
<div align="center">
<strong>Made with ❤️ by Roman | RyzenAdvanced</strong>
[🚀 Deploy](https://vercel.com/new/clone?repository-url=https://github.com/roman-ryzenadvanced/NanoJason) •
[💡 Features](#-amazing-features) •
[📖 Documentation](#-getting-started)
</div>

15
Test Ideas/NanoJason/nanojason/next.config.ts
View File

@@ -1,8 +1,19 @@
import type { NextConfig } from "next";
const nextConfig: NextConfig = {
/* config options here */
// Vercel configuration
output: 'export',
trailingSlash: true,
distDir: 'out',
images: {
unoptimized: true
},
// Enable React compiler for better performance
reactCompiler: true,
// Additional optimizations
compiler: {
removeConsole: process.env.NODE_ENV === 'production',
},
};
export default nextConfig;
export default nextConfig;

18
Test Ideas/NanoJason/nanojason/tsconfig.json
View File

@@ -1,7 +1,11 @@
{
"compilerOptions": {
"target": "ES2017",
"lib": ["dom", "dom.iterable", "esnext"],
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
@@ -19,7 +23,9 @@
}
],
"paths": {
"@/*": ["./src/*"]
"@/*": [
"./src/*"
]
}
},
"include": [
@@ -28,7 +34,11 @@
"**/*.tsx",
".next/types/**/*.ts",
".next/dev/types/**/*.ts",
"**/*.mts"
"**/*.mts",
"out/types/**/*.ts",
"out/dev/types/**/*.ts"
],
"exclude": ["node_modules"]
"exclude": [
"node_modules"
]
}

31
Test Ideas/NanoJason/nanojason/vercel.json Normal file
View File

@@ -0,0 +1,31 @@
{
"buildCommand": "npm run build",
"outputDirectory": "out",
"installCommand": "npm install",
"framework": "nextjs",
"regions": ["fra1", "sfo1", "iad1"],
"functions": {
"src/app/api/**": {
"maxDuration": 10
}
},
"headers": [
{
"source": "/(.*)",
"headers": [
{
"key": "X-Frame-Options",
"value": "DENY"
},
{
"key": "X-Content-Type-Options",
"value": "nosniff"
},
{
"key": "Referrer-Policy",
"value": "origin-when-cross-origin"
}
]
}
]
}