インゲージ開発者ブログ
https://blog.ingage.jp/
インゲージ開発者ブログ
フィード
![記事のアイキャッチ画像](../../images/feed-thumbnails/SHzXNHoDUE-150.jpeg)
putsデバッグを少し便利に
インゲージ開発者ブログ
こんにちは、tsuka05です。putsデバッグしてますか? puts_debuggererはputsデバッグを少し便利にしてくれるライブラリです。 require 'pd' することによって、pd メソッドが使えるようになります。 # /Users/User/trivia_app.rb # line 1 require 'pd' # line 2 class TriviaApp # line 3 def question # line 4 bug_or_band = 'Beatles' # line 5 pd bug_or_band # line 6 end # line 7 end # l…
9日前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
PagerDutyを爆速で導入
インゲージ開発者ブログ
SREチームのanecho108です。 大型連休前にこの記事を書きたかったのですがズレ込んでしまいました。 皆さん、オンコール対応していますか? 世の中の多くのSREの方はオンコール対応を実施しているのではないかと思います。 弊社ではオンコール対応のツールとしてPagerDutyを導入しました。 ほぼ1日で導入した記憶がありますのでその時のお話をさせていただければと思います。 PagerDutyとは? 一言でお伝えするとインシデント管理プラットフォームのツールです。 インシデント発生した場合のオンコール対応やエスカレーションルール、 さらにはポストモーテム管理などSRE業務の一つでもあるインシ…
16日前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
Git の cherry-pick で複数コミットをまとめて取り込むには?
インゲージ開発者ブログ
なんぴともおのが富には満足せざれども、おのが知恵には満足するものなり レフ・トルストイ「アンナ・カレーニナ」より こんにちは!日々、不可解なエラーに苦悩する hikaru-kimi です! Git を使用する際、あるブランチのコミットを他のブランチに取り込みたい場合ってありますよね?そんなときは皆さん大好き cherry-pick を使うと思います 私も学生時代から約10年間、この cherry-pick には随分と助けられてきました。しかし、私はこの cherry-pick についてはコミットを一つずつ取り込むことにしか利用したことがなく、その他のオプションについては知ろうともしてきませんで…
1ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
iOS とAndroid UIの違い5選
インゲージ開発者ブログ
みなさんこんにちは。 UIUXデザイナーのa.nです。 今日はモバイルデザインをする上で大切なiOS とAndroid UIの違いについて5 個ご紹介します。 今回取り上げるOSの違いはMaterial Design, Human Interface Guidelinesで定義されているものを参照しています。 過去にMaterial Design, Human Interface Guidelinesの概要についてもご紹介していますので、よければご参照ください! 1.システムフォント 2. 単位 と最小押下面積 3.内蔵ナビゲーション 4.上部,下部のナビゲーションバー 5.モーダル 1.シス…
1ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
インゲージ2人目のフロントエンドエンジニアとして入社しました。
インゲージ開発者ブログ
はじめまして。 株式会社インゲージの開発部に所属してます、fujimmm331といいます。 フロントエンドエンジニアとして入社し、ちょうど1ヶ月がたちました。 せっかくなので今日は入社エントリーを書いてみようと思います。 (なんやかんやこのブログで入社エントリーを書くのは私が初のようです) こういう雰囲気なんだな〜とか、 インゲージに興味持っていただいた方の何か参考となれば幸いです。 私について 新卒の頃は自動車ディーラーのセールスとして働いてましたが、 全くセールスに向いてないことに気づき約3年前にジョブチェンジしエンジニアとして働き出しました。 もともとインゲージには業務委託として参画して…
1ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
開発チームとエラー対応の付き合い方について
インゲージ開発者ブログ
ものごとはね、心で見なくてはよく見えない。いちばんたいせつなことは、目に見えない。(サン=テグジュペリ「星の王子さま」より) こんにちは!チーム体制が変わってバタバタの hikaru-kimiです! 弊社は今年で創業10周年を迎えました。開発体制の規模も、私が参画した当初と比べると飛躍的に大きくなりました。 今回は、開発チームとエラー対応の付き合い方について、最近私が感じた所感を記していきたいと思います。 弊社インゲージの開発チームはスクラム開発という手法を取っています。スクラムの概要については割愛しますが、スクラムではスプリント初めにチームとしてスプリントで行うタスクの分量を「確約」した上で…
2ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
よく耳にするTypeScriptの変性とは?
インゲージ開発者ブログ
こんにちは!新卒エンジニアのhansprocsです! TypeScriptでの型定義を行う時に、毎回変数に新しく型をつけるのはめんどくさいですよね。 そのためによく型同士を合わせたりもしています。すでにあるもので定義ができるのですごく便利。 しかし、通ると思っていた書き方からエラーが出ることがあります。 原理を知ることで、これからは悩みたくない!ということで今回は「変性」について調べました。 まずは変性を意識せずTypeScriptの挙動を見ていきたいと思います。 return値の型 以下は引数の型は同じで、return値の型が異なる時の代入を行なっています。 type Func = (a: …
2ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
VueUseのuseStorageを徹底解説:window.localStorageとの比較とそのメリット
インゲージ開発者ブログ
はじめに こんにちは、フロントエンドエンジニアのraraya99です。 いきなりですが皆さんはブラウザのストレージ(localStorage)にデータを格納したいと思ったことはありませんか? 例えば、ユーザーの設定情報やフォームの入力内容を保存しておき、次回アクセス時にそのデータを自動的に読み込むといった使い方があります。 localStorageを使用すると、データをキーとバリューのペアとしてブラウザに保存し、ページがリロードされてもデータを保持できます。 このような場合、標準のWebAPIのwindow.localStorage(以下window.localStorage)を使用して実装す…
2ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
AWS Summit 2024 に参加してきました!
インゲージ開発者ブログ
id:kizashi1122 です。 先日 6/20-21 に幕張で開催された AWS Summit 2024 に参加してきました。 参加は去年に引き続き2回目です。 いやあすごい人ですね。 5万人が参加登録したとか。スポンサーがたくさんいるとは言え、参加費が無料なのもすごいです。 基調講演を含めてセッションやブースの数も多くいろいろ聞きましたが、すべて紹介するわけにはいかないので一つだけ。 AWS でレジリエントな分散システムを構築するためのデザインパターン AWS 新谷さんのセッションです。 モノリスなアプリケーションには課題があります。 一つの機能障害がシステム全体の停止の繋がる可能性が…
2ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
Windows で時計を自動調整する
インゲージ開発者ブログ
こんにちは、masm11 です。今回は Windows の話です。 皆さんは Windows を使っていますか? 私はゲームのために仕方なく使っています (ゲーム専用機は買わない派)。 ゲームでなくてもいいのですが、正確な時計って重要ですよね。 1分遅れていれば、それだけ会議等に遅刻しやすくなります。 さて、Windows には自動で時計を合わせる機能が備わっています。 その設定方法については、世の中にたくさん記事がありますので、そちらに譲ります。 しかし、1ヶ月程経つと何故かずれてきていて、「???」と首をひねることも。 私の Windows もそんな状態でした。 状況を確認する イベントビ…
3ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
polarsのDatetime操作にはoffset_byという話
インゲージ開発者ブログ
皆さんこんにちは。機械学習エンジニアのwasatingです。 今回も皆さんおなじみpolarsのtips話をしたいと思います。というかタイトルに書いてある通りなんですが… データ分析をする際や、時系列でtrain, testを分割する際に、最新の日付から一定期間等の区切りをつけたりしたいですよね。 こんな時、日単位での指定であれば単純にdatetimeのtimedeltaを使うことが多いと思います。 しかし、月単位の場合そうもいかないため、dateutilの relativedelta.relativedeltaを使うことで、月単位での計算をすることがあると思います。 が、技術ブログのためpo…
3ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
RubyKaigi 2024 参加レポート
インゲージ開発者ブログ
どうも、@shutooike です。 今年も RubyKaigi に参加してきたので(3年連続3回目)、出張報告かねて簡単にレポートです。 信じられるか、動くんだぜ...? 沖縄 is 最高 気候が良すぎる 全てが美味しすぎる そして漏れなくオリオンや泡盛と合う 危険 人が温かい きれいな Ruby 色 昔社内で「花粉症辛いし沖縄オフィス作りてえなぁ」という話を冗談でしていましたが、本気になりました。 セッション 印象に残っているセッションをいくつか Writing Weird Code 初参加のRubyKaigiではTRICK 2022 (Returns)の優勝作品を見て度肝を抜かれたが、今…
3ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
【Figma】移動距離の単位を設定できる!ナッジ機能
インゲージ開発者ブログ
こんにちは!UI/UXデザイナーのYOROです! そういえばFigmaって移動距離の設定はないのかなと思い、設定探ったら見つかったという今更ながらの発見を共有させてください😎! ナッジって何? どうして設定を変えるの? 設定方法 さいごに ナッジって何? オブジェクトをキーボードの矢印キー「↑←→↓」で移動させるアレのことです。 Figmaではそれを「ナッジ」と呼んでいます。 マウスよりも細かい距離で移動できるため、オブジェクトやパスの位置を細かく調整したい場合にとても便利です。 1pxずつ移動し、Shift押しながらだと10pxずつ移動する設定になっています。 どうして設定を変えるの? We…
3ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
Bun を導入できない3つの理由
インゲージ開発者ブログ
こんにちは。寒暖差でずっと喉が痛い @ishiyu です。 今回は、弊社で Bun を導入しようとして断念した理由について、書いてみようと思います。 Bun を導入しようとしたきっかけは、個人開発しているプロジェクトで Bun を導入しており、ローカルで Node.js と比較してみたら 1分以上 typescript のトランスパイルが早かったので、開発生産性やデプロイ速度の向上を目的に導入しようとなりました。 が、JavaScript Runtime の変更には色々な壁があることが分かり、今は難しいという結論に至りました。 その理由について、簡単にまとめました。 環境 今回試したフロントエ…
3ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
CSV 内の改行コードが混在していると CSV::MalformedCSVError が発生する
インゲージ開発者ブログ
こんにちは、ryohei515です。 弊社が提供している Re:lation では LINE 等のチャットの CSV エクスポート機能があります。 そこで CSV::MalformedCSVError というエラーが発生することがありました。 結論、掲題の通りの原因だったのですが、エラー調査時にこのことが書かれた記事等見かけることがなかったので、備忘で残しておこうと思います。 環境 Ruby 3.1.0 実際に発生したエラー CSV.parse(csv) の処理で、以下の通り発生しました。 /usr/local/lib/ruby/3.1.0/csv/parser.rb:1067:in `par…
4ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
HotwireでBootstrapのツールチップ使う
インゲージ開発者ブログ
社内システムの開発と運用保守を行っている HaraShoです。 去年の夏頃にrails 7に上げてからHotwireを使って開発を行っています。 これまでフロントの実装はjQueryを使っていましたが、Hotwire導入後は極力jsを書かないようにし、Turbo FrameやTurbo Streamを使って画面描画しています。 ちなみに書いているコードより削除したコードの方が多いです 笑 さて本題なのですが、jQueryからHotwire(Stimulus)移行時に色々細かい問題が発生したのですが、その内の1つにBootstrapのツールチップが意図通り動作しない問題がありました。 これまでは…
4ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
synvert-rubyを使ってみる
インゲージ開発者ブログ
こんにちは、tsuka05です。 synvert-ruby はRubyのコードを構文解析して、自動的に書き換えを行なってくれるツールです。 様々なsnippetが用意されていて、決まりきったコード書き換えが簡単にできます。 synvert-ruby -l で、snippetを一覧することができます。 例えば、 synvert-ruby -r rails/convert_after_commit とすると、Railsアプリケーションのコードを下記のように書き換えてくれます。 書き換え前 after_commit :add_to_index_later, on: :create after_com…
4ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
Datadog導入時の備忘録
インゲージ開発者ブログ
SREチームのanecho108です。 前回は、New RelicからDatadogに乗り換えした話を書かせていただきました。 ブログを書いてから数ヶ月経ちましたので、Datadogの導入時に実施したことを備忘録として書かせていただきたいと思います。 Integrations設定 Integrationsの設定方法は自動と手動の2種類 Datadogを使うリージョンを間違えないように Datadog関連のセキュリティを扱うのであれば+SecurityAuditを付与 Terraform化できる CSMの設定 Infrastructure List Metrics Integrations上の見…
5ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
作業効率が上がる! 2024年版 Figma Prototype改善 5選
インゲージ開発者ブログ
みなさんこんにちは。 UIUXデザイナーのa.nです。 今日は2024/02/28にfigmaが発表したプロトタイプ改善の中から特に便利だなと思った5つを紹介します。 日本語で紹介されているものがほとんどなかったため、公式を読むのが大変だなと思っている方の参考になれば嬉しいです。 1.インラインビューアでサイズ変更 2. Noodlesのコピー貼り付け削除 3.ドラッグしてフローの開始点を削除 4.複数の「アフターディレイ」を有効 5.選択したフローのリンクをコピー 1.インラインビューアでサイズ変更 プロトタイプの編集をしながらビューアで確認したい時、今まではインラインビューアのサイズを選ぶ…
5ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
gsub における特殊変数の扱いとその回避策
インゲージ開発者ブログ
完璧なソースコードなどといったものは存在しない、完璧な絶望が存在しないようにね。 こんにちは!ご無沙汰の hikaru-kimi です! みなさまは Ruby でどのように文字列置換を行っていますでしょうか? 最初に一致したもののみ置換する String#sub や、該当したパターンをすべて置換する String#gsub なんかを利用することが多いと思います! 本日は、みんな大好き sub, gsub の意外な落とし穴について紹介していきたいと思います! (便宜的に String#gsub で紹介しますが、String#sub も同様の技術仕様です) gsub における特殊変数の扱いと回避策…
5ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
1Password で 2FA の OTP が自動補完されない
インゲージ開発者ブログ
id:kizashi1122 です。 弊社では Re:lation という SaaS 型の BtoB サービスを展開しています。 認証方法はID/パスワードだけでなく、2FA や SAML 認証もサポートしています。 しかし 私自身も、本サービスを 2FA を利用して使っています。 しかしちょっと気になるところがありました。 1Password で 2FA の OTP(ワンタイムパスワード)が自動入力(自動補完)されないんです!! OTPが保管されない しかたなくコピー&ペーストしていました。 (ちゃんとペースト時にOTPが6分割されて入力されます) なんとかしたい なんとかならないか。自動的…
5ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
UIカタログに関して
インゲージ開発者ブログ
はじめに フロントエンドエンジニアのrarayaです。今回は、弊社でのUIカタログ(Histoire)導入の経緯と、その有効活用方法について話したいと思います。しかし、正直に言うと現在は期待通りに活用できているわけではありません。この機会に、UIカタログの活用法を探ると共に、UIカタログの意義や利点についても深堀りしていきます。また弊社ではデザイナーがFigmaでデザインシステムを構築しているため、ツール間でのデザインの一貫性とフロントエンド開発にどう生かしていくかも今後の課題です。 目次 はじめに 目次 UIコンポーネントとは UIカタログとは何か UIカタログのメリット なぜHistoir…
6ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
nakanoshima.dev #35 でLTしてきました
インゲージ開発者ブログ
id:kizashi1122 です。 nakanoshima-dev.connpass.com こちらでLT話してきました。 speakerdeck.com ちなみに、 nakanoshima.dev さんが X を開設しましたー。 https://twitter.com/nakanoshima_dev
6ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
WSL2 + Emacs pgtk + mozc.el で日本語入力する
インゲージ開発者ブログ
お久しぶりです、masm11 です。 前回は、WSL2 に ArchLinux を入れる記事を書きました。 blog.ingage.jp 今回は、その Emacs で日本語入力します。 Emacs pgtk での日本語入力 pgtk で日本語入力するには、大きく2つのやり方があります。 input method framework を使う方法 デフォルトではこちらになっています。Fcitx5 (または IBus 等) が必要になります。 input method framework を使わない方法 mozc.el という emacs lisp が mozc_emacs_helper を経由して…
6ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
ハイパラ設定だけじゃない!hydraで始めるconfig管理
インゲージ開発者ブログ
こんにちは。機械学習エンジニアのwasatingです。 皆さんはhydra使っていますか? コマンドラインでハイパラの設定ができることから、機械学習の実験を回す際に重宝するため、私も今更ながら活用し始めました。 活用していく中で、細かいconfigの設定にも便利であることに気づいたため、ハイパラ設定以外の用法でもhydraはいいぞ。といった話をしていきたいと思います。 hydraについて hydraはmeta(旧facebook)が公開しているOSSで、configファイルの書き換え等をせずに設定値をコマンドラインで上書きができるため、余計な手間を省けることを売りにしています。 そのため、上述…
6ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
うちのスクラムチームとデザイナーの関わり方
インゲージ開発者ブログ
どうも @shutooike です。スクラムチームでPOをしています。 今回はスクラムのコミュニティの飲み会でも結構盛り上がるスクラムチームとデザイナーの関わり方について、うちのチームのやり方をつらつら書いてみます。 チーム体制の変遷 1. スクラムチームとデザイナーチーム分離型 チームの取り組むタスクが不具合修正や機能改善中心であまりデザインを必要としない時期は、必要に応じて都度デザイナーチームに依頼する形を取っていました。 リソースの兼ね合いや取り組むタスクの性質上この進め方は最適だったと思う反面、同じチームではないので相互理解が浅く、互いの意図が伝わらないなどコミュニケーションの問題が発…
7ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
便利すぎ!Figmaの小ワザ10選
インゲージ開発者ブログ
こんにちは!UI/UXデザイナーのYOROです! 突然ですが、みなさんご存じでしょうか! 実はFigmaは「何これ!」機能がたくさん存在していることを・・。 その中でも私が発見した便利な小ワザのうち、10つ厳選したものを紹介したいと思います! レイヤーを一気にフォーカス(Wクリック) 塗りと枠線を瞬時に入れ替え(Shift+X) 水平垂直のpaddingを一気に調整(Opt+Shift) フレームをPNG画像としてコピー(Shift+⌘+C) 塗りの画像に対してコピーペースト(Shift+⌘+R) 正規表現でリネーム(⌘+R) フレーム内のオブジェクトを一気に整列(Shift+整列ボタン) オ…
7ヶ月前
![記事のアイキャッチ画像](../../images/alternate-feed-image.png)
@ishiyu の Obsidian の活用方法
インゲージ開発者ブログ
ご無沙汰しております。@ishiyu です。 前回の記事で Obsidian プラグインについて書きましたが、社員からそもそも Obsidian の活用方法を知りたいと言われたので今回はそれを書いてみようと思います。 あくまで一個人の使用例なので賛否両論あると思います。 なので、良いところだけ真似してもらえれば良いかと。 Obisidian 画面構成 画面構成ですが、よく使われている File Explorer やカレンダーなどはあえて表示せず、以下の3つの入力エリアだけでの運用をしています。 Daily Note(日報)の入力エリア Todo の入力エリア メモ入力エリア また、よく書くメモ…
7ヶ月前