Chore: How to run the `learn-flutter/demo_app`? 🤷‍♂️

[nelsonic]

At present the /demo_app is just a directory without any helpful info:

This super unhelpful to someone who is new to Flutter. It forces them to go searching for how to run the app.

In the /README.md there is no instance of a git clone instruction:

So the demo_app is an "island" that nobody knows how to reach. Worse it's decaying code that will "rot" over time because nobody will update it. 😢

Todo

We need to:

• [ ] fix this oversight and integrate the demo_app into the main README.md or create a new README.md inside /demo_app so that people at least know how to run it. 💭

[nelsonic]

If we are going to place a large bet on using Flutter for our App, this is unacceptable. In it's current state I would grade this tutorial a C-, passable, but not great. It needs to be an A+ and a reference that anyone can use to learn Flutter as fast as possible.

[nelsonic]

Obviously it's my fault for not giving enough feedback on the PR: https://github.com/dwyl/learn-flutter/pull/69 But I ran out of steam on reviewing it. There was just "too much" that needed to be done... 😖 So I'm picking off this small piece of it now.

[nelsonic]

Watching: Flutter Tutorial - How To Run App On Android Emulator & Run App On Android Device [2021]: https://youtu.be/QjgmTiD8prA

[nelsonic]

This is an example of an unconstrained and non-highlighted screenshot:

It requires a lot more effort for the reader to read and understand what they are looking for in the image.

By contrast, this is a constrained and annotated screenshot:

But ... the screenshot was captured on a 4k Display so it's tiny 🔍 So the Engineer who want's to make A+ docs will go the extra mile and Google: https://www.google.com/search?q=android+studio+change+size+interface Answer: https://stackoverflow.com/questions/45124698/change-ui-font-size-in-android-studio

Before:

After:

This results in the interface in my Android Studio being considerably larger so the screenshot is clearer:

Yes, this takes an extra minute for the person writing the docs. But it saves 10 seconds forEach person reading the doc. So as an org, we only need 6 people to read the clearer doc to have a net positive effect. And since we know that our docs are read by thousands of people. We want to always make the extra effort to make everything as clear as possible. This is what A+ looks like.

How You Do Anything Is How You Do Everything ... https://medium.com/thrive-global/how-you-do-anything-is-how-you-do-everything-bc6e264e40ee

[nelsonic]

Create a sim device:

Stick with the defaults for the system image and just click Next:

Accept all the defaults and click Finish to complete your virtual device setup:

Your device manager should now contain the newly added device:

[nelsonic]

In Android Studio I have the demo_app/lib/main.dart running in the Pixel 6 Simulator:

At the top of Android Studio I see the following message: "Dart SDK is not configured"

If you click on the "Download Dart SDK" it will open a Web Page: https://dart.dev/get-dart

Ran the suggested commands:

brew tap dart-lang/dart
brew install dart
brew info dart

Got:

==> dart-lang/dart/dart: stable 2.19.0, HEAD
SDK
https://dart.dev
Conflicts with:
  dart-beta (because dart-beta ships the same binaries)
/opt/homebrew/Cellar/dart/2.19.0 (1,039 files, 612.5MB)
  Built from source on 2023-01-30 at 22:00:31
From: https://github.com/dart-lang/homebrew-dart/blob/HEAD/Formula/dart.rb
==> Options
--HEAD
    Install HEAD version
==> Caveats
Please note the path to the Dart SDK:
  /opt/homebrew/opt/dart/libexec

Attempted to run:

brew upgrade dart

Got:

Warning: dart-lang/dart/dart 2.19.0 already installed

So already have the latest version, at least according to the Brew cask.

But in Android Studio I still see the error: "Error: a path to Dart SDK is not specified.":

Read: https://stackoverflow.com/questions/48650831/dart-sdk-is-not-configured

Ran

flutter doctor -v

Shows:

/opt/homebrew/Caskroom/flutter/3.3.8/flutter

So ...

/opt/homebrew/Caskroom/flutter/3.3.8/flutter/bin/cache/dart-sdk

Open preferences: ⌘+, Open Dart settings and paste this path into the path field:

[nelsonic]

cd learn-flutter/demo_app

flutter packages get

Meanwhile, followed instructions in: https://docs.flutter.dev/get-started/test-drive

and got the demo_app (Todo List) running in the iOS iPhone SE Sim:

[nelsonic]

https://github.com/dwyl/learn-flutter/blob/9f684aaa8e6b72dc80c8e6dfb76836928c6966a4/demo_app/lib/repository/todoRepository.dart#L16 Loads data from: https://jsonplaceholder.typicode.com/todos

Dunno why this needs to load remote data and not allow addition of any new Todos. But at least it works. ✅

[LuchoTurtle]

This should be marked as "done", since #74 has already been merged, in my opinion.

[nelsonic]

Thanks for tidying up @LuchoTurtle 👌