Host Flutter Web Project on Github

 Host Flutter Web Project on Github

 Introduction

Flutter isn’t just for mobile apps—you can also build and host Flutter Web apps easily. One of the simplest free ways to make your app public is by using GitHub Pages. In this guide, we’ll walk you through hosting your Flutter web project directly on GitHub so anyone can view it through a URL.

🚀 Steps to Host Flutter Web Project on GitHub

Step 1: Create Flutter Project 

flutter create hostweb

Step 2: Build Flutter Web Project

flutter build web

This creates a build/web/ folder with all necessary web assets.

Step 3: Create New Github Repository

• Go to Github
• Click on New Repository
• Give Your Github Owner Name  with .github.io
• Make Visibility to Public
• Click on New Repository and create repository
• 
  
  

Step 4: In Flutter Project ,after web is successfully build go to web by 

cd build

cd web

Step 5: Initialize Git Locally

git init

git remote add origin https://github.com/your-username/your-repo-name.git

Step 6: Push code to github

git add .

git commit -m "Initial commit"

git push -u origin master/main

Step 7: Enable Github Pages

 Go to Pages Section of your repo by settings -> pages

Step 8: Enable Branch & Save

In here , select the branch and save it.

Wait for about 2 -3 minutes, for repo to be deployed

Step 9 : Visit the obtained link

You will get link like this https://confusedstudent20.github.io/ based on your repo

Conclusion: Hosting your Flutter web project on GitHub is a simple, free, and effective way to make your app publicly accessible. With just a few commands, you can build your Flutter web app, push it to a GitHub repository, and deploy it using GitHub Pages. This method is perfect for showcasing your portfolio, demos, or static web apps without needing a paid server or complex setup.