MonacoUSA Portal Foundation

This folder contains the complete foundation and implementation guide for creating the MonacoUSA Portal - a modern, responsive web portal built with the same proven tech stack as the Port Nimara client portal.

📁 Contents

1. MONACOUSA_PORTAL_IMPLEMENTATION.md

Complete step-by-step implementation guide containing:

• ✅ Full project setup instructions
• ✅ All code templates and configurations
• ✅ Keycloak authentication implementation
• ✅ NocoDB database integration
• ✅ MinIO file storage setup
• ✅ Responsive dashboard with Vuetify 3
• ✅ PWA configuration
• ✅ Production deployment guide
• ✅ Testing and verification steps

2. CLINE_WORKSPACE_RULES.md

Cline workspace configuration file containing:

• 🔧 Project overview and tech stack details
• 🔧 Development guidelines and coding standards
• 🔧 Environment configuration requirements
• 🔧 Key features and capabilities
• 🔧 Extension guidelines for adding new tools
• 🔧 Troubleshooting and best practices
• 🔧 Support resources and documentation

3. DOCKER_DEPLOYMENT_GUIDE.md

Complete Docker and CI/CD deployment guide containing:

• 🐳 Multi-stage Docker build configuration
• 🔄 Gitea Actions CI/CD pipeline setup
• 📁 Volume management and persistent data
• 🔍 Health checks and monitoring
• 🛠️ Troubleshooting and best practices
• 🔐 Security considerations and optimization

🚀 Quick Start

1. Give the implementation guide to another Claude instance:

   • Copy the contents of MONACOUSA_PORTAL_IMPLEMENTATION.md
   • Provide it to Claude with instructions to follow the guide step-by-step

2. Set up Cline workspace rules:

   • Copy the contents of CLINE_WORKSPACE_RULES.md
   • Add it to your Cline workspace rules for the new project

🎯 Project Specifications

• Name: monacousa-portal
• Domain: monacousa.org (configurable)
• Colors: #a31515 (MonacoUSA red) primary, #ffffff (white) secondary
• Tech Stack: Nuxt 3, Vue 3, Vuetify 3, Keycloak, NocoDB, MinIO
• Features: PWA, Mobile-responsive, Dashboard layout, File storage

📋 What You'll Get

Following this implementation guide will create a complete portal foundation with:

✅ Authentication System

• Keycloak OAuth2/OIDC integration
• Secure session management
• Role-based access control
• Login/logout functionality

✅ Responsive Dashboard

• Mobile-first design
• Collapsible sidebar navigation
• User profile display
• Role-based menu items

✅ File Management

• MinIO S3-compatible storage
• Upload/download functionality
• File type validation
• Secure access control

✅ Database Integration

• NocoDB API-first database
• CRUD operations
• Dynamic table access
• Type-safe operations

✅ PWA Features

• Offline support
• Install prompts
• Service worker
• Mobile optimization

✅ Production Ready

• Health check endpoints
• Error handling
• Security best practices
• Deployment configuration

🛠️ Usage Instructions

For Implementation

1. Create a new repository for your MonacoUSA Portal
2. Follow the step-by-step guide in MONACOUSA_PORTAL_IMPLEMENTATION.md
3. Configure your environment variables
4. Set up Keycloak, NocoDB, and MinIO services
5. Test the implementation
6. Deploy to production

For Development

1. Use CLINE_WORKSPACE_RULES.md as your Cline workspace rules
2. Follow the coding standards and guidelines
3. Extend the portal with your custom tools
4. Maintain consistency with the established patterns

🎨 Customization

The foundation is designed to be easily customizable:

• Branding: Update colors, logos, and text
• Tools: Add new dashboard pages and functionality
• APIs: Extend with custom server endpoints
• Database: Add new tables and data structures
• UI: Customize components and layouts

📞 Support

This foundation is based on the proven Port Nimara client portal architecture and includes:

• Comprehensive documentation
• Complete code examples
• Best practices and patterns
• Troubleshooting guides
• Extension guidelines

The implementation guide is self-contained and can be followed by any developer or AI assistant to create the exact foundation you need.

---

Ready to build your MonacoUSA Portal! 🚀