はてなブックマーク

駅奪取チームエンジニアの id:dorapon2000 です。 弊社の今年の技術研修についての記事が何点か投稿されています。 tech.mobilefactory.jp tech.mobilefactory.jp プロダクトで利用されているプログラミング言語、ライブラリ、RDBMSなどの技術研修を行っても、プロダクト開発を円滑に行うことは難しいです。プロダクトの仕様の理解が浅く、各機能のコードがどこにあるか把握できていないことが一因です。他にも、口頭伝承になりがちで毎年のコストになっていたことや、新機能開発に取り組んでも、プロダクト理解が浅ければ出るべき提案も出てこない問題もあります。 私達のチームでは、こういった問題を解決するため、チーム横断の技術研修とは別に「プロダクト技術研修」を4年前から実施しています。本記事では、そのプロダクト技術研修の紹介と実施にあたり大切にしていることを書きた

こんにちは、エンジニアの id:mp0liiu です。 少し前の話になりますが、5/28にPerlの最新安定バージョンである5.36がリリースされたので、コミュニティ周りの動向も含めて気になった点についてまとめていこうと思います。 use v5.36 一番影響がある変更は use VERSION の効果が変わったことです。 use v5.34 以前はバージョンチェック、要求されたバージョンで利用可能なすべての機能(featureバンドル)の有効化、strict の有効化を行っていましたが、 use v5.36 からは warnings も有効化されるようになりました。 use v5.36; my $str; say $str; # Use of uninitialized value $str in say at ... 1行だけで strict, warnings, 最新の機能の有効化が

こんにちはエンジニアのEadaedaです。 皆さんのチームではGitHub Actionsを使っていますか？ブロックチェーンチームではテストやリンター、デプロイといったワークフローをGitHub Actionsで行っています。 今まで、デプロイ以外のワークフローはGitHub-hosted runnerで実行、デプロイはSelf-hosted runnerで実行していましたが、運用していくうちに特定の環境内にあるサーバーで実行されるように仕組みを見直す必要がでてきました。このため全てのワークフローをSelf-hosted runnerに移行する対応を行いました。この記事では移行の際に見つけた便利なものや困ったことを紹介します。 Self-hosted runner GitHub Actionsでは、基本的にGitHubが用意したVMでワークフローが実行されます。このVMをGitHub-ho

こんにちは。エンジニアのid:kfly8です。 今月から、NestJSとethers.jsのスポンサーをはじめました🎉 この記事ではOSSのスポンサーをするにあたり考えたことを書きます。 モバファクは、NestJSとethers.jsの2つのOSSのスポンサーになりました NestJSとethers.jsを選んだ理由 多くのOSSに支えられてプロダクトの開発ができているので、気持ちとしては全てのOSSに貢献したいところですが、そういうわけにはいかないので、次のような基準で絞り込みをしました。 プロダクトで重要かつ頻繁に利用している メンテナーが少ないこと スポンサーメニューが明確で、経理処理や稟議が円滑にしやすいこと 1番目の基準は素直だと思います。ここでは2番目、3番目について補足します。 メンテナーが少ないOSSにスポンサーをした NestJSもethers.jsもどちらも優れたOS

こんにちは。エンジニアのid:kfly8です。 先日、技術研修のインタビュー記事を公開し、手を動かしつつ、コミュニケーションをよく取る技術研修といった主旨の内容でした。 tech.mobilefactory.jp こちらのインタビューでは具体的な研修内容は触れていませんでした。今回は、駅メモ！や駅奪取といった位置ゲームや着メロの月額コンテンツサイトなどで利用しているPerlの技術研修について紹介します。ブロックチェーン事業ではフロントエンド、バックエンドの両サイドで、TypeScriptを利用しているのですが、そちらの技術研修の話は追い追いできればと思います。 tech.mobilefactory.jp 技術研修を受ける人は、どの言語でも良いのである程度プログラミング言語に慣れてることを想定しています。そのため、学ぶ意味、特徴は何か、良教材は何か、罠は何か、などポイントを掻いつまむように技

こんにちは、ブロックチェーンチームの id:d-kimsuon です Vue2 では TypeScript がサポートされており、公式の TypeScript のサポートのドキュメント に従うことで TypeScript で書いていくことができます しかし、素直に書いていくと any 型になってしまったり、実際とは異なる型付けになってしまうポイントがあります この記事では TypeScript で Vue2 (Option API) を書くときに型を厳格にしやすい書き方等を紹介します 省略可能な props には明示的に PropType<型 | undefined> する 型安全な例 型安全でない例 props の型でリテラルに絞っている時、 default には as const をつける 型安全な例 型安全でない例 data の型を as で上書きせず、型注釈を書く 型安全な例 型安

「新しい環境に馴染んで活躍できるか？」 この不安を感じる人は少なくないと思います。そういった不安に対応できるよう、モバイルファクトリーでは、できる限り早くチームや会社に馴染んで強みを発揮できるようにオンボーディングを大切にしています。 この記事では、オンボーディングの一環の技術研修について紹介します。技術研修で何をしているか何を大切にしているか、運営の生の声を聞いてみました。 この記事に出てくる人たち モバファクの技術研修の概要 技術研修の工夫、アクシデント さいごに @kfly8: 今日はモバファクの技術研修について話していきたいと思います。よろしくおねがいします！ まずは、みんなが普段、どんなことをしているのか、自己紹介をお願いしたいです。 @dorapon2000: 今年3年目になるエンジニアです。駅奪取というソーシャルゲームの中の人をやっています。普段の業務は新機能開発、お問い合わ

こんにちは、ブロックチェーンチームのソフトウェアエンジニアの id:odan3240 です。 ブロックチェーンチームでは、 NFT を販売するためのUniqysマーケットプレイス(以下、ユニマ)と、NFT サービス構築支援プラットフォームのユニキス ガレージ(以下、ガレージ)を開発しています。ユニマはブロックチェーン上の NFT を日本円で売買可能なマーケットプレイスです。 以下の記事でユニマとガレージの技術スタックを紹介しました。 tech.mobilefactory.jp この記事では触れていませんでしたが、どちらのサービスも単一のリポジトリ(いわゆるモノレポ)で開発しています。 この体制の上で見つけた TypeScript のインポートの書式のミスマッチの問題とその解決策を紹介します インポートの書式のミスマッチ 技術スタックの記事でも言及している通り、フロントエンドの実装には Nu

こんにちは。エンジニアのid:kfly8です。 3/4(金) 3/5(土) に、Japan Perl Associationが主催するPerlに関するオンラインカンファレンス｢YAPC::Japan::Online 2022｣が開催されました。 yapcjapan.org モバファクでは、駅メモ！や駅奪取などのプロダクトでPerlを利用しています。Perlコミュニティへの恩返しの意味も込めて、モバファクではイベントTシャツスポンサーとして協賛させていただきました。 また、私自身もYAPCの運営として、スポンサー担当、ノベルティ担当、ゲスト対談担当、スピーカー担当、学生交流支援担当、オープニング担当、オンライン会場選定、タスク管理、予算管理などしました。この運営話は追々できればと思います。ここでは、モバファクから登壇したメンバーのコメントを紹介したいと思います！ kimuson / Type

こんにちは。エンジニアのid:kfly8です。 技術カンファレンスのノベルティで、コードを載せたデザインってイイですよね。謎解き要素で遊び心をくすぐりつつ、デザイン的にも普段使いしやすくかっこいいんですよね。リブセンスさんから2015年にもらったトートバッグなんかは、未だに使っています。 hiragram.hatenablog.jp そんなノベルティを一度でいいから作ってみたかったんです…… つくりました!!!! 手前味噌ですが、最初にデザインを見せてもらったとき、ビビビときました。カッコイイ。ビ○ムスさんとか街にある服屋さんにあっても、わからない。多分。一目惚れでした。 YAPC::Japan::Online 2022のロゴは、結び目がモチーフでどこか繋がりを感じるデザインです。結び目から着想した糸を34行のコードの上にあしらい、見かたによってはケーブルコードにも見えるので、”コードにコ

こんにちは、エンジニアの夕凪です。 最近、 GitHub Actions が OIDC を正式サポートし、 AWS や GCP へのセキュアなデプロイが可能になりました。 そのうちの GCP の公式実装である google-github-actions/auth を使って、 Firebase へデプロイを行ってみたので、この記事ではそのやり方を解説します。 前提条件 この記事は以下の環境を前提としています。 google-github-actions/auth v0.4.3 Google Cloud SDK 370.0.0 (gcloud --version) Google Cloud Platform へのアクセス権限があること GCP 側でやること まずは GCP 側でサービスアカウントの準備などが必要なので、それらを作成していきましょう。 以下ちょっと特殊ですが、 fish shel

こんにちは。エンジニアの id:kfly8 です。 少し祝うには遅いですが、技術アドベントカレンダー2021無事完走しました🎉　ありがたいことに、ホットエントリーした記事もあり、編集担当としてはホッとしています（ホットエントリーだけに） tech.mobilefactory.jp tech.mobilefactory.jp tech.mobilefactory.jp tech.mobilefactory.jp 技術アドベントカレンダーの運用で感じた問題 6年ほど技術アドベントカレンダーを運用してきて、編集担当として大きく2つ問題を感じていました。 記事が多すぎ、埋もれる 毎日の記事公開は、工数負担が大きい 記事が多すぎ、埋もれる 弊社が技術アドベントカレンダーをはじめた2015年は、Qiitaさんの「企業・学校・団体」カテゴリでいえば、記事数は1,100強でした。2020年になると記事数

駅奪取エンジニアのid:dorapon2000です。駅奪取では11月にゲーム内の地図のリプレースを行いました。地図そのもののスタイルも変わりましたが、地図の表示に使うライブラリも変更しています。今回は、アプリに地図を埋め込むだけであれば、ほんの少しのコードだけで実現できるということを紹介したいと思います。 記事の前半で地図表示の仕組みを簡単に説明して、後半で具体的なコードをお見せします。 地図表示の仕組み 地図を表示するためにはサーバ側とクライアント側の2つの仕組みが必要です。また、サーバとクライアントは地図をタイルという形式で送受信します。 地図タイルサーバ 地図タイルを配信する 自前でホストすることもできるが、いずれかのサービスのタイルAPIを利用すると楽 地図クライアント 地図タイルの受信と表示をする 地図の上にピンや吹き出しを置くこともできる タイルにはベクトルタイルとラスタタイル

こんにちは、21 卒エンジニアの id:d-kimuson です。 モバイルファクトリーでは、最近のプロダクトではフロントエンドに TypeScript を採用していますが、僕がアサインされているプロダクトは歴史が長く JavaScript で書かれていて、今回 TypeScript へのリプレースを行いました。 既存プロダクトの TS リプレースではしっかり型付けすることは難しいので、型チェックオプションを緩くしてリプレースすることが多いと思います。しかし、既存コードからリプレース後のコードまで全て型安全性が担保できなくなってしまうので、後からの strict 化は非常に大変になってしまいます。 今回のリプレースでは、型チェックオプションは緩くしない代わりに @ts-nocheck や @ts-expect-error を使用することで、段階的に型安全性を高めやすい形でリプレースを行いま

この記事はモバイルファクトリー Advent Calendar 2021の25日目の記事です。 メリークリスマス🎉 エンジニアのid:kfly8です。 技術ブログの「ネタがない」といったコメントや「この記事の課題がよくわからない」といった記事レビューをすることがあります。技術アドベントカレンダーの時期は、短期間に記事が集中するので、特に困らせているように感じます。 普段から意識する習慣で、楽ができないかと考えると、「技術ブログが書ける開発をする」のが良いと思いました。 誤解しないでほしいのが、「技術ブログを書くために開発をしよう」と言いたいわけではないです。あくまで、チーム、事業の目的ありきです。 ただ「技術ブログが書ける開発をする」ことは、普段の開発の質を高めると思っています。 技術ブログが書ける開発とは？ モバファクの技術ブログでは、「課題を解決する方法や経験を発信したい」と思ってい

こんにちは、新卒エンジニアの id:d-kimuson です 先日 type-predicates-generator という型定義からユーザー定義型ガード・アサーション関数を自動生成するツールをリリースして紹介記事を書いたのですが、感想とかを眺めていたら同じく外部から来た値に安全な型付けをするためのライブラリやツールの情報をいくつも観測しました この辺りのランタイムチェックライブラリの情報ってあまりまとまっていない印象で自分が知らないものもいくつかあったので、調べつつ簡単にまとめられたらなと思ってこのエントリを書きました 外部からやってきた値を型安全にするにはざっくりと 型生成によるアプローチ ランタイムチェック用の独自型を書かせるアプローチ 型情報からランタイムチェック関数を自動生成するアプローチ の 3 つのアプローチがあると思うので、それぞれのアプローチごとに紹介します ① 型定義

こんにちは、新卒エンジニアの id:kaoru-k_0106 です 何をしたか 私のチームでは、コミットメッセージの先頭にチケット番号を入れるルールがあります。 例えば、PROJECTNAME-123 〇〇の処理を変更しただと、PROJECTNAME-123の部分がチケット番号です。 最初はこれを手動で入力していたのですが、時々入力を忘れることがあり自動挿入しようと思いました。 ちょうど、トピックブランチ名がチケット番号だったので、ブランチ名を使う方針で実装をしました。 導入手順 その1 Gitのコミットテンプレートを設定する Gitのコミットテンプレートとは、コミットメッセージエディタを開いたときにデフォルトで設定されている文字列です。 この設定は、次のようにテンプレートファイルを作成し、git configで設定できます。 % echo '[branch-name]' > ~/.com

はてなさんのコンテキストクイズに拙作のContextual-Diagで答えてみました。これでコンテキストマスターですね！？ github.com use Test2::V0; use CDD; like( warnings { length( cdd ) }, [qr/wanted SCALAR context/, qr/evaluated as STR/], 'length <ここ> ... STR in SCALAR' ); like( warnings { if( cdd ) {} }, [qr/wanted SCALAR context/, qr/evaluated as BOOL/], 'if (<ここ>) ... BOOL in SCALAR' ); like( warnings { for my $i ( cdd ) {} }, [qr/wanted LIST context

VSCode でホバーして型情報を見ようとすると、交差型はプロパティが展開されません プロパティの型を展開する Mapped Types を通すことで省略せずにプロパティを見ることができます。プロパティが交差型になっていることもあるので、再帰的にプロパティを Mapped Types に通すような型を定義しておいて、通すことでプロパティを全て確認できます type Expand<T> = T extends object ? T extends infer O ? { [K in keyof O]: Expand<O[K]> } : never : T type Temp = Expand<`確認したい型`> 厳密でなくとも簡単にどんなプロパティがあるか把握したいだけなら組み込みの Required や Partial を使うのが手軽です。ただし、あくまでデバッグ用途でそれぞれ省略可能プロ

こんにちは。ブロックチェーンチームのソフトウェアエンジニアの id:odan3240 です。 ブロックチェーンチームでは NFT を販売するためのUniqysマーケットプレイス(以下、ユニマ)と、その NFT を販売するための管理画面(以下、管理画面)を開発しています。ユニマはブロックチェーン上の NFT を日本円で売買可能なマーケットプレイスです。 ユニマの開発はブロックチェーンに関するサービスなので、ブロックチェーンに関する技術をゴリゴリに使って開発しているのでは？と考える方がいるかもしれません。しかし実際はそうではなく Web アプリケーションに関する開発は普通の技術スタックで開発しています。もちろん実装するロジックによってはブロックチェーンに関する知識が必要となる場合もありますが、マネージドサービスやフレームワークやツールを活用してコア機能の実装に集中できるように技術スタックを選択

こんにちは！エンジニア組織開発責任者のid:kfly8です。 今年もモバイルファクトリーのAdvent Calendarをお送りします🎉 今年のアドベントカレンダーは「今日から使える技術」をテーマにコンパクトにお届けしていきます！*1 今予定しているキーワードを見ると・・「TypeScript」「Vue.js」「Perl」「CLI」「MySQL」「AWS」「地図」「プロダクトマネジメント」などがあります。ぜひお楽しみください！ 一覧 12/1 tech.mobilefactory.jp 12/2 tech.mobilefactory.jp 12/3 tech.mobilefactory.jp 12/4 tech.mobilefactory.jp 12/5 tech.mobilefactory.jp 12/6 tech.mobilefactory.jp 12/7 tech.mobilefa

こんにちは、エンジニアの id:mp0liiu です。 8月28日(土)の Learn Languages 2021 というイベントの Language Update というセッションで@charsbarさんと一緒に2018年以降のPerl5やPerlコミュニティの最新動向について話してきたので、そのとき話した内容に補足などしつつ記事にしていきたいと思います。 配信アーカイブはこちらから見れます。 時系列 2019/5/22 Perl5.30 リリース 2020/6/20 Perl5.32 リリース 2020/6/24 Perl7の発表 2021/5/21 Perl5.34 リリース Perl5.30 の変更点 正規表現や文字周りの細かい改善などはありますが、正直めぼしい変更点が見られないです。 Perl5.32 の変更点 isa 演算子の実装 値があるクラスのインスタンスもしくはそのサブ

モバイルファクトリーのエンジニアは、NFTマーケットプレイスの「ユニマ」や位置ゲームの「駅メモ！」など様々な事業の開発をしています。そんなエンジニアたちが、普段、どのようなことを考えているのか。3人のエンジニアに聞いてみました。 この記事に出てくる人たち チームによって性質は異なるのだから、課題に応じて、開発の進め方を変える ワークログを書くのは楽しい 可視化するのは、組織開発においても、当然サービス開発、エンジニアリングでも大事 可視化は目的ではない 楽しく仕事をする。そのために斧を研ぐ 理想を知らないと妥協してることに気づかない 自分が望んでいる環境があるなら、そう変えればいい 三者三様のキャリア @kfly8 : 今日は、モバファクのエンジニアが普段どんなことをしているのか、考えているのか、大切にしているのか、みたいなことを聞いていきたいです。よろしくお願いします！ まずは、みんなが

はじめに こんにちは。ブロックチェーンチームのエンジニア、 @nanamachi です。 tech.mobilefactory.jp 前回の記事ではたくさんの方に閲覧&コメントいただきありがとうございました。この記事から1年。モバイルファクトリーは日本のどこからでも働けるようになり、書籍購入、資格取得、セミナー参加、懇親会の支援制度などフルリモートに適応できるよう多くの変化をしてきました ( https://recruit.mobilefactory.jp/work-style/ )。その中で社員の環境もさまざま変わったことでしょう。 この変化を記事にすれば、閲覧数を稼げる 弊社の魅力を発信できるに違いない!という目論見で、初めてバズった記事にすがるエンジニア組織開発責任者の@kfly8から次のようなチャットが送られてきました。 kfly8: インターネット識者*1の @nanamachi

あけましておめでとうございます。ブロックチェーンチームのソフトウェアエンジニアの id:odan3240 です。 この記事では Google Docs を用いたエクストリームリーディング形式の社内勉強会を1年間継続できた記念に、その形式を紹介をします。 エクストリームリーディング とは エクストリームリーディングとは黙読フェーズと議論フェーズの2つのフェーズを繰り返す読書会の形式の1つです。 黙読フェーズでは次のことを行います。 1節、1章、数ページなどのある程度のまとまった文章を読む範囲として決定 この範囲を参加者で並行して黙読 その次の議論フェーズでは黙読した結果について次のことを行います。 文章の解釈を合わせる 文章中で分からないところを教え合う エクストリームリーディングの利点は次の通りです。 読書会への参加に必要な事前準備が必要ないため参加のハードルが低い お互いの知識を補え合え

こんにちは、エンジニアの id:i1derful です。 2020年モバイルファクトリーアドベントカレンダーの21日目の記事です。 はじめに 僕は、とあるプロダクトチームのフロントエンドユニットに所属しています。 主に何してるかですと、フロントエンド改修プロジェクトに携わっています。 フロントエンド改修プロジェクトでは、レガシーなコードをリプレイスしています。 プロジェクト内での自身の主な役割は、 プロジェクトの方針および指針を決める スケジュールを切る 遅れたらテコ入れして上長に「いい感じ」に報告して交渉する メンバーの作業範囲・段取りを考えて伝える 何人のエンジニアを借りれるか相談する もちろん作業する このプロジェクトはすでに2年ほどやっています。 Q: 2年やっての感想は？ A: 疲れましたね もちろん疲れただけでなく得られたものは当然ありますよ。 失敗は成功のもとと言いますので、

この記事はモバイルファクトリー Advent Calendar 2020 17日目の記事です。 こんにちは、エンジニアのshioiyanです。 モバイルファクトリーには部活動制度があり、いくつもの部活動が存在しているのですが、自分はそのうちのゲームジャム部に所属しています。 今年2月から弊社はリモートワークになりましたが、ゲームジャム部はビデオ通話を使って活動を継続しています。 近頃、外出自粛している人が増えた中でも、ビデオ通話で話しながら楽しく遊べるサービスを作ろう！ということで部活を通じて、Web上でリアルタイムにそれぞれの画面が同期するお絵かきチャットの開発をしました。 仕様 今回作るリアルタイムお絵かきチャットの仕様はざっくり以下のようになります。 ユーザは部屋を選んで入室ができる 部屋にはマウスやタップ操作で絵を描くことのできるキャンバスがある 絵を描くと同じ部屋のメンバーのキャ

この記事はモバイルファクトリー Advent Calendar 2020 14日目の記事です。 はじめまして、20卒エンジニアのthe96です。 今回は業務中に使っているPerlのVSCodeの拡張機能のメソッド呼び出しの際の定義元ジャンプが正しく動作するように修正した話をします。 やったこと 従来のVSCode Perlではメソッド呼び出し(Hoge::Fuga->func())のときに定義元ジャンプを行った場合、別パッケージの同名関数の定義元に移動してしまうことがあります。 ソースコードを読む際に正しい定義元に移動しないと不便なので、この拡張機能に手を入れて改善しました。 この不具合について説明するために、同名の関数helloが定義された二つのパッケージAとBを用意しました。 修正前の定義元ジャンプ機能では、関数呼び出し(A::hello)のときはA#helloの定義に移動できています