A Simple Flutter Web App

This is the most simple, yet useful, web app I could come up with

Constantin Stan
6 min readDec 31, 2020

What we'll build?

A simple web app called The Background App. It'll be just a canvas colored with a default color. We'll be able to manipulate the color by passing it as a parameter in the URL of the browser.

Why is this useful? Sometimes I want to grab screenshots of certain on-screen elements and have a specific color fill as background. So the use case will be that we'll go to that web app, set the desired color, and bring the elements we want to capture on top. Then, we do the capture with Cmd + Shift + 4 on Mac, or Windows key + Shift + S on Windows.

The environment

I'm developing a simple example web app using the latest master channel. The development machine that I'm using is a Mac and the IDE of choice for this exercise is IntelliJ IDEA Community Edition. Also, I have the Flutter SDK and the Flutter + Dart plugins installed. You can follow along using the Visual Studio Code IDE as well. Chrome browser should be installed too.

Building it up

We'll work with the Terminal, although you can create the project using IntelliJ's UI ( FileNewProject…, then select Flutter). First, we'll make sure that we…