Flutter Crash Course #3 - Installing on a Mac

Key Takeaways

all righty my friends so in this lesson I'm going to show you how to install flutter on a Mac if you're not working on a Mac and you want to install flutter on Windows make sure you check out the previous video where I show you how to do that instead anyway on the flutter docks we want to click on get started and this time we want to choose Mac OS and then you can select the type of device you want to start making applications for now I'm going to choose Android for now because for the rest of this series I'll be working with an Android emulator on windows so if you're on a Mac but also want to follow along exactly the same way as me and work with an Android emulator to begin with then you should select Android to there are a couple of extra steps you need to take if you choose iOS and I will go through those later on in the video but for now let's just set things up so we can at least use flutter to develop Android apps now the first thing we actually need to do is figure out if we're using a Mac which runs on Apple silicon or not because if we're using Apple silicon there's an extra step we have to take before we start installing flutter and that is to run this Command right here so to figure this out just go to the Apple icon then select about this Mac and on this window look for the Apple M1 or M2 Chip if you have one of those values then your Mac has a silicon chip and if that's the case you need to copy this Command right here open your terminal and then paste it in and hit enter and wait for that to install right then next up if we go back to the do Bo we see that we need to install Android studio and git now I'm going to come back to Android Studio later in the video but the easiest way to install git is to use Homebrew which is a package manager for Mac OS you might already have Homebrew installed on your computer but if not you can install it by going to brew. sh copying this Command right here and then pasting it into your terminal once it's installed to install a package using it we can just say brute install and then whatever package we want to install so in this case that would be Brew install git right so type that into your terminal and hit enter to install it right so next I'm going to scroll all the way down to where we can install the flut SDK and then select download and install and we've got two options we' got one for a Mac with an Intel processor and one for Mac with apple silicon so if your Mac is using Apple silicon which we just checked then download this version if not download the other version now if you look down here you'll see we need to make a folder to install flutter in and it suggests one called development in your home directory you don't have to call it that it's just a suggestion but once we have that folder we need to unzip the contents of the downloaded folder into it and you can either do that manually or by using a command like this okay so I've already unzipped the contents of that flutter download and you can do that by just double clicking on the zip folder and this is the unzipped content right here this flutter folder so now we just need to move that to a location in our home directory so I'm going to go to my home directory first of all and you can see I've already made a new folder called development but you can call it something else if you want just make a new folder and this is where I'm going to move the flutter folder too so just drag that over like so and now we've installed flutter into this location next though we need to add flutter to the path environment variable so that we can run flutter commands in the terminal which we need to do now the way we do this varies depending on which shell your Mac runs to find out which version you're running open your terminal and type Echo and then a dollar sign shell and hit enter and the return of this is probably either going to be Zed shell or bash now if it's Zed shell which it most likely will be if you bought your Mac in probably the last four years then you'll want to edit your Zed shell environment file in the home directory or if you don't already have that file you can create the file by typing touch and then zsh NV now if you don't know whether you have this file which is a hidden file by the way so you might not see it in your finder then you can type LS and then space and then hyphen a to list all of the files including hidden ones and if you do this in your home directory you'll either see that file or you won't I can see it because I just created it using that touch command anyway once you have that file open it by typing open then a space then zsh EnV press enter and when you're inside this file we just need to paste in a single line which we can grab from the flutter docks so if you head back over there and scroll until you see the section about adding flutter to your path you can copy this line right here then we can go back to the file and we can paste that in now if you didn't put flutter inside a directory called development you need to update this directory name right here in the path to be whatever folder you put the flutter folder in okay so now save that file and close it and we've added now flutter to the path variable so we can use flutter commands in the terminal if your shell version is Bash or something else then you're going to find detailed information about how to add flutter to the path variable by clicking on this link right here on the DOT and you can find out more about it there all right so now if you close your terminal down and then reopen it we should be able to start using flutter commands and also you can type in which and then a space and then flutter to verify the location flutter was installed in or installed on rather on your computer all right so now we have flutter installed next up we need to install Android Studio so if you scroll right up to the top of this getting stting guide you're going to see a link to download Android Studio once you've clicked that you're going to see another link and you're going to have to click on that to get the latest version and then finally on this page we can see this button to download it so click on that you might need to scroll through some agreements and accept those at the bottom before the download starts but then once it's downloaded when we come to install Android Studio we need to make sure that certain components are installed as well and and we can find a list of those components back on the getting started guide if we scroll right down to where it says configure Android Studio so they're all here right here we'll make sure all of those components get installed along the way okay so now you've downloaded that you want to double click on the download for Android Studio just grab it and take it into the applications folder right here to install it and then you want to double click on this to start it up and then we're going to open this right here and we're not going to import any settings so let's say okay so I'm going to say send that's absolutely fine okay so let's walk through this now I'm going to click on next and then we're just going to go with standard for now any components extra that we want to install we'll do that later but you can see it's already going to install these components that we need build tools emulator platform platform tools Etc so let's go next for now and then I'm going to accept this we have to go through each of these and accept that one as well and then finish all right so now that's all done click on finish and what we're going to do is go to more actions first of all and then SDK manager we're just going to make sure that all the components that we need are installed so so first of all I'm going to install this API level right here which is suggested on the flutter dock so click on that and then if you go to SDK tools we can see we already have the build tools which we need the emulator the platform tools but if we go back to the docs we're going to see what else we need so we have this just selected now so we need the command line tools the build tools the platform tools and the Android emulator so let's go back to Android studio and just check that so SDK tools okay so we need to check this one right here as well and we have the rest so once you've checked all of those just click on apply and it's going to install all of these for us okay so now we can click on finish and okay over here the next thing we want to do is set up a emulator an Android emulator so we can test our flutter applications on that later on so we're going to go to more actions this time go to virtual device manager and you can see I already have one right here but you can create a new one by clicking on that plus icon right here you can choose something from this list I'm going to select pixel 6 and then click on next you can choose your API level right here I'm going to choose 33 so I can download that all right and then we can click on finish so now we've selected that we can click on next and then you can give this a name if you wish the one thing I will change is this thing right here the ulated performance I'm going to change that to hardware and then I'm going to go to finish and now we have this thing right here our new emulator so if you want to open that you can click on this play icon and then we can see this emulator right here so we don't need it just yet I'm going to cross it off but later on you can use that now to preview your flutter applications on all right now once you've fully installed Android studio and those different components there is one more thing we need to do so if we scroll down here we need to accept the Android licenses before we can start using Android with flutter so all you need to do is grab this thing right here this command you can copy it by clicking this head to your terminal and then just paste that in and press enter now if you previously already agreed to these licenses it's going to give you a message to say as such otherwise you're going to be able to accept everything okay so it says here review licenses that have not been accepted you can click on yes if you want to you can accept them by clicking on yes and yes again and again and again and now they've all been accepted awesome so now we can clear this and carry on all right then so now we have flutter installed we have Android Studio installed and we also created an Android emulator that we can use later on to preview our flutter applications on so just very quickly now I want to run a flutter command in the terminal which is flutter space doctor and this command runs a little diagnostic for us to make sure everything that we need to to start making flutter apps is installed now it might just take a minute or two to run through this especially first of all but when it's done you're going to see a bit of a checklist now anything with a green tick on this list is a requirement that we've already met and anything with a cross is something that we've not yet done and we might need to do now in our case you're going to see a bunch of green ticks for things like flutter being installed Android studio and vs code Etc but there's probably going to be a Red Cross next to something called xcode unless you've already installed it and in that another Red Cross next to something called cocoa pods now these things are actually requirements that we need to install if we want to develop applications for iOS and not just Android so I quickly want to walk you through how to install both of these things right now first of all xcode you can get from the App Store all you need to do is search for xcode it's going to be the first option that comes up and you can just click on this Cloud icon to download it and then install it okay the next thing we need to install is a dependency manager Forex code called cocoa pods which the flutter documentation links to right here if you click on that link you're going to see how to install it using this command which is pseudo gem install cocoa pods however I would actually recommend installing cocoa pods using home brew instead which is easier to do so to do that you can check out the home brew website where you're going to find this Command right here Brew install Coco pods so all you need to do is copy that command head back to your terminal and you want to paste that in and then just hit enter to install it okay then so now let's run flutter doctor one more time and hopefully this time fingers crossed we're going to see just green ticks all over the show and no red crosses if you do see any red crosses though just go back through each step carefully for that requirement and just make sure you installed everything the right way okay anyway now we've got everything set up on a Mac in the next lesson we're going to make our very first flutter application