Travix
  • Introduction
  • Install Flutter with Android studio/VS Code
  • Firebase Configuration
  • Google Maps API
  • Admob & Facebook
  • Admin Panel Setup
    • Web Configuration
    • Deploy Admin Panel
    • Enable Admin Credentials
    • Admin Images load Issue
  • Android App Setup
    • Android Configuration
    • Publish App on PlayStore
Powered by GitBook
On this page
  1. Admin Panel Setup

Deploy Admin Panel

PreviousWeb ConfigurationNextEnable Admin Credentials

Last updated 7 months ago

Build the Flutter Web App

First, make sure your Flutter web app is working fine locally. You can build the app for production by running the following command:

flutter build web --no-tree-shake-icons

2. Create a Netlify Account

If you don't have an account yet, sign up at .

Create a New Site

  • Once logged in, you’ll be taken to your dashboard.

  • On the dashboard, click on "Add New Site" or "New site from Git".

  • Netlify allows deploying from different sources like GitHub, GitLab, and Bitbucket. However, for this approach, we will manually upload the files.

3. Drag and Drop the build/web Folder

  • After creating the site, you’ll see an option to "Drag and drop your site output folder here". This area is for uploading your static website files.

  • Open your Flutter project folder on your computer and navigate to the build/web directory. This directory is where Flutter stores the production-ready files for the web version of your app after running the flutter build web command.

  • Drag the entire build/web folder from your local system and drop it into the designated area on Netlify’s site.

4. Automatic Deployment

  • Once the build/web folder is uploaded, Netlify will automatically begin the deployment process. It will host the web app on its servers and generate a live link for you to access your Flutter web application.

  • The process usually takes a few seconds to a minute, depending on the size of your app.

5. Access Your Deployed App

  • Once the deployment is complete, Netlify will provide you with a URL (usually something like your-site-name.netlify.app). You can now visit this link to view your Flutter web app running live on the internet.

Additional Settings (Optional):

  • You can modify the site name to something more recognizable (e.g., yourappname.netlify.app).

  • If you have a custom domain, you can link it to your Netlify site from the dashboard.

This method provides an easy, drag-and-drop approach without requiring any coding or command-line tools, making it quick and user-friendly for non-technical users.

You can also deploy the web app using GitHub. You can also deploy your web app using GitHub. To build the app for production, use the following command:

flutter build web --no-tree-shake-icons

After building, follow the deployment steps as shown in this video for the rest of the process.

Netlify