【オンライン】Flutter ハンズオン #10 〜 カレンダーアプリ製作 〜

開催概要

今回はアプリ開発未経験の方を対象に、Flutterのハンズオンを開催します！

• アプリ開発未経験のWebデザイナーやコーダー
• その他Flutterに興味のある方

ハンズオンの内容

2021年11月の FlutterKaigi 2021 でも登壇された ちゅーやん (@chooyan) が、今回は担当させていただきます。

学ぶ内容は Flutterパッケージ、Dartパッケージの開発を学びながら作る簡単なカレンダーアプリ！
パッケージプロジェクトの新規作成から実装、それを取り込んだアプリ開発までの一連の流れを行います。

※もしご不明な点がありましたら Flutter Osaka のSlackでいつでも質問を受け付けております。

また Flutter Osaka 専用Slackの #handson チャンネルで進めますので、 招待リンク より入ってください。

事前準備

当日までに Flutter の開発環境の構築をお願いします。
flutter create でプロジェクトを作成し、最初のカウンターアプリが起動できたら OK です！

まだ環境構築ができていない方は、以下の公式ドキュメントを参考に進めてみてください。

https://docs.flutter.dev/get-started/install

いろいろ書いてありますが、大まかな手順は以下の通りです。

• SDK をインストールする
• パスを通す
• エディタ (今回使う Visual Studio Code) をインストールする

このうち上 2つについては以下でも詳しく書いております。参考にしてみてください。

SDK をインストールする

各自の環境に合わせて SDK をダウンロード、それぞれの環境でインストールしてください。

なお、今回の Flutter バージョンは 3.0.0-stable を使う予定です。

• macOS - SDK for Intel / SDK for Apple Silicon
• Windows - SDK

パスを通す

Mac をお使いの方

.bash_profile を vi で開いて以下コマンドを叩きます。

mkdir ~/project

<USER> を個別のユーザー名に置き換えて PATH を追加します。

export PATH="$PATH:/Users/<USER>/project/flutter/bin"

PATH を更新して以下コマンドを叩きます。

source ~/.bash_profile

Windows をお使いの方

C:\Program Files のようにアクセス許可が必要な場所で行うと失敗する可能性があるので注意してください。

C 直下に project フォルダを作成、ダウンロードした C:\project 直下に解凍します。そして bin フォルダを環境変数に追加します。

タイムスケジュール

講師紹介

【ちゅーやん (@chooyan_i18n)】

フリーランス Flutter アプリ開発者。企業向け研修の講師もやってます。

Flutter の画像切り抜きパッケージ crop_your_image をはじめとしたパッケージ開発と Flutter の内部実装の調査が趣味です。Zenn で 「内側から理解する Flutter 入門」 を販売中。

行動規範, Code of Conduct

https://flutter-osaka.netlify.app/#行動規範-code-of-conduct

ロゴマークについて

Flutter's identity system に従って使用しています。