🔥 Fire Flame Studio

Open-source Firebase Admin GUI built with Flutter

A powerful desktop alternative to Firebase Console for managing Firestore, Authentication, and more.

---

🎯 Project Overview

Package Name: fire_flame_studio
Organization: com.stepanic
Target Platforms: Windows, macOS, Linux (Desktop only)
Current Phase: Phase 1 - Project Setup & Authentication ✅

---

🏗️ Architecture

• Clean Architecture with feature-based folder structure
• Riverpod 2.x for state management (with code generation)
• Freezed for immutable models
• Hive for local persistence
• dart_firebase_admin for Firebase operations

---

📦 Core Technologies

Package	Version	Purpose
flutter_riverpod	^3.0.0	State management
dart_firebase_admin	0.4.1	Firebase Admin SDK
hive	^2.2.3	Local storage
freezed	^3.0.0	Code generation
window_manager	0.5.1	Desktop window control
file_picker	>=8.1.2	File selection
data_table_2	^2.0.0	Data tables
google_fonts	^6.1.0	Typography

---

🚀 Getting Started

Prerequisites

• Flutter SDK 3.6.0 or higher
• Dart SDK 3.6.0 or higher
• Desktop development enabled (Windows/macOS/Linux)

Installation Steps

1. Clone the Repository

git clone https://github.com/stepanic/fire-flame-studio.git
cd fire-flame-studio

2. Install Dependencies

flutter pub get

3. Run Code Generation

IMPORTANT: You must run this command to generate required files (Freezed, Riverpod, Hive adapters):

dart run build_runner build --delete-conflicting-outputs

This will generate:

• firebase_project.freezed.dart - Freezed models
• firebase_project.g.dart - Hive adapters + JSON serialization
• project_list_provider.g.dart - Riverpod providers

4. Run the App

# For Windows
flutter run -d windows

# For macOS
flutter run -d macos

# For Linux
flutter run -d linux

---

📁 Project Structure

lib/
├── main.dart                           # App entry point
├── nav.dart                            # GoRouter navigation
├── theme.dart                          # App theme (light/dark)
├── features/
│   └── projects/                       # Project management feature
│       ├── data/
│       │   ├── models/
│       │   │   └── firebase_project.dart       # Freezed + Hive model
│       │   ├── repositories/
│       │   │   └── project_repository.dart     # Data layer
│       │   └── services/
│       │       └── firebase_admin_service.dart # Firebase SDK singleton
│       └── presentation/
│           ├── providers/
│           │   └── project_list_provider.dart  # Riverpod providers
│           ├── pages/
│           │   ├── onboarding_page.dart        # Add first project
│           │   └── project_selector_page.dart  # View all projects
│           └── widgets/
│               └── project_card.dart           # Project list item
└── screens/
    └── welcome_screen.dart             # Landing page

---

✨ Phase 1 Features (Completed)

Project Management

• ✅ Add Firebase projects via service account JSON
• ✅ Store projects locally with Hive
• ✅ Switch between multiple projects
• ✅ View project list
• ✅ Delete projects
• ✅ Automatic Firebase Admin SDK initialization

UI Components

• ✅ Beautiful onboarding screen
• ✅ Project selector with active project indicator
• ✅ Responsive desktop layout (1400x900 default)
• ✅ Light/Dark theme support
• ✅ Firebase-inspired color palette

Navigation

• ✅ GoRouter setup
• ✅ Welcome screen → Onboarding
• ✅ Welcome screen → Project selector
• ✅ Project selector → Switch projects

---

🔧 Development Commands

Code Generation (Run after model changes)

# Watch mode (auto-regenerate on file changes)
dart run build_runner watch --delete-conflicting-outputs

# One-time build
dart run build_runner build --delete-conflicting-outputs

# Clean generated files
dart run build_runner clean

Testing

# Run all tests
flutter test

# Run with coverage
flutter test --coverage

Linting

# Analyze code
dart analyze

# Format code
dart format .

---

🔐 Firebase Setup

To use Fire Flame Studio, you need a Firebase service account JSON file:

Steps to Get Service Account JSON:

1. Go to Firebase Console
2. Select your project
3. Click ⚙️ Settings → Project Settings
4. Navigate to Service Accounts tab
5. Click "Generate new private key"
6. Save the JSON file securely
7. Import it in Fire Flame Studio

⚠️ Security Note: Service account files grant full access to your Firebase project. Store them securely and never commit them to version control.

---

🎨 Theme Customization

Fire Flame Studio uses a Firebase-inspired color palette:

Light Theme

• Primary: #FF6F00 (Deep Orange)
• Secondary: #FFA000 (Amber)
• Background: #F5F5F5 (Light Gray)

Dark Theme

• Primary: #FFB74D (Light Orange)
• Secondary: #FFCA28 (Light Amber)
• Background: #1E1E1E (Dark Gray)

Customize colors in lib/theme.dart.

---

🛣️ Roadmap

✅ Phase 1: Project Setup & Authentication (Current)

• Project management
• Firebase Admin SDK integration
• Local storage with Hive

📋 Phase 2: Main Layout (Next)

• Navigation rail with feature tabs
• Dashboard overview
• Settings panel

📋 Phase 3: Firestore Manager

• Collection browser
• Document viewer/editor
• Query builder
• Bulk operations
• Export/Import (JSON, CSV)

📋 Phase 4: Authentication Manager

• User list with pagination
• User details viewer
• Create/update/delete users
• Bulk operations

📋 Phase 5: Advanced Features

• Storage browser
• Analytics dashboard
• Realtime Database viewer
• Cloud Functions logs

---

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Development Setup

1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

---

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

---

🐛 Issues & Feedback

Found a bug or have a feature request?
Report it on GitHub Issues

---

🙏 Acknowledgments

• Built with Flutter
• Uses dart_firebase_admin
• Inspired by Firebase Console

---

📧 Contact

Stepanic - @stepanic
Project Link: https://github.com/stepanic/fire-flame-studio

---

Made with ❤️ and 🔥 by the open-source community