Building a Diary Web App with Flutter and Firestore Online Course
Building a Diary Web App with Flutter and Firestore Online Course
In this course, you’ll learn how to build dynamic and scalable web apps using Flutter 2.0 and Dart, leveraging your existing Flutter skills. You'll develop a full-featured Diary Web App, DiaryBook, with Firestore and FirebaseAuth integration. Key topics include creating and managing user authentication with Firebase, building, editing, and deleting diary entries using Firestore, implementing state management with Providers and StreamBuilders, and mastering routing in Flutter web apps. By the end of the course, you'll be equipped to deploy your Flutter web app to Firebase hosting and seamlessly adapt it for desktop platforms.
Key Benefits
- Develop a comprehensive, advanced Flutter web application utilizing Firestore and FirebaseAuth for backend functionality.
- Implement user authentication, sign-up, and login processes using Google Cloud FirebaseAuth.
- Master both basic and advanced routing techniques in Flutter 2.0 for web applications, enhancing app navigation and user experience.
Target Audience
This course is ideal for beginner to intermediate Flutter developers, as well as web developers eager to expand their skills in building Flutter web applications. It is also suitable for students interested in creating Flutter-based apps for web, iOS, Android, and desktop platforms using Flutter 2.0. A foundational understanding of programming concepts, especially Object-Oriented Programming (OOP), will be beneficial. Prior experience with Flutter, Dart, or basic web development will enhance your learning experience but is not mandatory to succeed in this course.
Learning Objectives
- Develop a fully functional web application using Flutter for the web and Cloud Firebase Firestore.
- Gain proficiency in advanced Flutter APIs, including the use of providers and routing techniques.
- Understand how to implement user authentication in web apps using FirebaseAuth.
- Build adaptive and dynamic web applications utilizing Flutter 2.0's capabilities.
- Manage diary entries by creating, editing, deleting, and updating them with a Cloud Firestore backend.
- Deploy Flutter web applications seamlessly to Firebase Hosting for production-ready deployment.
Course Outline
The Building a Diary Web App with Flutter and Firestore Exam covers the following topics -
Domain 1. Course Overview
- Course Introduction and Prerequisites
- What You Will Create During the Course
Domain 2. Setup for Windows Users
- How to Prepare Your Windows Machine for Flutter Web Development
Domain 3. Setup for Mac Users
- Instructions to Set Up Your Mac for Flutter Web Development
Domain 4. Building the DiaryBook Web App
- Starting the DiaryBook Project
- Integrating the AppBar and DiaryBook Logo
- Refactoring Code for MainPage
- Adding Dropdown Menu with State Management
- Setting Up AppBar with Circular Avatar and Signout Functionality
Domain 5. DiaryBook Web App: Main Layout
- Structuring the Main Body of the Page (Left Side)
- Integrating the DatePicker Package
- Creating the Card Button and Floating Action Button
- Developing a Placeholder Listview for the Right Side
Domain 6. Firebase Authentication and Firestore Integration
- Setting Up Firebase and Firestore for the Application
- Reading Data from Firestore
- Building the Getting Started Page
- Navigation to the Login Page
- Constructing and Styling the Login Form
- Adding Validation and Password Fields to the Login Form
- Enabling Firebase Authentication for User Login
- Toggling Between Create Account and Login Forms
- Redirecting Users After Login to the Main Page
Domain 7. Managing User Profiles
- Creating User Structure and Adding to Firestore Users Collection
- Developing a User Data Class for Profile Management
- Refactoring Login Code and Displaying User Names on the AppBar
- Displaying User Avatars and Modifying Web Renderer
- Constructing and Updating User Profiles
Domain 8. Diary Entry Functions: Creation, Update, and Deletion
- Introduction to Diary Entry Creation
- Designing the Diary Entry Dialog with Buttons and Image Containers
- Saving and Displaying Entries with Date and Text Fields
- Passing Date with Entries and Refactoring the ListView
Domain 9. Displaying and Managing Diary Entries
- Refactoring Listview Card Layout for Diary Entries
- Adding Image Selection with Image Picker
- Setting Up Firebase Storage for Image Management
- Deleting Entries and Enhancing the Delete Entry Dialog
- Updating and Editing Entries Using Dialogs
Domain 10. Building the Update Entry Dialog
- Creating an Update Entry Dialog with Icons and Image Picker
- Populating Fields in the Update Dialog and Fetching Entry Data
- Refactoring Update Dialog Code
- Implementing Entry Updates and Managing Deletion
Domain 11. Filtering Diary Entries by Date
- Implementing Filtering Mechanism for Entries by Date
- Developing Methods to Retrieve Entries for Specific Dates
- Displaying Filtered Entries and Empty Diary Cards if No Entries Found
- Using Provider to Filter Diary List Based on User
Domain 12. Advanced Diary Filtering: Sorting Entries
- Implementing Sorting for Entries by Earliest and Latest Dates
- Adding Interactions to FAB and Delayed Animations for Diary Display
Domain 13. Advanced Routing Techniques
- Setting Up Advanced Routing for Better Navigation
- Handling Page Not Found Errors and Improving Routing Efficiency
Domain 14. Deployment to Firebase Hosting
- Setting Up Firebase Hosting via CLI
- Process of Deploying the Flutter Web App to Firebase Hosting
