KitchHike Tech Blog

KitchHike Product, Design and Engineering Teams

TypeScriptで学ぶジェネリクス, GitHub Actions, 画像とWeb - 社内LT大会を開催しました

f:id:taisei-rgb:20210816151512p:plain

こんにちは、キッチハイクのtaiseiです!普段はデザインエンジニアとして、フロントエンドの開発をメインにおこなっています。

キッチハイクでは月に一回「わくわくテックラボ」という社内勉強会をおこなっているのですが、今回は社内LT大会を開催しました!発表者のスライドを通して、その内容をお届けできれば幸いです。

TypeScriptで学ぶジェネリクス taogawa

発表の背景

こんにちは、エンジニアのtaogawaです。キッチハイクでは長らく動的型付け言語をメインに扱ってきました(Ruby, JavaScript)。最近はTypeScriptを使うようになりましたが、メンバーの中にはTypeScriptが初めて触れる静的型付け言語というメンバーもいます。
そんなわけで静的型付け言語ならではの概念をお話したいなというのが今回のLT発表の意図でした。特にジェネリクスは雰囲気で使えてしまいますが、知るともっと面白いトピックだと思います。

変性

そんなジェネリクスですが、ジェネリクスを調べると必ず出てくるのが変性の概念です。端的に言えば型に対する相互変換の性質を示したものです。 正確にはジェネリクスに限らない概念で、関数の引数や戻り値などもその対象です。 私自身もこれらの概念の理論的背景となると全く心許ないのですが、調べてみると言語によって変性の性質は異なっており、それらを調べてみるのは面白いです。 スライド中にも触れましたが、TypeScriptはジェネリクスと関数の返り値については共変だったりします。 この点について触れた素晴らしい記事(なぜ TypeScript の型システムが健全性を諦めているか)があるので、興味がある方は是非御覧ください。
さて、TypeScriptがこのような性質を持っていると、じゃあ他の言語はどうなっているんだろう・・・となりますよね。このような言語の概念を通じて、他の言語へ関心が湧くのはとても楽しいとっかかりになるのではないかなと思います。

アプリ申請用Macマシンのクラウド化にGitHub Actionsを選んだ話 tamago3keran

発表の背景

こんにちは、エンジニアのtamago3keranです。キッチハイクではセキュリティやヒューマンエラー防止のため、iOSの申請をオフィスのMacマシンからのみ行っていました。しかし、コロナ禍でオフィスへの出社が難しくなり、リモートワークでも申請が行える仕組みが必要になりました。複数サービスをどういった観点で比較検討し、GitHub Actionsを選択したのかを共有するため、LT発表を行いました。

GitHub Actions を選択した3つの理由

複数サービスを比較検討し、以下3つの視点からGitHub Actionsを選択しました。 まずは、ビルド1回にかけられる時間に制限がないことです。サービスによっては10分や30分と制限があり、それまでにビルドが完了しないとビルド failed してしまいます。

次に、ビルドマシンの性能が良いことです。2vCPU・Memory4GiBのマシンが多い中、GitHub Actionsは3vCPU・Memory13GiBと他サービスと比べて性能が良いので、ビルド時間が短く済みます。

最後に、キッチハイクのアプリ開発だと最も安い費用で運用できることです。キッチハイクは2週間に1回程度の頻度でアプリをリリースしています。この頻度であれば無料で運用することができるので、GitHub Actionsを選択しました。

画像と、Webの多様性と画像描画の技術とそれを支えるブラウザの機能に思いを馳せる昼下がり mayuko

発表の背景

こんにちは、デザイナのmayukoです。サイトパフォーマンス向上の一環として、ページ全体の容量を減らすため画像の最適化に取り組んでいました。 それまではimgタグを記述しマルチデバイス対応のためのCSSを記述しておけばOK...とだけ思ってしまっていた自分でしたが、少し知識をひらいてみると、とんでもなく奥深い画像の世界に出会うこととなりました。 Webサイトの視覚要素を担い情報伝達の重要な補助を担う画像の表示に関して、改めて調べてみたい気持ちが強まり、発表するに至りました。

閲覧環境の多様化による画像表示技術の複雑化

ブラウザで扱う画像について調べることは、Webサイトが閲覧される環境が非常に多様であるという事実を改めて認識するよい機会となりました。

もともと、Webは紙の資料の代替・発展系として誕生し、レイアウトが固定されたまま画面に映し出されるものでした。 ただそれがブラウザやディスプレイの技術の発達、そしてサイトを閲覧する環境やデバイスの多様化により、どのような環境においても対応できるような流動性や柔軟性を求められるようになりました。

画像は、その事実をもっとも考慮して実装せねばならない要素の一つです。最終的にどう閲覧者の目の前に表示されるかという結果には、画像自身のもつ解像度や実装者が意図する表示サイズに加え、閲覧者の環境という無数の値を有する変数が関わってきます。 imgタグを使えば簡単に実装できる画像ではありますが、その先に多くの変数が潜んでいること、そして画像を表示させる技術は非常に奥深くおもしろいということを改めて感じました。 全てを理解するのは自分自身もまだまだ知識が足りませんが、この事実を認識するだけでも、画像に対する向き合い方が変わったと感じています。

最後に

以上3名の発表でした。それぞれのメンバーが異なる視点から発表されたことで、聞く側も発表する側も楽しめる企画になったのではないかなと思っています。また、1人1人の準備のハードルが低いことで発表しやすい空気が作れたり、聞く側も発言しやすい空気を作れたりしたことがLT大会の良さなのではないかなと思いました。

私は、今回社内LT大会の企画を任せていただけたことで、チームを動かすことの難しさや楽しさを経験することができました。

キッチハイクには「新しいことにチャレンジしたい」「もっとチームに、世の中に貢献したい」と思っている仲間を応援し、一歩先のステージへと背中を押してくれるカルチャーがあります。

LT大会の発表者を募った瞬間に「私もやりたいです!」と挙手してくれる仲間がたくさんいるこの温かい環境を、私は心から尊敬しています。

We're Hiring

キッチハイクでは、食体験のワクワクに形をあたえるリードエンジニアの採用に力を入れています。少しでも興味を持っていただけた方は是非コンタクトをいただけると嬉しいです!

www.wantedly.com www.wantedly.com www.wantedly.com