docs: concise infrastructure-style README

This commit is contained in:
gdegelas 2026-06-01 09:50:01 +00:00
parent a05331128b
commit dd13d72b5d

488
README.md
View File

@ -1,477 +1,37 @@
# Atlas Green Morocco
## Strategic Framework & Deployment Playbook for Building a Green Energy / Hydrogen Business in Morocco (20262035)
[![React](https://img.shields.io/badge/React-18-blue)](https://react.dev)
[![Vite](https://img.shields.io/badge/Vite-4.5-purple)](https://vitejs.dev)
[![Tailwind CSS](https://img.shields.io/badge/Tailwind%20CSS-3.4-06B6D4)](https://tailwindcss.com)
[![TypeScript](https://img.shields.io/badge/TypeScript-5.3-3178C6)](https://www.typescriptlang.org)
[![Docker](https://img.shields.io/badge/Docker-Ready-2496ED)](https://docker.com)
Interactive grant strategy platform for building renewable energy and green hydrogen businesses in Morocco — deployed at https://grants.degelas.be.
---
## Layout
## What is Atlas Green Morocco?
```
grants/
├── src/ # React + Vite frontend (single-file SPA)
│ ├── components/ # UI sections (Hero, Position, Grants, Studio, Vault, …)
│ ├── data/ # Grant programs, zones, markets, deployment phases
│ ├── i18n/ # Trilingual strings (EN / FR / Darija)
│ └── lib/ # Analytics, Degelas API, AI, vault, profile
├── server/ # Express API proxy (AI generation, vault persistence)
├── index.html # Entry point with Umami analytics snippet
├── Dockerfile # Multi-stage: frontend-builder → nginx / api-builder → node
└── docker-compose.yml # Frontend (:8081) + API server (:3001)
```
**Atlas Green Morocco** is a production-ready, interactive strategic playbook for entrepreneurs building renewable energy, green hydrogen, or industrial decarbonization businesses in Morocco.
## What's NOT in this repo
Instead of static PDF documents, the playbook is a **modern web application** that guides founders through:
- `.env` — API keys for OpenAI, Degelas, etc. (see `.env.example`)
- `node_modules/`, `dist/`, `dist-server/`, `generated_docs/`
1. **5 Business Models**: From energy software to hydrogen production
2. **7 Deployment Phases**: 1236 month roadmap from idea to market dominance
3. **4 Opportunity Categories**: Software, infrastructure, desalination, manufacturing
4. **Specific Actions**: 100+ tactical steps with timelines, resources, and success metrics
5. **Practical Guidance**: Checkpoints, pitfalls, and daily execution checklists
---
## Why Atlas Green Morocco?
### The Opportunity
Morocco is not just "another emerging market." It is:
- **The energy bridge** between Africa and Europe
- **A green industrial platform** with world-class renewable potential
- **A future hydrogen exporter** to the EU
But building a hydrogen production company directly requires €50M+, extreme complexity, and massive regulatory risk. **The smartest startups don't produce hydrogen—they enable it.**
### The Problem
Existing resources are:
- ❌ Generic (not Morocco-specific)
- ❌ Static (PDF files, outdated)
- ❌ Academic (strategy without execution tactics)
- ❌ Incomplete (no daily checklists or deployment timeline)
### The Solution
**Atlas Green Morocco** is:
- ✅ Morocco & green hydrogen-specific
- ✅ Interactive, web-based, always up-to-date
- ✅ 100% tactical (actions, timelines, resources)
- ✅ Complete (strategy + playbook + checklists + Docker deployment)
---
## Features
### 📊 Strategic Analysis
- **5 Business Models Comparison**: Capital requirements, complexity, scalability, recommendation
- **4 Opportunity Categories**: AD ranked by capital needs and market potential
- **Interactive Selection**: Click each model to explore detailed analysis
### 🗺️ Geographic Strategy
- **5 Moroccan Free Zones**: Tangier, Kenitra, Casablanca, Dakhla (future)
- **Tax Jurisdiction Guidance**: UAE, Netherlands, Luxembourg, Estonia holding structures
- **Investment Incentives**: Tax exemptions, subsidies, customs benefits
### 📋 1236 Month Deployment Playbook
Detailed phase-by-phase roadmap:
- **Phase 0**: Foundation & Strategy Validation (weeks 14)
- **Phase 1**: Legal Structure & Incorporation (weeks 48)
- **Phase 2**: Product & Market MVP (weeks 820)
- **Phase 3**: Revenue & Customer Traction (weeks 2032)
- **Phase 4**: Scale & Market Expansion (weeks 3252)
- **Phase 5**: Seed Funding & Institutional Validation (weeks 4872)
- **Phase 6**: Product Scale & Infrastructure Build (months 615)
- **Phase 7**: Market Dominance & Expansion (months 1536)
### 🎯 For Each Phase:
- **Objective**: Clear goal and duration
- **Actions**: 56 specific, detailed actions with owners and timelines
- **Checkpoints**: Success criteria that must be met
- **Success Metrics**: Quantified targets (ARR, churn, NPS, etc.)
- **Pitfalls**: Common mistakes to avoid with explanations
### 📱 Responsive Design
- **Mobile-first**: Works perfectly on phones, tablets, desktops
- **Dark mode support**: Emerald/teal green energy color scheme
- **Smooth navigation**: Sticky header with quick links to all sections
- **Expandable cards**: Click to explore details, collapse to scan overview
### 🌍 Production-Ready
- **Fully containerized**: Docker + Docker Compose included
- **Nginx configured**: Gzip, security headers, SPA routing, caching
- **Optimized build**: <25MB final image, <100KB gzipped HTML
- **One-command deployment**: `docker compose up -d --build`
---
## Getting Started
### Prerequisites
- Node.js 18+
- npm or yarn
- Docker & Docker Compose (for production)
### Local Development
## Deploy
```bash
# Clone the repository
git clone https://github.com/your-repo/atlas-green-morocco.git
cd atlas-green-morocco
# Install dependencies
npm install
# Run development server
npm run dev
# Open http://localhost:5173
# Build for production
npm run build
# Preview production build
npm run preview
docker compose -f docker-compose.yml -f docker-compose.prod.yml up -d
```
### Production Deployment with Docker
The API server proxies AI (OpenAI-compatible) and Degelas metrics requests.
The frontend is served by nginx on port 8081.
```bash
# Build and run in one command
docker compose up -d --build
## Admin
# Access at http://localhost
# View logs: docker compose logs -f
# Stop: docker compose down
```
See [DOCKER_DEPLOYMENT.md](./DOCKER_DEPLOYMENT.md) for detailed deployment guides for:
- VPS (DigitalOcean, Linode, AWS EC2)
- Heroku Container Registry
- AWS ECS
- DigitalOcean App Platform
---
## Project Structure
```
atlas-green-morocco/
├── src/
│ ├── components/
│ │ ├── Nav.tsx # Sticky navigation with mobile menu
│ │ ├── Hero.tsx # Hero section with background image
│ │ ├── PositionSection.tsx # Interactive business model selector
│ │ ├── OpportunitiesSection.tsx # 4 opportunity categories (expandable)
│ │ ├── ZonesSection.tsx # Moroccan free zones guide
│ │ ├── PlaybookSection.tsx # Company structure, funding, MVP strategy
│ │ ├── DeploymentPlaybook.tsx # 7-phase deployment guide (expandable)
│ │ ├── MacroSection.tsx # Europe's green energy needs
│ │ ├── IdeasSection.tsx # Top 5 startup ideas
│ │ ├── PathSection.tsx # Recommended practical path (numbered steps)
│ │ ├── Footer.tsx # Footer with branding
│ │ └── Section.tsx # Reusable section wrapper
│ ├── data/
│ │ ├── deployment.ts # 7 deployment phases with actions, checkpoints, metrics
│ │ └── index.ts # Main business models, opportunities, zones data
│ ├── utils/
│ │ └── cn.ts # Tailwind class merging utility
│ ├── App.tsx # Main app component
│ ├── main.tsx # React entry point
│ └── index.css # Global Tailwind styles
├── public/
│ └── images/
│ └── hero.jpg # AI-generated hero background
├── Dockerfile # Multi-stage Docker build
├── docker-compose.yml # Docker Compose configuration
├── nginx.conf # Nginx server config (gzip, SPA routing, security)
├── .dockerignore # Docker build exclusions
├── package.json # Dependencies and scripts
├── tsconfig.json # TypeScript configuration
├── vite.config.ts # Vite configuration
├── tailwind.config.ts # Tailwind CSS configuration
├── DEPLOYMENT_GUIDE.md # Detailed deployment playbook + checklists
├── FOUNDER_CHECKLIST.md # Daily/weekly action checklist for founders
├── DOCKER_DEPLOYMENT.md # Docker-specific deployment guide
└── README.md # This file
```
---
## Documentation
The project includes three comprehensive guides:
### 1. **DEPLOYMENT_GUIDE.md** (9,000+ words)
Complete 1236 month execution playbook for founders. Includes:
- Phase-by-phase breakdown with actions, timelines, and success metrics
- Quick reference tables
- Funding by phase
- Morocco advantages to leverage
- Pre-launch checklist
**Use this to**: Understand the full journey and execute tactically.
### 2. **FOUNDER_CHECKLIST.md** (6,000+ words)
Daily and weekly action checklist for startup founders:
- Week-by-week tasks for each phase
- Specific days for specific actions
- Key metrics to track (daily, weekly, monthly, quarterly)
- Founder self-care reminders
- Pro tips and don'ts
**Use this to**: Stay accountable and execute consistently.
### 3. **DOCKER_DEPLOYMENT.md** (4,000+ words)
Production-ready Docker deployment guide:
- Quick start (1-minute local deployment)
- VPS deployment (DigitalOcean, Linode, AWS EC2)
- Cloud platform deployment (Heroku, AWS ECS, DigitalOcean App Platform)
- Docker architecture explanation
- Nginx configuration details
- Troubleshooting and security best practices
**Use this to**: Deploy the application to production.
---
## Technology Stack
### Frontend
- **React 18**: UI components and state management
- **TypeScript**: Type-safe code
- **Vite 4.5**: Lightning-fast build tool
- **Tailwind CSS 3.4**: Utility-first CSS framework
### Production
- **Docker**: Containerization for deployment
- **Nginx Alpine**: Lightweight web server (<25MB image)
- **Multi-stage build**: Separates build from runtime
### Design
- **Emerald/Teal color scheme**: Green energy branding
- **Responsive design**: Mobile-first approach
- **Smooth animations**: Expandable cards and transitions
- **Professional typography**: Clear information hierarchy
---
## Data Structure
### Business Models (5)
```typescript
type BusinessModel = {
name: string;
capital: string;
capitalLevel: 1-5;
complexity: 1-5;
scalability: 1-5;
recommended: "Later stage" | "Strong" | "Very strong" | "Excellent";
blurb: string;
};
```
### Opportunities (4 Categories: AD)
```typescript
type Opportunity = {
id: string;
letter: "A" | "B" | "C" | "D";
title: string;
products: { name: string; functions: string[] }[];
why?: string[];
};
```
### Deployment Stages (7 Phases)
```typescript
type DeploymentStage = {
phase: string;
title: string;
actions: Action[];
checkpoints: Checkpoint[];
successMetrics: string[];
pitfalls: string[];
};
```
All data is stored in `/src/data/` TypeScript files for easy maintenance and updates.
---
## Customization
### Update Content
All strategic and deployment content is stored in `/src/data/`:
- `src/data/index.ts` — Business models, opportunities, zones, ideas
- `src/data/deployment.ts` — 7 deployment phases (actions, checkpoints, metrics)
Simply edit these TypeScript files to update the playbook.
### Styling
- Tailwind CSS configuration: `tailwind.config.ts`
- Custom colors: Emerald and teal for green energy branding
- Component styles: Inline with `cn()` utility in each component
### Hero Image
Replace `public/images/hero.jpg` with your own image or modify the Hero component to use a CSS gradient instead.
---
## Performance
### Build Size
- **Production HTML**: 307 KB (98 KB gzipped)
- **Docker Image**: <25 MB (Nginx Alpine)
- **Page Load**: ~2 seconds on 4G
### Optimizations
✅ Gzip compression enabled in Nginx
✅ Static asset caching (6 months for fingerprinted files)
✅ SPA routing with client-side navigation
✅ TypeScript for smaller bundle (vs. plain JS)
✅ Tailwind CSS purging (only used styles included)
---
## Browser Support
- ✅ Chrome 90+
- ✅ Firefox 88+
- ✅ Safari 14+
- ✅ Edge 90+
- ✅ Mobile browsers (iOS Safari, Chrome Android)
---
## Contributing
This playbook is a living document. To contribute:
1. Fork the repository
2. Create a feature branch (`git checkout -b feature/your-idea`)
3. Make your changes
4. Commit with clear messages (`git commit -am 'Add new deployment metric'`)
5. Push to your fork (`git push origin feature/your-idea`)
6. Open a Pull Request
We welcome:
- Content updates (new data, insights)
- UI/UX improvements
- Deployment guides for new platforms
- Bug fixes and performance optimizations
---
## License
This project is licensed under the **MIT License**.
You are free to:
- ✅ Use for commercial purposes
- ✅ Modify and create derivatives
- ✅ Distribute and share
- ✅ Use privately
Please credit **Atlas Green Morocco** in your projects.
See [LICENSE](./LICENSE) for full details.
---
## Authors & Attribution
### Created by
**Your Name** — Founder, Atlas Green Morocco
*Building the strategic playbook for green energy entrepreneurs in Morocco.*
### Special Thanks To
- Morocco's free-zone authorities for enabling green innovation
- EU investors and impact funds for supporting Africa's green transition
- The green hydrogen and renewable energy community in North Africa
---
## Support & Contact
### Questions?
- 📧 **Email**: hello@atlasgreenmorocco.com
- 🐙 **GitHub Issues**: [Report a bug or request a feature](https://github.com/your-repo/atlas-green-morocco/issues)
- 💼 **LinkedIn**: [@atlasgreenmorocco](https://linkedin.com/company/atlas-green-morocco)
### For Founders Using This Playbook
- 📅 **Monthly Updates**: Subscribe to our founder community for updates and insights
- 🎓 **Training Program**: Consider our 12-week accelerator program (coming 2026)
- 🤝 **Advisory**: Connect with experienced operators and investors
---
## Roadmap
### v1.0 (Current)
✅ Strategic framework (5 business models, 4 opportunity categories)
✅ 7-phase deployment playbook
✅ Daily/weekly founder checklists
✅ Production-ready Docker deployment
✅ Responsive web interface
### v1.1 (Q1 2026)
🔄 Interactive financial modeling tool
🔄 Investment readiness calculator
🔄 Investor directory (VCs, impact funds, corporate investors interested in Morocco)
### v1.2 (Q2 2026)
🔄 Case studies from deployed Morocco startups
🔄 Live investor pitch deck generator
🔄 Customer discovery interview templates
### v2.0 (H2 2026)
🔄 Community forum for founders
🔄 Mentor matching (connect with experienced operators)
🔄 Deal flow platform (investors + founders)
🔄 Mobile app for daily task tracking
---
## Statistics
- **7 Deployment Phases**: 1236 month roadmap
- **100+ Tactical Actions**: Specific steps with owners and timelines
- **50+ Success Metrics**: Quantified targets at each stage
- **30+ Common Pitfalls**: Mistakes to avoid with explanations
- **5 Business Models**: Ranked by capital, complexity, scalability
- **4 Opportunity Categories**: Software, infrastructure, desalination, manufacturing
- **5 Moroccan Free Zones**: Tangier, Kenitra, Casablanca, Dakhla, others
- **5 Top Startup Ideas**: Ranked by ROI and market demand
---
## Final Notes
> **"Don't produce hydrogen. Enable the hydrogen economy."**
Morocco is positioning itself as the energy bridge between Africa and Europe. The opportunity is real. The timing is now.
This playbook is your tactical guide from idea to market leadership. Start lean. Embed deep. Scale into assets.
---
## Legal Disclaimer
**Atlas Green Morocco** is a strategic framework and educational resource. It is **not**:
- ❌ Financial advice
- ❌ Legal advice
- ❌ Investment advice
Always consult with qualified professionals (lawyers, accountants, business advisors) before making business decisions.
---
## Changelog
### v1.0 — January 2026
- Initial release with 7-phase deployment playbook
- Interactive business model selector
- 4 opportunity categories with expandable details
- Production-ready Docker deployment
- Founder checklists and deployment guides
- Fully responsive design with Tailwind CSS
---
**Last Updated**: January 2026
**Version**: 1.0
**Status**: Production Ready ✅
---
*Built with ❤️ for green energy entrepreneurs in Morocco.*
- Backend health: `https://grants.degelas.be/api/health`
- Umami analytics: https://analytics.degelas.be (website id for grants.degelas.be)