PCを買ってからFlutterアプリを作るまで、参考になったサイトを紹介していきます。
足掛かり的ロードマップみたいなものだと思ってもらえれば嬉しいです。
紹介しているツールは全てmacOS、Windowsに対応したものがあるはず。。
1. PC環境を整える
VSCodeとGitをインストールし、連携させる
AIエディタのススメ
AIにコーディングを書いてもらう感動をぜひ味わってみてほしいCopilot(VSCode)
GitHub Copilotの使い方まとめ|VSCodeの基本機能や活用のコツを紹介
Cursor
サクッと始めるAIコードエディタ【Cursor / VS Code / ChatGPT】
Cline
AIによる開発を体験してみよう(Clineを使った開発)
それぞれ無料プランがあるから、色々試してみるといいかも。
おすすめツール
Clibor
個人的最推しツールClibor。
クリップボードの履歴管理をしてくれる。
何回もページを行き来したり、コピー元を忘れて慌てたりすることがなくなってマジ便利。
Clibor for Windows
Clibor for Mac
Warp
AIターミナルWarp。ターミナルで出現するエラーって原因にたどり着くまでめちゃ時間かかるもんね。環境変数とかどこ見たらいいか分からないこと多いし。AIに原因究明から解決まで任せてしまいましょう。
特に環境構築の時には重宝します。
Warpとはなんぞや
【macの人向け】おすすめ設定サイト
新たなMacをGetした際のおすすめ設定
↑非常に網羅的でありがたい
2. Flutterの環境を作る
Flutterをインストールする
Flutter公式インストール
これ見て分からない時は日本語の記事を見ようね
Windowsの人におすすめ
Flutter を VSCode で環境構築してみた!<Windows編>
macOSの人におすすめ
【Dart】 Flutter × VSCode で、環境構築 から HelloWorld まで(Mac)
Flutterの拡張機能(最初はいらないかも)
必要に応じて取捨選択って感じ。Flutterの書き方が分からないうちは、拡張機能ってうるさいだけに感じることが多いから、最初はいらないかも
【VSCode】2025年度版 Flutterエンジニアにおすすめの拡張機能17選
3. Flutterに慣れる
Flutterが何かを知る前に、いきなりコードを書き始めるのも大変でしょう。
Flutterを知る
Flutterとは?始める前に押さえておきたい必須知識を解説
Flutterハンズオンに取り組む
一回手を動かしてみましょう
Write your first Flutter app
一個ハンズオンに取り組んだら、もう少しレベルの高いハンズオンに取り組んでみてもいいですね
「Flutterでアプリを作りたい」と思っているあなたへ
以上!
ここまで来れば、まっさらなPCにはFlutterアプリを作るためのツールが、まっさらなあなたにはFlutterアプリを作るための知識がインストールされたはず。
あとは好きにアプリを作ってみよう!