Create a web app using Flutter (with setup)

Photo by Erwan Hesry on Unsplash

Step 1: Install Flutter

Step 2: Install VS Code & Extensions

Step 3: Verify Installation

Step 4: Create a Flutter web app

  • Open Command Palette from View menu of VS Code menu bar or with shortcut Ctrl+Shift+p.
  • Enter & select Flutter New Web Project
  • For the first time, a notification popup will appear stating “Stagehand needs to be installed to use this feature.”
  • Click on Activate Stagehand.
  • Enter project name eg. chuck_norris_jokes and provide a location for your project.
  • Now it will take a few time to resolve dependencies. Once resolved you will see notification “Your project is ready.”
  • Run project from the menu Debug=>Start Debugging or shortcut F5.
  • For the first time, it will ask for the environment. Select Dart & Flutter.
  • For the first time, a notification popup will appear stating “webdev needs to be installed to use this feature.”
  • Click on Activate webdev.
  • Once webdev is activated, a browser will launch the beautiful Hello World page.

Step 4: Fetch & display joke

  • First, we will clear lib/main.dart
  • Add http package to dependencies.
  • Add method to fetchJoke() Inside HomePage class
  • Now replace the static body with FutureBuilder widget.

--

--

--

Developer Android, Flutter

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Installing Kubernetes cluster on Ubuntu 20.04 or Raspberry Pi (Ubuntu)

Why you should learn automation, even if you never code

Photo by NeONBRAND on Unsplash

Setting up our Servers

| Engineering News-Record

TryHackMe Anonforce Writeup

Saner Concurrency

Setting up a CI/CD pipeline for API development with WSO2 API Manager, Github, and Jenkins

How to install yarn quickly (macOS)

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Dhiraj Sharma

Dhiraj Sharma

Developer Android, Flutter

More from Medium

Integrate Sentry with Flutter

Flutter Authentication with Firebase.

Becoming a Pro from Noob Flutter Developer|UI|Dart

How to create a custom plugin in Flutter ?

How to create a custom plugin in flutter