Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
177 changes: 110 additions & 67 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,93 +1,136 @@
<div align="center">
<img src="https://avatars.githubusercontent.com/u/202675624?s=400&u=2daf23e8872a3b666bcd4f792a21fe2633097e79&v=4" alt="Flutter News App Dashboard Logo" width="220">

# Flutter News App Web Dashboard Full Source Code
<img src="https://avatars.githubusercontent.com/u/202675624?s=400&u=2daf23e8872a3b666bcd4f792a21fe2633097e79&v=4" alt="Flutter News App Dashboard Logo" width="220">
<h1>Flutter News App Web Dashboard</h1>
<p><strong>Complete, production-ready source code for a comprehensive content management web dashboard.</strong></p>
</div>

<p>
<img src="https://img.shields.io/badge/coverage-0%25-green?style=for-the-badge" alt="coverage: 0%">
<a href="https://flutter-news-app-full-source-code.github.io/flutter-news-app-web-dashboard-full-source-code/"><img src="https://img.shields.io/badge/LIVE_DEMO-VIEW-orange?style=for-the-badge" alt="Live Demo: View"></a>
<a href="https://flutter-news-app-full-source-code.github.io/docs/web-dashboard/local-setup/"><img src="https://img.shields.io/badge/DOCUMENTATION-READ-slategray?style=for-the-badge" alt="Documentation: Read"></a>
<a href="LICENSE"><img src="https://img.shields.io/badge/TRIAL_LICENSE-VIEW_TERMS-blue?style=for-the-badge" alt="Trial License: View Terms"></a>
<a href="https://github.com/sponsors/flutter-news-app-full-source-code"><img src="https://img.shields.io/badge/LIFETIME_LICENSE-PURCHASE-purple?style=for-the-badge" alt="Lifetime License: Purchase"></a>
<p align="center">
<a href="https://flutter-news-app-full-source-code.github.io/flutter-news-app-web-dashboard-full-source-code/"><img src="https://img.shields.io/badge/LIVE_DEMO-VIEW-orange?style=for-the-badge" alt="Live Demo: View"></a>
<a href="https://flutter-news-app-full-source-code.github.io/docs/web-dashboard/local-setup/"><img src="https://img.shields.io/badge/DOCUMENTATION-READ-slategray?style=for-the-badge" alt="Documentation: Read"></a>
<img src="https://img.shields.io/badge/coverage-0%25-green?style=for-the-badge" alt="coverage: 0%">
</p>
<p align="center">
<a href="LICENSE"><img src="https://img.shields.io/badge/TRIAL_LICENSE-VIEW_TERMS-blue?style=for-the-badge" alt="Trial License: View Terms"></a>
<a href="https://github.com/sponsors/flutter-news-app-full-source-code"><img src="https://img.shields.io/badge/LIFETIME_LICENSE-PURCHASE-purple?style=for-the-badge" alt="Lifetime License: Purchase"></a>
</p>
</div>

This repository contains the complete, production-ready source code for a Flutter web dashboard designed for comprehensive content management. It is a key component of the [**Flutter News App - Full Source Code Toolkit**](https://github.com/flutter-news-app-full-source-code), an ecosystem that also includes a Dart Frog [backend API](https://github.com/flutter-news-app-full-source-code/flutter-news-app-api-server-full-source-code) and a [mobile client](https://github.com/flutter-news-app-full-source-code/flutter-news-app-mobile-client-full-source-code).
This repository contains the complete, production-ready source code for a Flutter web dashboard designed for comprehensive content management. It is a key component of the [**Flutter News App Full Source Code Toolkit**](https://github.com/flutter-news-app-full-source-code), an ecosystem that also includes a Dart Frog [backend API](https://github.com/flutter-news-app-full-source-code/flutter-news-app-api-server-full-source-code) and a [mobile client](https://github.com/flutter-news-app-full-source-code/flutter-news-app-mobile-client-full-source-code).

## ⭐ Everything You Get, Ready to Go
## ⭐ Feature Showcase: Everything You Get, Ready to Go

This dashboard comes packed with all the features you need to manage a professional news application.

#### πŸ“° **Comprehensive Content Management**
Effortlessly manage all aspects of your news content with full CRUD (Create, Read, Update, Delete) capabilities:
* **Headlines:** Create, edit, and publish news articles.
* **Topics:** Organize and define news topics.
* **Sources:** Maintain and update news sources.
> **Your Advantage:** You get a powerful, centralized system to control your content, ensuring accuracy and consistency across your news platform. ✍️
#### βš™οΈ **Dynamic Application Configuration**
Control the behavior and appearance of the mobile application remotely:
* **User Preference Limits:** Set limits for followed items and saved headlines based on user roles (Guest, Authenticated, Premium).
* **Ad Settings:** Configure ad frequency and placement intervals for different user tiers.
* **In-App Prompts:** Manage the display frequency of account-related calls-to-action.
* **Operational Status:** Remotely enable maintenance mode or suggest app updates to users.
> **Your Advantage:** Granular control over app features and monetization strategies without requiring app store updates. πŸš€
#### πŸ“Š **Dashboard Analytics**
Get a quick overview of your content ecosystem with key statistics:
* **Content Counts:** View the total number of headlines, topics, and sources at a glance.
> **Your Advantage:** Instantly understand the scale of your content operation. πŸ“ˆ
#### πŸ” **Robust User Authentication**
Secure and flexible authentication flows are built-in for administrators and publishers using Email + Code (Passwordless) Sign-In.
> **Your Advantage:** All the complex security and user management for your administrative team is already done for you. βœ…
#### πŸ–₯️ **Responsive Web UI**
Built with `flutter_adaptive_scaffold`, the dashboard offers a clean, responsive interface that looks great on any screen size.
> **Your Advantage:** Deliver a consistent and optimized administrative experience on desktops, tablets, and even mobile browsers. ↔️
#### πŸ—οΈ **Clean & Modern Architecture**
Developed with best practices for a maintainable and scalable codebase:
* **Flutter & Dart:** Cutting-edge web development.
* **BLoC Pattern:** Predictable and robust state management.
* **GoRouter:** Well-structured and powerful navigation.
> **Your Advantage:** The dashboard is built on a clean, modern architecture that's easy to understand and maintain. It's solid and built to last. πŸ“ˆ
Click on any category to explore.

#### βš™οΈ **Flexible Environment Configuration**
Easily switch between development (in-memory data or local API) and production environments with a simple code change. This empowers rapid prototyping, robust testing, and seamless deployment.
> **Your Advantage:** A flexible setup that speeds up your development cycle and makes deployment simple. πŸš€
<details>
<summary><strong>✍️ Content Lifecycle Management</strong></summary>

#### 🌍 **Localization Ready**
Fully internationalized with working English and Arabic localizations (`.arb` files). Adding more languages is straightforward.
> **Your Advantage:** Easily adapt your dashboard for a global team. 🌐
### πŸ“° Comprehensive Content Management
Manage the entire lifecycle of your news content with full CRUD (Create, Read, Update, Delete) capabilities, complemented by advanced archiving and restoration features:
- **Headlines:** Create, edit, publish, archive, restore, and permanently delete news articles.
- **Topics:** Organize, define, archive, and restore news topics.
- **Sources:** Maintain, update, archive, and restore news sources.
> **πŸ’‘ Your Advantage:** Gain detailed control over your content. This centralized system ensures accuracy and consistency, allowing you to manage active content and easily retrieve or remove archived items.
---

## πŸ”‘ License: Source-Available with a Free Trial
### πŸ“Š Dashboard Overview
Get a real-time overview of your content ecosystem with key statistics and quick actions:
- **Content Counts:** View the total number of headlines, topics, and sources.
- **Recent Activity:** See recently created headlines to stay on top of new content.
- **Quick Actions:** Directly create new headlines, topics, or sources from the overview.
> **❀️ Your Advantage:** Quickly assess your content operation and jump directly into key management tasks, streamlining your workflow.
</details>

<details>
<summary><strong>πŸ’° Monetization & Remote Control</strong></summary>

### πŸ’Έ Advanced Monetization Control
Manage the monetization engine of your mobile app directly from the dashboard. This integrated system provides deep control over your ad inventory and the rules that govern how ads are displayed.
- **Flexible Ad Provider System:** Switch the primary ad provider for the mobile app between `Google AdMob` for industry-standard monetization or your own `Local` ad server for full control over your inventory.
- **Local Ad Inventory Management:** When using the local provider, you have full CRUD capabilities for all your ad creatives, including:
- **Native Ads:** Design ads that blend with your content.
- **Banner Ads:** Implement traditional banner ads.
- **Interstitial Ads:** Configure full-screen ads.
- **Video Ads:** Manage video ad content.
- **Granular Remote Configuration:** Fine-tune the mobile ad experience without shipping an app update:
- **Ad Unit Management:** Configure AdMob and local ad unit identifiers from one place.
- **Role-Based Rules:** Define ad frequency, placement, and format based on user roles (guest, standard, premium).
- **Format Control:** Set rules for feed ads, in-article ads, and interstitial ads independently.
> **πŸ’‘ Your Advantage:** This provides a centralized control panel to manage a flexible monetization strategy. Deploy local ad campaigns or optimize your AdMob settings on the fly to maximize revenue potential.
Get started for free and purchase when you're ready to launch!
---

* **TRY IT:** Download and explore the full source code under the PolyForm Free Trial [license](LICENSE). Perfect for evaluation.
* **BUY IT:** One-time payment for a lifetime license to publish unlimited commercial apps.
* **GET YOURS:** [**Purchase via GitHub Sponsors**](https://github.com/sponsors/flutter-news-app-full-source-code).
### πŸš€ Centralized Application Control
Manage the mobile client's remote configuration directly from the dashboard. This feature allows you to control various aspects of the mobile application without requiring an app store update. Configurable elements include:
- **Maintenance Mode:** Enable or disable maintenance mode for the mobile app.
- **Force Update:** Mandate app updates to a specific version, with an option to force users to update.
- **Feed Decorators:** Manage the enablement and visibility of in-feed promotional and engagement elements like `linkAccount`, `upgrade`, `rateApp`, `suggestedTopics`, etc.
- **User Preference Limits:** Set maximum limits for followed items (countries, sources, topics) and saved headlines, tiered by user roles.
> **🎯 Your Advantage:** Gain control over your mobile application's behavior. Adjust critical settings on the fly to ensure your users have the best experience and your business goals are met.
> [!NOTE]
> *A single purchase provides a commercial license for every repository within the [Flutter News App - Full Source Code Toolkit](https://github.com/flutter-news-app-full-source-code). No other purchases are needed..*
</details>

<details>
<summary><strong>πŸ” Security & Customization</strong></summary>

### πŸ” Robust User Authentication
Secure authentication flows are built-in for administrators and publishers using Email + Code (Passwordless) Sign-In.
> **βœ… Your Advantage:** The security and user management for your administrative team is already handled for you.
---

## πŸš€ Getting Started & Running Locally
### 🎨 Customizable Dashboard Settings
Provide your administrative team with the ability to personalize their dashboard experience through a robust settings interface. This feature allows individual administrators and publishers to tailor the dashboard's appearance and behavior, including:
- **Appearance Settings:** Adjust base themes (light/dark/system), accent colors, font families, text scale factors, and font weights.
- **Language Selection:** Choose their preferred language for the dashboard interface.
> **πŸ’‘ Your Advantage:** Improve the productivity of your administrative team with a customizable dashboard. Personalized display and language options create a more efficient and user-friendly management experience.
For a complete guide on setting up your local environment, running the web dashboard, and understanding the configuration, please see the **[Local Setup Guide](https://flutter-news-app-full-source-code.github.io/docs/web-dashboard/local-setup/)** in our official documentation.
</details>

Our documentation provides a detailed, step-by-step walkthrough to get you up and running smoothly.
<details>
<summary><strong>πŸ—οΈ Architecture & Technical Excellence</strong></summary>

### πŸ–₯️ Responsive Web UI
Built with `flutter_adaptive_scaffold`, the dashboard offers a clean, responsive interface that works well on any screen size.
> **↔️ Your Advantage:** Provides a consistent administrative experience on desktops, tablets, and mobile browsers.
---

### πŸ—οΈ Clean & Modern Architecture
Developed with best practices for a maintainable and scalable codebase:
- **Flutter & Dart:** Modern web development.
- **BLoC Pattern:** Predictable state management.
- **GoRouter:** Well-structured navigation.
> **πŸ“ˆ Your Advantage:** The dashboard is built on a clean, modern architecture that is easy to understand and maintain.
---

## βœ… Testing
### πŸ› οΈ Flexible Environment Configuration
Switch between development (in-memory data or local API) and production environments with a simple code change.
> **πŸš€ Your Advantage:** This setup speeds up the development cycle and simplifies deployment.
This project aims for high test coverage to ensure quality and reliability.
---

### 🌍 Localization Ready
Fully internationalized with working English and Arabic localizations (`.arb` files). Adding more languages is straightforward.
> **🌐 Your Advantage:** Adapt your dashboard for a global team.
* Run tests with:
```bash
flutter test
</details>

## πŸ”‘ License: Source-Available with a Free Trial

Get started for free and purchase when you're ready to launch!

- **TRY IT:** Download and explore the full source code under the PolyForm Free Trial [license](LICENSE). Perfect for evaluation.
- **BUY IT:** One-time payment for a lifetime license to publish unlimited commercial apps.
- **GET YOURS:** [**Purchase via GitHub Sponsors**](https://github.com/sponsors/flutter-news-app-full-source-code).

> A single purchase provides a commercial license for every repository within the [Flutter News App Full Source Code Toolkit](https://github.com/flutter-news-app-full-source-code). No other purchases are needed.
## πŸš€ Getting Started & Running Locally

For a complete guide on setting up your local environment, running the web dashboard, and understanding the configuration, please see the **[Local Setup Guide](https://flutter-news-app-full-source-code.github.io/docs/web-dashboard/local-setup/)** in our official documentation.

Our documentation provides a detailed, step-by-step walkthrough to get you up and running smoothly.
Loading