What the Flutter?

Rules were meant to be broken and I’m running headlong into this new rabbit hole for no real reason other than the fact that I have the attention span of drunken roadkill. This rabbit hole is called Flutter, which seems aptly named after my brain’s inability to stay on point, but rather to flutter from one thing to the next. Per Flutter’s web page, “Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase.“ I can’t honestly say how far along I will venture on this endeavor, but the ability to create my own mobile applications has always intrigued me, but has also always been outside my realm of knowledge. I have had rudimentary investigations into XCode, but have never really spent any time on it and have not even acquire my iOS developer access for $99 a year. I know, I’m a cheapskate. This is an opportunity to see if my braincells have hope of grasping these concepts, to see if my discipline will allow me to persist in my investigation long enough to reap the benefits and finally to be able to deploy my application to many endpoints making the effort all worthwhile.

Am I On The Right Path?

Getting started with this requires downloading the zip file from Flutter’s website and unpacking where I want, then setting my PATH to know where it is. As it is literally EVERY TIME I HAVE TO SET MY PATH, I screw it all up… this time was no different. Long story short, I first didn’t close the quotes in my .zshrc file, then I simply didn’t put in the right path to my flutter/bin. An easy fix really, but this stuff always takes me friggin forever.

Once that was squared away, I ran flutter doctor in the Terminal, which let me know that Google will be spying on me if I choose to use this application (fucking bastards). I didn’t see any ability to opt out of this either. After that was complete, I see a few issues. First, I do not have Android SDK installed. Obviously, it would need this for me to deploy Android applications, but for now, I’m going to stick to iOS, until I have an app I want deployed for multiple platforms. Same thing for Android Studio. For the XCode section, it says I’m missing something called CocoaPods. CocoaPods is used to retrieve the iOS and macOS platform side’s plugin code that responds to your plugin usage on the Dart side. Without CocoaPods, plugins will not work on iOS or macOS. I’m going to go ahead and remedy this, and see about getting CocoaPods installed.

CocoaPods is built with Ruby, so I used RubyGem to install, which calls for installation using sudo. I tend to balk at that process, so I used the sudo-less method, which seemed safer, but required me to make some mods to my .zshrc file to get the PATH squared away… I bet you can imagine how that all worked out. After wasting some time with that, I gave up and went back to the originally recommended method using sudo and got it installed w/o any apparent issue right away. I went back and ran flutter doctor again, and CocoaPods is no longer being flagged.

OK, so I lied. I’m installing Android Studio and then the Android SDK. Don’t ask me why. One thing though… I don’t understand Homebrew. I’ve used it a few times now and I never know where is puts anything. Same just happended here. I decided to instal just the Android SDK and used Homebrew. Of course, Flutter couldn;t find it and I noticed then that Flutter provided different instructions on how to do all this. I had to wonder to myself why I always seem to gravitate toward the hard way first in everything. So I hunted down the Homebrew installation of the Android SDK and am now installing Android Studio. From within Android Studio, I will pull in the SDK and see if Flutter approves.

This actually took me awhile. There are some issues with the Android licenses that took some additional Googling and installations, but I finally got it worked out. Flutter says, “No issues found!”

Test Drive, Vroom Vroom!

After all that B.S. with Android Studio, I’m still going to take my leap into the Flutter foray using Visual Studio Code. On first glance, Android Studio looks exactly like XCode, which is pretty much over my head. I’m hoping to gain some initial familiarity using VS Code, so that I don’t bail out on this right away.

Jumping in to VS Code, I needed to pull up the Command Pallette (cmd + shift + p) and enter flutter and then select Flutter: New Application Project, but of course, nothing shows up in the command pallette for Flutter. The Flutter Dart Code Plug-in was supposed to install automatically when I installed Flutter on my machine… not sure what happened there, but I just searched Flutter in the VS COde plug-ins and installed it myself. I did get a VS Code message asking me how I wanted to configure my Dart Code settings, but since I don’t know shit about this, I went with the recommended Dart Code settings. I was then able to create a basic project instance using Flutter: New Application Project in the Command Palette, which not only created the file structure, but included a really basic button click-counter application. How do i know what it was? Well, I hit the Play button in the little control panel that I assume is part of the Dart plug-in I just installed and it ran the application in Chrome as a web app. Pretty neat-o! But wait, it gets better. There’s a device selector in the status bar at the bottom right of VS Code. I clicked it and it opened my Command Palette, which listed the devices I had available. I changed it to iPhone SE and then clicked the play button again… XCode launched an iPhone simulator with the same button counter app… FROM THE SAME CODE! I then switched the device in VS Code again, this time to a Pixel 3. When I ran the ssame code this time, Android Studio launched the Pixel 3 emulator running the button counter app. I must say, I’m impressed.

Looking back at my default project in VS Code, I see a file called main.dart. First time I’ve seen Dart code and it looks a lot like OOP JavaScript… I might actually be able to figure this stuff out! All in all, I’m pretty excited about this. Admittedly, this rabbit hole is turning into a pretty big cave, but the stalactites are so pretty… I might have to stay for awhile. More to come for sure!