【勉強会ノート】2017/11/18開催「HTML5感」での勉強会メモ
どうもです。最近めちゃくちゃ焼肉が食べたいです。
今回はLPI-JAPAN主催のイベント「HTML5感。」に参加してきました。
▷イベントページ
html5exam.jp
HTML５認定試験を行なっているLPIさんの勉強会なので気になって参加してみましたが、
行ってみた感想としてはWebフロント勉強し始めの人にとってもフロント技術駆使して色々やってみたい人にとっても盛りだくさん！な内容だったんじゃないかなと思います。
（あとマスコットキャラクターのセマンくんが可愛かった）
んで今回の勉強会で新しく学んだことの復習として
今回受けてきたセッションの概要と、そこで出てきたこれはチェックしておいた方がいい知識、技術を自分用のメモとしてまとめたいと思います。
- HTML5~JavaScriptの応用例と学び方（山崎大助さん）
- 長期Webサービス受託開発こう困ったのでこうした（高津戸 壮さん）
- AR for HTML5（須山 陽一さん）
- CreateJSでつくるインタラクティブなコンテンツ（野中 文雄さん）
- まとめ
HTML5~JavaScriptの応用例と学び方（山崎大助さん）
まずはじめの基調講演として山崎大助さんは「Webの領域ってそもそもどういうことをやっているのか」や「Web言語をどう学ぶか、学んだ言語をどう活かして行くか」をベースにしたWebフロント入門者から中級者以上向けのお話をしてくださいました。
山崎さんが主催しているジーズアカデミーでの学びの活かし方を事例に挙げながら、最近のアプリについての特徴等もお話してくださったので、個人的な感想として「Webアプリ、簡単なものでもいいから作ろう」とモチベが刺激されました。個人的に今日一番面白いと思った講演でした。
そんな山崎さんのお話の中で私がチェックしたことはこちら。
PHPはじめてのフレームワーク
PHPはじめてのフレームワーク Laravel 5.5対応 ステップ１
- 作者: 山崎大助
- 発売日: 2017/03/18
- メディア: Kindle版
- この商品を含むブログを見る
はじめに山崎さんの著書等の紹介があったんですけど
その中でPHPのフレームワーク入門として紹介していたのがこれです。
これ、なんで私が注目したかと言うと、Amazon Unlimitedに加入している人なら無料で読めるとのことです。
ちょうど今私PHPの基本を一通りやって次もうちょっと難しいのやりたいなと思っていたところだったので
これを機にAmazon Unlimitedに加入しようか。。。と心が大きく揺れた瞬間でした。。。
ブラウザ上で使えるJavascriptエディタ Ace
Ace - The High Performance Code Editor for the Web
プログラムの内容の中に「最近のオススメのエディターは？」と言う項目があったので
ちょうどDWやBrackets以外に何かいいエディタないかなあと思っていたので「あ、最近のエディタについての話かな？」と思ったら
「エディタを自分で作ろう！」と言うお話でした。
エンジニアの「いいものがないなら自分で改造してしまえ！」気質、やっぱり好き。（なので相変わらずエンジニア周りから離れられない）
んでご紹介にあったAceはブラウザ上で動く上に自分で好きなようにカスタマイズ可能な代物らしく、山崎さんはこれを使ってBootstrap用のエディタを自分で作った！とのことでした。（私の周りにいた方も興味があるらしく「すげえ・・・」と小声が聞こえてきたほどでした）
www.venezia-works.com
▷個人的参考URL
qiita.com
開発を促進させる諸々---FireBase/画像認識API
コンテンツファーストの時代だから、思いついたら誰よりも早く作るのが勝ちであり価値である、ということで
実際にアプリ制作でも使えるBassやWebAPIの紹介もありました。
◾️Firebase
firebase.google.com
Baasとして紹介があったのはFireBase。
私これ知らなかったんですけど、みた限りなんだか色々すごく便利そうですね。。。
始める前にさっと読むのに良さそうな記事があったので一緒にメモ。
▷個人的参考URL
qiita.com
◾️画像認識API
（Microsoft）
azure.microsoft.com
今回私が特に気になったのが、画像認識API。
画像認識APIはアプリでも取り入れやすいものが多く、特徴として読み取ったデータをJSON化して書き出せると言うことなので俄然興味が湧きました。
各種APIの比較としてはこの記事が参考になるかなあと思ったのでメモしときます。
▷個人的参考URL
qiita.com
上記で紹介した数々のAPIにみられるように、今は色々なAPIが公開されています。
逆に言うと個人でもそれなりの機能を備えたものは作ろうと思えば作れるわけなので
これらをうまく取り入れたアイディア力が新しいWebアプリやサービス制作においてカギとなる、と言うことで
ジーズアカデミーでは必ず授業の中に何か一個小さいものでもWebアプリを作るようにしているとのこと。
プログラミング言語は基本的に一個理解すれば他の言語に応用して考え方を持って行くことが可能なので、
まず初心者は何か一つの言語の基本をしっかりやり、そこから他のものを広げて行く方が幅が広がるとのことでした。
自分の尖ったところをまず１つ磨く。最近色々目移りしがちな私の頭にガツンときた気がしました。。。
長期Webサービス受託開発こう困ったのでこうした（高津戸 壮さん）
先日参加したCSS Niteでも登壇されていたところをお見かけしたピクセルグリッドの高津戸さん。
今回の勉強会ではサービス受託開発でのご自身が経験したことやそこで使ったツール、サービス開発と捕手での心構えなどを交えたお話をしてくださいました。
この話は聞いていて一番「わかる。。。（涙目）」なポイントてんこ盛りでした（現に私がWebサービスの開発と保守両方経験している人間のため）
そんな中で私がチェックしたのはこちら。
構文チェック/ ツール
講演の中で紹介されていた構文チェックツールです。JSHintはjavascriptのフォーマット不整合や構文のおかしなところをチェックしてくれるツール、CircleUIはビルド、テストを自動で行い、設定すればそのレポート通知までしてくれるツールだそうです。
それぞれ入門に良さげな資料を探してみましたが、JSHintの場合他にも色々なJavascript構文ツールがあるようで、今回は比較記事で他にどういうものがあるのかを一緒に見れたらいいかなと思ったのでメモ。
▷個人的参考URL
www.tam-tam.co.jp
www.slideshare.net
プロジェクト管理：かんばん方式
- 作者: David J. Anderson
- 出版社/メーカー: リックテレコム
- 発売日: 2014/10/10
- メディア: Kindle版
- この商品を含むブログ (1件) を見る
この考え方私は知らなかったんですが、Trelloを個人で使っているのでそいつの具体的な活用方法としてこの考え方を導入すると相性がいいのかなと思いました。
高津戸さんのプロジェクトではクライアントから来た要件を整理しながらかつ作業者がすぐに着手しやすいように整理するために「要望、要件定義、着手可能、実装済」とボードを区切ってタスク整理をしていたそうです。（そもそもかんばん方式の使い方がこのセオリーとのこと）
▷個人的参考URL
ソフト開発に「かんばん方式」を導入すべき理由とスクラムとの違い - WPJ
AR for HTML5（須山 陽一さん）
ブラウザ上で今後ARを実装していくにあたってのサンプルを示してくださったのが須山さん。ちょうど私が興味を持っていた分野だったのでお話で出て来た技術をチェック。
ARフレームワーク---AR.js
github.com
ARを手軽に実装するためのライブラリとして紹介されたのがこのAR.jsです。セキュリティ上の観点からHTTPS通信でなければ動いてくれない点に注意です。
入門記事等探してみましたが、結構色々ありそうです。
▷個人的参考URL
getar.jp
VR用フレームワーク--A-FRAME
そしてVRフレームワークの紹介も。Mozillaが開発したVRフレームワークのA-FRAMEがお手軽でお勧めとのことで今回のデモではAR.jsと組み合わせた活用例を披露してくれました。最近iOSのSafariでもAR.jsを使った表現ができるようにになったので、今後この組み合わせでの開発が増えるのではとのことでした。
▷個人的参考URL
qiita.com
AR用ライブラリ--ARToolKit / ArUco
Open Source Augmented Reality SDK | ARToolKit.org
AR用のライブラリとして紹介されていたのがこの二つ。ARToolKitはC言語、ArUcoはC++ベースのライブラリだそうです。ブラウザ上で利用するにあたっては、ブラウザで動かせるようにコンパイラを別途かます必要があるとのことです。まずはAR.jsを触れてみて、そのあとこのライブラリにチャレンジ、という感じかなと思いました。
▷個人的参考URL
「攻殻機動隊」「電脳コイル」の世界を実現！ - ARToolKitを使った拡張現実感プログラミング - 工学ナビ
CreateJSでつくるインタラクティブなコンテンツ（野中 文雄さん）
WebでのARの話を聞いたのでこれも聞いておこうと思い野中さんの講演も聞いて来ました。
まとめ
そんなわけで内容の濃いセッションづくしでお腹いっぱいになれました！APIを利用したWebアプリ開発は実際に作ってみたいなと考えていたことのヒントになったのでちょとチャレンジしてみたいなと思います。あとはCreateJS楽しそう。
そして今回ラッキーなことに大抽選大会でセマンくんの携帯ストラップ当たりました。やったあ。
例によって途中でiPadの電池切れが起こり(単なる充電不足)ツイートできなかったのですが。。。今日のHTML5感でありがたいことにセマンくん抽選大会で当たりました(〃ω〃)かわいい〜 pic.twitter.com/dYl52v2Wg8
— MIO (@mio_U_M) 2017年11月18日
