Complete, production-ready source code for a comprehensive Flutter news app web dashboard.
This repository contains the complete, production-ready source code for a Flutter news app web dashboard designed for comprehensive content management. It is a key component of the Flutter News App Full Source Code Toolkit, an ecosystem that also includes a Dart Frog backend API and a mobile client.
This dashboard comes packed with all the features you need to manage a professional news application.
Click on any category to explore.
✍️ Content Lifecycle 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: Draft, create, edit, archive, restore, and permanently delete news articles.
- Topics: Draft, Create, edit, archive, and restore news topics.
- Sources: Draft, Create, edit, archive, and restore news sources.
💡 Your Advantage: Gain detailed control over your content. This centralized system ensures accuracy and consistency, allowing you to manage draft/active content and easily retrieve or remove archived items.
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.
💰 Monetization & Remote 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 AdMobfor industry-standard monetization or your ownLocalad 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.
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.
🔐 Security & Customization
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.
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.
🏗️ Architecture & Technical Excellence
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.
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.
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.
Fully internationalized with working English and Arabic localizations (.arb files). Adding more languages is straightforward.
🌐 Your Advantage: Adapt your dashboard for a global team.
This Flutter News App Web Dashboard package is an integral part of the Flutter News App Full Source Code Toolkit. For comprehensive details regarding licensing, including trial and commercial options for the entire toolkit, please refer to the main toolkit organization page.
For a complete guide on setting up your local environment, running the web dashboard, and understanding the configuration, please see the Local Setup Guide in our official documentation.
Our documentation provides a detailed, step-by-step walkthrough to get you up and running smoothly.