2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

まっさらなPCとまっさらなあなたをFluttererにしちゃいたい

Last updated at Posted at 2025-03-29

PCを買ってからFlutterアプリを作るまで、参考になったサイトを紹介していきます。
足掛かり的ロードマップみたいなものだと思ってもらえれば嬉しいです。

紹介しているツールは全てmacOS、Windowsに対応したものがあるはず。。

1. PC環境を整える

VSCodeとGitをインストールし、連携させる

開発環境を整える(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アプリを作るための知識がインストールされたはず。

あとは好きにアプリを作ってみよう!

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?