HOME > Development > Create a Simple Landing Page with Flutter Web and Firebase

Create a Simple Landing Page with Flutter Web and Firebase

  • Development
  • May 14, 2025
SynopsisCreate a Simple Landing Page with Flutter Web and Firebase, a...
Create a Simple Landing Page with Flutter Web and Firebase  No.1

Create a Simple Landing Page with Flutter Web and Firebase, available at $74.99, has an average rating of 4.25, with 86 lectures, based on 140 reviews, and has 1073 subscribers.

You will learn about Build a Complete, Real World Website with Flutter Web and Firebase Learn Firebase Services such as Firebase Firestore, Firebase Authentication and Firebase Hosting Build a Landing Page to show off your other Social Media Links Become proficient in one of the fastest growing technologies Build a website without learning HTML, CSS and Javascript Learn State Management with Providers, Proxy Providers and Stream Providers Learn Advance State Management with Change Notfier and Change Notifier Proxy Provider Learn Firebase Emulator Services such as Firestore Emulator This course is ideal for individuals who are If you are interested in web development and wanted to try building one without HTML, CSS, or Javascript or If you have mobile development in Flutter and want to expand your skills as a web developer or If you are a traditional web developer, and you want to try creating a website in another way It is particularly useful for If you are interested in web development and wanted to try building one without HTML, CSS, or Javascript or If you have mobile development in Flutter and want to expand your skills as a web developer or If you are a traditional web developer, and you want to try creating a website in another way.

Enroll now: Create a Simple Landing Page with Flutter Web and Firebase

Summary

Title: Create a Simple Landing Page with Flutter Web and Firebase

Price: $74.99

Average Rating: 4.25

Number of Lectures: 86

Number of Published Lectures: 85

Number of Curriculum Items: 86

Number of Published Curriculum Objects: 85

Original Price: $39.99

Quality Status: approved

Status: Live

What You Will Learn

  • Build a Complete, Real World Website with Flutter Web and Firebase
  • Learn Firebase Services such as Firebase Firestore, Firebase Authentication and Firebase Hosting
  • Build a Landing Page to show off your other Social Media Links
  • Become proficient in one of the fastest growing technologies
  • Build a website without learning HTML, CSS and Javascript
  • Learn State Management with Providers, Proxy Providers and Stream Providers
  • Learn Advance State Management with Change Notfier and Change Notifier Proxy Provider
  • Learn Firebase Emulator Services such as Firestore Emulator
  • Who Should Attend

  • If you are interested in web development and wanted to try building one without HTML, CSS, or Javascript
  • If you have mobile development in Flutter and want to expand your skills as a web developer
  • If you are a traditional web developer, and you want to try creating a website in another way
  • Target Audiences

  • If you are interested in web development and wanted to try building one without HTML, CSS, or Javascript
  • If you have mobile development in Flutter and want to expand your skills as a web developer
  • If you are a traditional web developer, and you want to try creating a website in another way
  • Have you discovered Flutter and enjoyed the experience creating fast and beautiful apps? However, you want to create a website but do not want to learn another web framework or language? Well, this course is for you, Flutter Web with Firebase.

    Flutter is not only great at creating fast and beautiful apps, it is now venturing into websites and desktops. Therefore, Flutter would be an excellent framework where you code once and build anywhere.

    In this course, you will learn how to (in no order):

    1. Build a website from scratch using Flutter framework

    2. Implement routing according to users input URLs

    3. Use Firebase hosting to launch your website live in the internet

    4. Implement Firebase authentication and enable routings for different users

    5. Use Firestorein the Flutter Web app to do CRUD (create, read, update and delete) functions

    6. Implement the provider package to expose data from the Firestore

    7. Use advanced provider classes such as proxy provider and change notifier proxy provider, to interact with the Firestore

    At the end of the course, you will have a full understanding of the basics implementation of web development in Flutter Web.

    Don’t just take my word for it, see what my past students had to say about my courses:

    “First of all, hands off to the Instructor for making the course so lively and understandable. As a beginner, I didn’t expect to understand the concept so well. Also, the assignments given have helped a lot to self-evaluate myself. Overalla great experience!” – Ash

    “Haris is covering stuff that you won’t find in other Flutter courses. He does so in a funny, engaging way. Pretty advanced stuff but easy to understand. Amazing how much he knows about Flutter and how well he delivers it.” – Willard Jansen

    “I thought the course was great.” – JW Truver

    “Yes, the way you present the class is great. The examples that you use to compare real life situations with programming is the one which I found the most engaging. As a beginner, I was able to understand about programming concepts better than I imagined. Thank you for that!” – Aiswarya Deepak

    “He’s fast, funny, and straight to the point.” – Jeffrey Heisler

    Course Curriculum

    Chapter 1: Intro to Flutter Web with Firebase Course

    Lecture 1: Download the Course Syllabus

    Lecture 2: What is Flutter Web?

    Lecture 3: Why Flutter Web?

    Lecture 4: How to Fully?Make Use of the Course

    Lecture 5: Join the Learners Community

    Chapter 2: Setup and Installation

    Lecture 1: Prerequisites for Flutter Web Development

    Lecture 2: Overview of the Process

    Lecture 3: [Windows Setup] Installing Flutter SDK, Visual Studio Code and Chrome

    Lecture 4: [Mac Setup] Step 1: Install Visual Studio Code

    Lecture 5: [Mac Setup] Step 2: Install Flutter SDK

    Lecture 6: [Mac Setup] Step 3: Install Chrome

    Lecture 7: Setup Web Support for Flutter

    Lecture 8: Visual Studio Configurations and Extensions

    Lecture 9: Links to Visual Studio Configurations and Extensions

    Chapter 3: 1 – Create Links Landing Page with Flutter Web

    Lecture 1: Overview of Project

    Lecture 2: Create circle profile picture

    Lecture 3: Creating empty spaces

    Lecture 4: Create social media handle

    Lecture 5: Creating buttons

    Lecture 6: How to cater to different sizes

    Lecture 7: Create more buttons

    Lecture 8: Create buttons dynamically

    Lecture 9: Make buttons go to website

    Lecture 10: Create footer

    Lecture 11: Refactoring

    Lecture 12: Source Code – Links Landing Page

    Chapter 4: 2 – Create Settings Page

    Lecture 1: Layout of Setting Page

    Lecture 2: Routing

    Lecture 3: Not Found Page

    Lecture 4: Refactoring

    Lecture 5: Layout of Preview

    Lecture 6: Layout Builder

    Lecture 7: Borders Using Aspect Ratio

    Lecture 8: Button Settings Section – Text and Button

    Lecture 9: Reordable List View

    Lecture 10: Refactor Reorerable List View

    Lecture 11: Source Code – Settings Page

    Chapter 5: 3 – Providers with Firebase

    Lecture 1: Instructions to download Firebase Command Line Interface (CLI)

    Lecture 2: Connect to Firebase

    Lecture 3: Add Firestore Emulator in Project

    Lecture 4: Use Firestore 7.20.0

    Lecture 5: Stream Builder to Show Data

    Lecture 6: Stream Builder Simply Explained

    Lecture 7: Convert Firestore document to Dart objects

    Lecture 8: Create no-data-shown UI

    Lecture 9: Provider Simply Explained

    Lecture 10: Provider with Stream Builder

    Lecture 11: Proxy Provider

    Lecture 12: Stream Provider

    Lecture 13: Source Code – Providers with Firebase

    Chapter 6: 4 – Firestore Database

    Lecture 1: Refactor Add Button

    Lecture 2: Show Dialog

    Lecture 3: Dialog Actions Section

    Lecture 4: Navigator explained

    Lecture 5: TextFormField explained

    Lecture 6: Validation with Global Key and Form State explained

    Lecture 7: Firestore Add Function

    Lecture 8: Refactoring

    Lecture 9: Multi Provider Simply Explained

    Lecture 10: Create toMap method

    Lecture 11: Get the id of the document

    Lecture 12: Challenge: Create Delete Alert dialog

    Lecture 13: Add Delete Firestore

    Lecture 14: Create Edit Dialog with Edit Firestore Function

    Lecture 15: Optimise Firestore updates

    Lecture 16: Text controller save in context

    Lecture 17: Source Code – Firestore Database

    Chapter 7: 5 – Firebase Authentication

    Lecture 1: Login UI

    Lecture 2: Login Validation

    Lecture 3: Firebase Auth Setup

    Lecture 4: Asynchronous Concept: Future

    Lecture 5: Advanced Routing

    Lecture 6: Firebase Auth Sign Out

    Lecture 7: Source Code – Firebase Authentication

    Chapter 8: 6 – Reorderable List View

    Lecture 1: Reorderable List View

    Lecture 2: Change Notifier explained

    Lecture 3: Change Notifier Proxy Provider explained

    Lecture 4: Firestore Batch

    Lecture 5: Reorder function with Firestore

    Lecture 6: Source Code – Reorderable List View

    Chapter 9: 7 – Launch Flutter Web Live with Firebase Hosting

    Lecture 1: Firebase Hosting

    Lecture 2: Flutter Web Personalisation

    Lecture 3: Source Code – Firebase Hosting

    Chapter 10: Just the beginning

    Lecture 1: Congratulations!

    Lecture 2: Your Feedback is Important!

    Instructors

  • Create a Simple Landing Page with Flutter Web and Firebase  No.2
    Haris Samingan
    Developer and Instructor
  • Rating Distribution

  • 1 stars: 5 votes
  • 2 stars: 2 votes
  • 3 stars: 14 votes
  • 4 stars: 47 votes
  • 5 stars: 72 votes
  • Frequently Asked Questions

    How long do I have access to the course materials?

    You can view and review the lecture materials indefinitely, like an on-demand channel.

    Can I take my courses with me wherever I go?

    Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!