🎉

2022年に作ったものを振り返ってみる

2022/12/30に公開

はじめに

はじめまして。Virtual Motorsport Lab Inc. (VML) でプロダクト開発をしている@danchinoctoです。2022年の下半期からVMLに本格的にコミットし始め、自動運転シミュレータからdappsまで幅広い技術に触れました。

今年は勉強することだらけの一年で、開発過程やプロダクトに対するアウトプットをする余裕がありませんでした。年の瀬ということで一気に振り返ってみようと思います。記念すべきZennの初投稿です!

前提

もともとアカデミア出身で、半年前まではシステム制御理論の学術研究をしていました。ただ基本的には数式をこねくり回して遊ぶ理論系だったので、正直これまでの開発経験は乏しいものでした。

これまで主に使っていたプログラミング言語は

  • C++ (大学で最初にC言語を習ったので、その延長線上でC++をメインに使っていました)
  • Python (科学技術計算用途)

といった感じでした。

Web系はHTML/CSSの基本がちょっとわかるくらいで、バイト先でWordPressベースのHP管理をしたり、個人サイトをHugoのよさげなテーマ選んで使ったり、くらいでした。

今年作ったもの

自動運転シミュレータ

使った技術

  • Unreal Engine 4 (C++, Blueprint)
  • Python
  • Blender

概要

Unreal Engineで自動運転シミュレータを作りました。こちらが実際に作ったシミュレータの映像を使った、VMLのイメージ兼デモ動画です。ユーザはPythonを使ってレーシングカーの走行アルゴリズムを開発できます。

https://youtu.be/AWwWrnYZyNM

Unreal Engineを使うこと自体が初めてだったのですが、ラップタイム計測の機能をなんとか実装しました。その際は公式のYouTubeチュートリアルに大変お世話になりました。Blueprintも最初は違和感がありましたが、慣れると視覚的にロジックを組めるのが面白いと感じてきました。また、車両の3Dモデルの微調整のためにBlenderも使いました。

web3関連

8月から大阪産業局主催のテック・ビジネス・アクセラプログラムSuitchに参加することになり、集中的にweb3関連の勉強を始めました。

使った技術

  • Solidity
  • HardHat
  • JavaScript
  • TypeScript
  • React
  • Firebase

CryptoZombies

8月末あたりからCryptoZombiesを始めました。Solidityの基本的な文法やコントラクトの書き方を学べました。
https://cryptozombies.io/jp/course
(2022年12月末時点で、なぜか日本語ページの一部がハングルになっています…笑)

UNCHAIN

9月にはweb3開発者が集まるUNCHAINコミュニティに参加して、そこからdapps開発の勉強を始めました。
https://unchain.tech/

上述のCryptoZombiesでSolidityの勉強はしていましたが、より具体的なプロジェクト通して、理解が深まるのを実感できました。というよりスマートコントラクトの実装自体は (これまでのところ) そこまで難しくなく、どちらかというとブロックチェーンに関係ない、Web開発自体の壁がありました。

UNCHAINの学習コンテンツでは、チュートリアルに沿ってdappsフロントエンドを主にReactで実装していきます。もともとはJavaScriptのアロー関数も知らないくらいフロントエンドの知識が皆無だったので、React (特にhooks関連) の概念を理解するのに時間がかかりました。最初のうちは「サンプルコード通りのMVPはできるけど、自分で追加機能を実装できない」という状況でした。しかし自分でもReactについて調べながらプロジェクトをこなしていくうちに、オリジナルの追加機能も実装できるようになってきました。

https://twitter.com/danchinocto/status/1579099597779382272?s=20&t=9jDLbc0tLtyBY7S21E5Q2g

とはいえ完全に使いこなすまでには時間がかかりそうです。地道に勉強を続けたいです。

スマートコントラクトは基本的にSolidity+HardHatで開発しました。将来的なことも考えると、テストもちゃんと自分で書けるようにしないといけません。この点ももっと経験を積みたいです。

UNCHAINでは、これまでに4つのイーサリアムプロジェクトを完了させました。ただいまASTARプロジェクトに挑戦中ですが、初めてのRustなので進みが遅いです……

東京web3ハッカソン

UNCHAIN経由で東京web3ハッカソンの開催を知り、おそるおそる参加してみました。幸いにもチームメンバーに恵まれ、中身の濃い2週間を過ごすことができました。一応エンジニア枠ではありましたが、なにしろ経験に乏しいので、もう一方のつよつよエンジニアさんに頼りまくりでした。
https://tokyo.akindo.io/

当初はモバイルアプリを開発しようと言われ、とりあえずReact Nativeのチュートリアルを何個か触りました。しかしMetaMask連携の壁がなかなか打破できず、ギリギリのところでReactベースのWebアプリにシフトチェンジすることになりました。結果的に私はスマートコントラクトの実装だけ、他の部分はすべておまかせ状態になってしまいました (本当にありがとうございました)。ちなみにその後、React Nativeでもうまくいったそうです。

このときTypeScriptをオススメされたので、その後の開発でもTypeScriptを使うように意識しています。DDD (ドメイン駆動開発) も教えていただいたのですが、一朝一夕で身につくものではないので少しずつ勉強していこうと思います。実装していただいたフロント部分の構成などを、たまに見返して研究しています。

開発体験を積めたことももちろんですが、他チームのピッチやデモを見ることもかなり勉強になりました。私たちのチームはGameFi部門に提出したのですが、同じ部門の入賞チームはどれも本当にすごくて、その完成度に驚きました。ハッカソン後は他プロジェクトのGitHubを覗いて、勝手に勉強させてもらっていました。

NFT発行

12月にVMLのハンズオンセミナーを開催し、その参加証明としてNFTを発行しました。UNCHAINや東京web3ハッカソンを経て、ある程度dapps開発に慣れたうえで取り組むことができました。
https://www.sansokan.jp/events/eve_detail.san?H_A_NO=39193

NFT発行に関しては、ガス代を運営持ちとしました。受け取り先のウォレットアドレスを指定してミントするという方針にし、Firestoreを使ってユーザごとのミント状況を管理しました。参加者はモバイル端末のブラウザでWebアプリを開き、ウォレットを接続して申請するという流れにしました。

実際に作ってみるとReactの状態更新に苦戦したり、MetaMaskを開いた後の挙動が安定しなかったりという問題が発生しました。結局アドレスをコピペで送信する機能を追加し、なんとか動くものはできましたが、要改善なところが多々あります。モバイル×dapps開発はなかなか資料が少なくて苦労します……

その他Web開発

実はweb3関連の勉強を始める前、少しだけDjangoを勉強しました。静的サイトだけではなく、将来的にWebアプリ開発が必要になりそう&PythonならできるということでDjangoを選びました。当時はブログアプリやポートフォリオサイトのチュートリアルを少し触りました。

しかし前述の通り、dapps開発を通してJavaScriptやTypeScriptをメインで使うようになったため、現在はDjangoからは離れています。今年の11月頃に会社の公式Webサイトを更新した際も、Gatsbyで開発しました。
https://vml.pages.dev

まとめ

2022年に開発したものや、その中で触った技術などを振り返りました。なかなか幅広くチャレンジできたかなと思います。

Python以外は未経験だったため、どれをとっても未開の地を開拓していく必要がありました。一方でたくさん勉強でき、技術が身についていく感覚があって楽しかったです。ただ「とにかく動くものを作る」ということを優先したため、各技術の基本的な部分が抜けていたり、設計が甘かったりするのが反省点です。

来年は開発するプロダクトの質も向上させていきたいです。まだまだ勉強することが山積みですが、精進します。せっかくZennアカウントも作ったので、アウトプットもがんばります!

Discussion