Flutter勉強会 一回目10月15日(月) 13時~

Flutter勉強会を行ったのでその感想とFlutterの所感と行ったことの記録をしていきます。

Flutterとはクロスプラットフォームで開発できるGoogleが作ったフレームワークでマテリアルデザインで作成されます。iOS/Android,Webのフロント、サーバーサイドが作れるらしいです。

勉強会はエンジニア2人、デザイナー1人、絵師さん1人の四人が集まりました。

勉強の教材は公式サイトを使いました。

公式サイト
https://flutter.io/

環境は皆Macで共通して行いましたがWindowsでも似たような感じでセットアップできると思います。

時間がかかったポイントとしては環境設定でしょうか。必要なものが多いのでダウンロード、インストールに時間がかかります。パスの設定やコマンドで打ち込みが基本となるのでエンジニアの人には楽に設定できそうですがデザイナーの方や慣れてない人は苦戦するかと思います。flutterのバイナリへのパスをうまく通すことができたら下記のコマンドで開発環境の診断をしてくれます。足りない場合、コマンドも書いてあるのでそれに沿って行えば環境は揃えられます。

flutter doctor

Google先生はIDEとしてVSCodeかAndroidStudioを推奨しています。
我々はVSCodeで行いました。

ざっくり開発できるまでの手順を書きます。

・flutterをダウンロード
・解凍して適当なところにフォルダを移動させます。日本語パスは途中でうまく動作しないのでNGです。半角スペースも気をつけたほうがいいかもしれないです。
・flutter/binにパスを通します。.bash_profileに書いておきましょう。
・homebrew必須です
・cocoapods必須です。
・xcode必須です。xcodeは特に重いので勉強会やら何やらやるときは事前にインストールしておきましょう。
・VSCodeのflutterプラグインをインストール
・実行する前にVSCode右下がno deviceになってるのでiOSエミュレータを選択します。
・デバッグを実行でビルドが始まりエミュレーター内で動作します。

「Write Your First Flutter App」part 1とpart 2まで行いました。
サードパーティの辞書を読み込んで2つのワードを組み合わせてListViewに表示させる、さらにワード毎にお気に入りのチェックが出来てハンバーガーメニュー?から選択したお気に入り画面に遷移するというところまでがpart2ですね。
part3は無いようです。

一言感想を言うならば

hot reload 便利!

ソースを変えてセーブするだけでエミュレーター上の内容が変わります。
わざわざビルドしてアプリの生成しなおしとかしません。

バージョンがまだ0.9.4なのが不安ポイントですがflutter自体は面白いです。

flutterの仕組み自体が結構謎ではありましたがDart自体も良くわかってないので勉強が必要そうです。flutterはwidgetの中にwidgetを入れていくイメージです。今のところのイメージですが。

日本語の記事は少ないので基本公式サイトを見るのがオススメです。
英語力が弱い人はGoogle翻訳使いましょう。私もバンバン使ってます。

受注系の仕事に組み込むのはまだ不安ですが自作アプリだったらflutterメインに使っていってもいいかもしれないですね。

次回勉強会も10月22日(月)予定です。

技術書典5 参加します こ34 スカゼミ

こ34スカゼミ

本の目次です。

はじめに 2
第 1 章 Composer で private なリポジトリを使う 5
1.1 対象読者 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.2 概要 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.3 GitHub に private リポジトリを作る . . . . . . . . . . . . . . . . . . . 6
1.4 GitLab に private リポジトリを作る . . . . . . . . . . . . . . . . . . . 17
1.5 Bitbucket に private リポジトリを作る . . . . . . . . . . . . . . . . . . 25
1.6 まとめ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
第 2 章 CSS でゲームを作る その 2 38
2.1 作ったもの . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
2.2 機能 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
2.3 画⾯遷移の実装 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
2.4 クイズ問題⽂の表⽰ . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
2.5 正誤判定 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
2.6 時間切れを表⽰する . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
2.7 Wait する . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48
2.8 デバッグ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
2.9 おわりに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
第 3 章 カラーフォントのつくりかた 52
3.1 はじめに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
3.2 カラーフォントとは . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
3.3 OpenType-SVG フォントの作り⽅ . . . . . . . . . . . . . . . . . . . . 53
第 4 章 A5:SQL Mk-2 の紹介 55
4.1 A5-MK2 とは . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
3
⽬次
4.2 今回の概要 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
4.3 MySQL のダウンロード&インストール . . . . . . . . . . . . . . . . . . 57
4.4 A5:SQL Mk-2 のダウンロード&起動 . . . . . . . . . . . . . . . . . . . 77
4.5 データベース情報の Excel 出⼒ . . . . . . . . . . . . . . . . . . . . . . 86
4.6 データベースの変更差分取得 . . . . . . . . . . . . . . . . . . . . . . . 86
4.7 そのほか Tips(INSERT ⽂の出⼒・⾃動コミット OFF・ER 図の作成) 88
著者紹介 89

コミケ参加します 一日目 8月10日 金曜日 西地区“め”ブロック-03a

UnityとSpring boot とLaravelとRxJSのお話を書いています。

 

⽬次
はじめに

第 1 章 Unity のゲーム開発で役⽴つあれこれ 5
1.1 List のちょっとした落とし⽳ . . . . . . . . . . . . . . . . . . . . . . . 5
1.2 ゲームをマルチシーンで開発する . . . . . . . . . . . . . . . . . . . . . 11
1.3 ADV ゲーム⾵のテキスト表⽰ . . . . . . . . . . . . . . . . . . . . . . . 21
1.4 ボタン配置の変更機能について考える . . . . . . . . . . . . . . . . . . . 24
1.5 参考資料 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34

第 2 章 Java で Spring boot 触ってみた 35
2.1 仕組み . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
2.2 今回の Spring boot の使⽤の流れ . . . . . . . . . . . . . . . . . . . . . 36
2.3 実際にやってみる . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
2.4 この章の終わりに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80

第 3 章 Laravel のライフサイクルをソースで追跡 81
3.1 対象読者 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
3.2 概要 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
3.3 インストール . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82
3.4 はじめの画⾯ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
3.5 前提知識その 1 ルーティング . . . . . . . . . . . . . . . . . . . . . . . 83
3.6 前提知識その2 サービスコンテナ . . . . . . . . . . . . . . . . . . . . . 83
3.7 前提知識その3 ミドルウェア . . . . . . . . . . . . . . . . . . . . . . . 84
3.8 前提知識その4 ::class . . . . . . . . . . . . . . . . . . . . . . . . . . . 84
3.9 前提知識その5 メソッドチェーン . . . . . . . . . . . . . . . . . . . . . 85
3.10 個⼈的な⾔葉の⾔い回し。 . . . . . . . . . . . . . . . . . . . . . . . . . 85
3.11 index.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85
3.12 A. autoload ファイルの読み込み . . . . . . . . . . . . . . . . . . . . . 86
3.13 B. Laravel のコアとなるオブジェクトの作成 . . . . . . . . .  . 86
3.14 C. Http カーネルの作成 . . . . . . . . . . . . . . . . . . . . . . . . . . 93
3.15 D. リクエストの⽣成・処理を⾏いレスポンスを⽣成 . . .  93
3.16 Pipeline とは . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
3.17 $response->send() . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112
3.18 $kernel->terminate() . . . . . . . . . . . . . . . . . . . . . . . . . . . 113
3.19 まとめ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 113

第 4 章 リポジトリの読み⽅ RxJS 編 114
4.1 RxJS を⼿に⼊れる . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115
4.2 リポジトリを眺める . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115
4.3 package.json を読む . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120
4.4 ビルドする . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121
4.5 ビルドスクリプトを追う . . . . . . . . . . . . . . . . . . . . . . . . . . 122
4.6 ソースコードを追う . . . . . . . . . . . . . . . . . . . . . . . . . . . . 124
4.7 おわりに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136
著者紹介 137

スカゼミガイドのskypeグループへのリンクを更新しました。

新しいskypeだと旧URLだとSkypeに入れないようです。

なので新skypeでも対応可能なURLへ変更しました。

初めての方は受付部屋に入ると良いかもしれません。

 

#4 技術書典3 スカゼミ合同誌 え19

技術書オンリーイベント 第3回 技術書典3で薄い本を出します!

今回の薄い本は下記になっております。

何卒よろしくお願いします。

⽬次
はじめに2
第1 章こねこでも作れるスクレイピングシステム.js 5
1.1 概要. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.2 環境. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.3 node.js のChromy パッケージをインストール. . . . . . . . . . . . . . 7
1.4 node.js/Chromy を使って、Chrome でスクレイピング. . . . . . . . . 7
第2 章Unity での⾊々なDrag&Drop の仕⽅12
2.1 概要. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
2.2 この章の対象者. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
2.3 ドラッグ&ドロップの基本. . . . . . . . . . . . . . . . . . . . . . . . . 12
2.4 フリーダムなドラッグ&ドロップ. . . . . . . . . . . . . . . . . . . . . 13
2.5 装備欄⾃動整列. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
2.6 まとめ. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
第3 章CSS でゲームを作る49
3.1 はじめに. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
3.2 CSS プロパティ. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
3.3 疑似クラス. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
3.4 CSS セレクタの結合⼦. . . . . . . . . . . . . . . . . . . . . . . . . . . 58
3.5 クリックで表⽰を変える. . . . . . . . . . . . . . . . . . . . . . . . . . 59
3.6 クリックと離れた所の表⽰を変える. . . . . . . . . . . . . . . . . . . . 60
3.7 左右にボタンのある選択UI を作る. . . . . . . . . . . . . . . . . . . . 61
3.8 ポップアップ表⽰する選択UI を作る. . . . . . . . . . . . . . . . . . . 62
3.9 カウントダウンタイマーを表⽰する. . . . . . . . . . . . . . . . . . . . 64
3.10 ⽂章を1 ⽂字ずつ表⽰する. . . . . . . . . . . . . . . . . . . . . . . . . 66
3.11 まとめ. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67
第4 章コラム:相対論の⾨を叩く68
著者紹介70

C92 コミケ本の各タイトル

jQueryを読む by hurumeki

Web屋がUnityで「スカゼミちゃんとの冒険」ってゲーム作り中 by なごみ

WebFontsによる多色刷りアイコン2 by ニーヤン

独学で英語勉強して結果www by まろっく

Githubからレンタルサーバーにデプロイする by なごみ

本の表紙 by Coa

週末発表会 2017年7月22日

・NさんがUnityで作り途中のゲームのRPGを発表しました。現在は戦闘が少しできるる模様です。

・同じく、Yさんがゲームの作成中のタイトル画面を見せてくれました。宇宙的なカッコイイ画面です。