flutterの環境構築1

Uncategorized

flutterって何?

聞いたことはあるけど何かよくわからない…

今回は、Mac Book向けにflutterとは何か、flutterの環境構築の方法を解説していきます。

flutterとは何か?

Flutterは、Googleによって開発されたフリーかつオープンソースのUIのSDKで、単一のコードベースから、Android、iOS、Linux、macOS、Windows、Google Fuchsia向けのクロスプラットフォームアプリケーションを開発するために利用されます。

flutterの環境構築

Flutter のインストール

まずFluterの公式サイトからzipファイルをダウンロードします。

まずFlutter公式サイトにアクセス後インストールを選択しMacOSを選択すると次のような画面が表示されると思います。

Flutter - Build apps for any screen
Flutter transforms the entire app development process. Build, test, and deploy beautiful mobile, web, desktop, and embed...

そしたらintelの方は左apple siliconの方は右をクリックします。そうすると下の画像のようにインストールが始まります。

インストールが無事完了するとzipファイルがダウンロードされます。そうしたらユーザーフォルダ直下に「Development」フォルダを作成し、zipファイルを解凍しflutterフォルダをdevelopmentに追加します。追加したら今度はターミナルでPATHを通します。

PATHを通す

Flutterをインストールした後、Flutterを使えるようにするには「パスを通す」という作業が必要になります

ターミナルを起動して以下を実行してください。

echo $SHELL

/bin/zshと返ってきたら使用しているシェルはzsh/bin/bash と返ってきたらbash を使用していることになります。

このシェルによって次の作業が異なってきます。

自分の環境に合ったほうを実行して進めてください。

// zshの場合
vim .zshrc

// bashの場合
vim .bash_profile

今回はzshでやっていきます。

以下のコマンドを入力し、PATHを通す作業を行なっていきます

echo export PATH="$PATH:`pwd`/flutter/bin"

pwdにディレクトリのPATHを記入します。今回は/Users/ユーザー名/Development/flutter/binになると思います。

その後さらにコマンドを記入します下のコマンドを記入してください。

source ~/.zshrc

と記入してまたコマンドを入力します

which flutter

無事にPASHが通っていたらPATHが表示されます。

そしたら下のコマンドを記入します

flutter doctor

ターミナルで上の画像のような文字が出て来れば成功です。

ここまでで、今回のflutter環境構築は終了です。また次回のブログで続きを説明します。

タイトルとURLをコピーしました