enabled.2020.01.05年末年始自由研究レポdev年末年始なので普段気になってるけど、触る機会のなかった技術やライブラリに触ってみました。FaunaDBの4テーマに触れてみました。MotionReactのアニメーションライブラリです。react-springが競合にあたると思いますが、自分は逆張りでframer-motionを掘ることにしました。framer-motionはFramerというデザインツールを提供しているチームが出しているライブラリで、以前紹介したreact-poseの後継にあたります。個人的には小さなインタラクションやジェスチャーに対応していくことでネイティブアプリライクな操作感に近づくと思っています。React以前のウェブではjQueryライブラリが繁栄し、リッチな見せ方、インタラクションなどで独自の進化を遂げていました。Reactになってからは(特に日本では)こういった議論はされなくなったように感じています。使いやすいPWAに至る道には必要と思うので取り組みました。framer-motionに関しては、次のようなメリットがあります。Routerと組み合わせても、リッチなトランジションが簡単に実現できるドラッグやタップなどのイベントと組み合わせるのも楽このあたりの実装に関してリポジトリを作って、使いたい時に使えるようにストックを始めています。UIフレームワークの実装と違い、「薄めの実装にして、プロジェクトに取り込みやすく」を意識して進めています。http://react-motion-training.netlify.com/https://github.com/mottox2/react-motion-training海外のReact系カンファレンスではアニメーション的なセッションがあるので、日本でも増えればいいなと思っています。FlutterFlutterGoogleが提供しているマルチプラットフォームアプリが書けるツールです。一応、情報としては追っていましたが、自分の言葉で説明できるようにしたかったので触りました。Flutterそのものよりも、開発環境の整備状況に驚きました。Studioにプラグインが提供されていて使ってみたらめちゃ楽でした。expoを使っている気持ちになりました。monoさんのFlutterの効率良い学び方を参考に次の内容をこなしました。StartedCodelabで提供されているチュートリアルUdacityのFlutter講座これに加えてFirestoreとつなげてみたり、QRコード読み込みを試してみたりしました。したタイミングで「Webでいいのでは?」という気持ちになりました。経験が学習を阻害するので「アンラーニングが大事」という言葉の重さを知りました。去年、仕事でiOS(Swift)をやっていたので、エラーが出てもなんとかできる力がついたような気がします。APIを実装しました。RESTとの比較、API・フロント双方の実装から学ぶに従い、気になる点はドキュメント等を参考にしながら追加で実装しました。(リポジトリ)以前からチューニングがしんどい等の話は聞いていましたが、自分で実装してみてそのしんどさを感じることができました。クライアント側からはほしいフィールドを指定するだけで楽な一方、サーバー側へ実装の負担が寄る実感を得ました。APIを生やせるPrismaやHasura、データストアとともに提供している後述のFaunaDBあたりを掘っていくとよさそうです。Nowで公式のIntegrationとして用意されているデータストア。データへはFQL(SQLライクなクエリ言語)、GraphQLの二通りの問い合わせ方法がある。Firestoreがしんどいので、サーバーレスに向いているデータストアを探ってみたいというのが発端。触って主要なドキュメントも読んだけど、Flutterのチュートリアルと比べて英語が読みにくかった。Loginに関しては言及されていなかったのでアプリ導入に関しては様子見。(中間サーバーとか立てれば行ける?でも、それならFirebase使う...)自分用ツールのデータストアに使えるかも?もう少し時間をかけてみてもよさそう。以上のような年末年始の自由研究をやっていました。皆様、今年もよろしくおねがいします。技術書展8に向けてWordとPandocを使って同人誌を作っています。PandocではWordのテンプレートを用意して、その中にMarkdownで書いたコンテンツを流し込みます。この構成で大事なのがW2020/02/16event技術書展8でSPAの技術に関する同人誌を出す予定です技術書展7、技書博1に続いて技術書展8や技書博3に向けて、つのぶえ出版として新作を書いています。今回は「フロントエンドの技術選定」「仕組みの理解」あたりをテーマに考えています。ReactとV2020/02/02diaryタスク消化のためにひとり合宿をやってきた3泊4日をかけて名古屋でタスク消化合宿を行った。簡単にまとめると、普段の環境では進捗が見えやすく、達成感を得られるプログラミングをやりがちですが合宿の場を用意することで普段進みにくいタスクを消化す2020/01/26PROFILE@mottox2WEBエンジニア都内でフリーランスエンジニア・デザイナーとしてWebサービスやスマホアプリを作っています。新規事業の爆速立ち上げや、使いやすいSPAの開発が得意です。