この記事は、Feedforce Group Advent Calendar 2023の1日目です。初日から縁起でもない題材を選んでしまった感はありますが、どうかお付き合いください。 フィードフォースでは、サービス運営上のトラブルがあったときに、「障害レポート」と題して報告書を作成します。きっと他社でもインシデントレポートとか事故報告書とか、名前を変えて同じような取り組みがあるかと思いますが、今日はその障害レポートを作成する上で、わたしが気をつけていることをご紹介します。 この記事で特に伝えたいポイントは、次の3つです。 読者の視点で情報を再構成する パラグラフ・ライティングで書く 事実と意見を書き分ける 障害レポートの目的 フィードフォースにおける障害レポートの作成と活用の目的は、障害に関する情報を整理し、正しい意思決定をすることです。障害レポートの作成が始められるのは、障害発生を把握した

新聞の題字が一覧できるサイト・題字ペタペタを、ねこぺんと作って公開しました。 daipeta.com こんな感じで、いろいろな新聞の題字を掲載しています。絞り込み検索もできます。 題字ペタペタのトップページ この題字ペタペタができるまでの話を、社内勉強会で発表しました。スライドを置いておきますので、どうぞご覧ください。 speakerdeck.com 技術的には、Contentful に入れたデータをもとに Gatsby でページを生成し、Netlify でホスティングしています。ここ最近よく見かける定番の構成ですね。 また、Web フォントサービス REALTYPE を利用して、イワタ UD 新聞明朝 や イワタ UD 新聞ゴシックで組んでいます。簡単に使えるだろうと甘く見ていたら、これになかなか苦労したんですが、それについてはまた別の記事で。 デザインについては、主にねこぺんが担当して

はじめに 最近、競技プログラミングの勉強をはじめました。仕事で求められるものとはまた違った知識・経験が要求され、なかなか難しさを感じています。 この記事では競技プログラミングを通して学んだ、Rubyを用いたbit演算の基礎をまとめたいと思います。 bit演算の基礎 表示 0b を先頭につけることで2進数表示にできます。 irb(main):> bit = 0b101 irb(main):> bit => 5 論理回路 & は積(AND)、| は和(OR)、~は否定(NOT)、 ^ は排他的論理和(XOR)を示します。 irb(main):> bit = 0b101 # 10進数では5 irb(main):> another_bit = 0b111 # 10進数では7 irb(main):> bit & another_bit => 5 # 0b101 irb(main):> bit | a

昨日 Vector ClockとCRDTsについて調べてるけどまだ上手く説明できない と泣き言を言った後、調べてなんとか書きました。actorの気持ちにはあんまりなってません。 言葉や概念の正確さが不安なので、詳しい方にぜひご教授頂きたいです。 Phoenix.Presence Channelのトピックにプロセスの情報を登録でき、それをクラスタ内のノードにレプリケーションできる仕組み。 動画では、トピックへの接続者の一覧を表示する機能に使用されていた。 単一障害点が無い Single Source of Truthが無い セルフヒーリング という特徴がある。鍵となる技術として、CRDT(ORSWOT)があるとのことなので今回CRDTについて調べている。dockyardのブログに作者が記事を書いている[1]。 問題 ノードn1, n2, n3でクラスタを組んでいるとする。n1にuser1が接

JSON色付け係の小飼 id:kogainotdan です。 今回はJSON色付け係として、テスタブルなJSON色付け手法について書きたいと思います。 Reactのみの話です。 3行で windowを触るとテストが辛い ReactのContextを使うとDI出来る DI出来るとテストが簡単 課題 JSON色付け、と言うかGUI開発に限らず外部環境への依存性を持ったソフトウェアコンポーネントはテスト容易性を失いがちです。 中でもWebアプリケーションのフロントエンドでは、HTTPリクエストやTimer関連の処理、Client Side Storageへのアクセス、認可（OAuth）処理などがソフトウェアコンポーネントに含まれているために、テストが難しくなるということはよくあることだと思います。 (もちろんJestのTime Mocksなど、グローバルな環境を書き換えることで解決することもあり

最近の Web アプリはどんどんリッチになっていっていますが、ネイティブアプリとは違って、「ローカルフォント*1を列挙してユーザーに選択させ、それを表示に使う」といったことは仕様上不可能です。 例えば、画像に文字を入れる Web アプリを考えてみます。文字の描画自体は canvas の ctx.fillText() が使えますが、問題はフォントの指定です。ctx.font にローカルフォントを指定するためには、そのローカルフォントのフォント名を知っている必要があります。OS にプリインストールされているフォントでなどであれば、「Web アプリ側であらかじめフォント名のリストを用意しておき、実際にインストールされているかどうかをチェック*2してからユーザーに選択させる」という手段がとれますが、「自分でインストールしたこのフォントが使いたい！」という要求に応えるのは現実的ではありません。 提案

この記事は、 Mercari Bold Challenge Monthの16日目の記事です。 こんにちは。株式会社メルペイのPayment Platform teamに所属している @ogataka50 です。 メルペイではマイクロサービスアーキテクチャで決済システムを開発、運用をしています。 メルペイはNFC決済・QR/バーコード決済・ネット決済を提供しています。それらに加えて、メルカリ内決済のコンビニ/ATM払い、キャリア決済、クレジットカード決済等も提供しています。 メルペイの決済システムはメルカリの決済システムをマイクロサービスとして切り出されたのが始まりになっています。 メルペイはアプリとしては2019年2月13日にサービスリリースしましたが、システム的にはその少し前からメルカリ内の決済機能をマイクロサービス化するため先にリリースされていました。 今回はメルペイリリース前に行われ

id:daido1976 です。入社してからあっという間に1年が経っていました。 直近3ヶ月ほどプライベートでフロントエンド開発の勉強をしていたのですが、ここ数年で CSS の Grid や React の Hooks が新しく導入されたことなどもあり、少し古いコンテンツだと教材として役立たない1 と感じることが多かったので、本記事では私が実際にやってみた中で 2019年時点で オススメできると判断した教材や学び方を皆さんにご紹介したいと思います。 はじめに やったこと JavaScript MDN の JavaScript の部分を読む & 手を動かす JavaScript Primer を読む YouTube 動画で Promise を学ぶ デバッグ方法を学ぶ React React 公式のチュートリアルを2周する egghead.io の動画で Redux を学ぶ ヘルシンキ大学の

こんにちは id:masutaka26 です。 少し前に、Heroku の worker Dyno 上で動く、Chrome のクローラで IP アドレスを固定化出来ないか調査しました。 実装は見送られましたが、想定よりも難しく調査に時間がかかったので、この記事に残しておきます。 方法だけ知りたい方は、下の方にある「手順」をご覧ください。 Heroku Add-on を比較する 開発組織 実装 プラン CLI のインストール Heroku Buildpack [コラム] 固定 IP アドレスへの私見 Chrome のクローラで IP アドレスを固定化する 試行錯誤の日々 ついに成功 手順 QuotaGuard Static の注意事項 まとめ Heroku Add-on を比較する 今回は Proximo と QuotaGuard Static を検討し、最終的に QuotaGuard St

フロントエンドエンジニア N による社内技術記事を本人の許可を得て公開します(一部社外向けに書き換え)。 TL;DR 不正ログイン試行を防ぐため、ソーシャルPLUS のメッセージマネージャーに使われているログインシステムへ、reCAPTCHA v3 を導入したら、意外と大変だった話。 TL;DR reCAPTCHA 導入のきっかけ 機械的な不正ログイン試行を防ぎたい フリクション 1 が少ない reCAPTCHA v3 を試したい 守られている感を醸し出せる 既存ユーザーにフリクションを感じさせないログインを目指したい 安全と思われるユーザーに対しては ボットと思われるユーザーに対しては それでも、人間性が確認できなければ 以下、試行錯誤の過程 まずはシンプルに reCAPTCHA v3 導入した、が 問題は、人間スコアが低かったときのフロー 誤検知対策としての reCAPTCHA v2

追記: 2021年6月現在はアーキテクチャが変わってきています。 次の記事に詳細を書いていますので、一読をお願いします。 Kaizen Adのフロントエンドアーキテクチャの遷移について - Kaizen Platform 開発者ブログ Kaizen Platform でフロントエンドエンジニアをしている山本です。この記事では、我々が運営するサービス「Kaizen Ad」のフロントエンド部分をご紹介します。 Kaizen Ad とは Kaizen Ad は、動画広告をサポートするマーケットプレイスです。 カスタマーがクリエイティブを依頼すると、広告クリエイティブを作成するグロースハッカーから動画広告クリエイティブが納品される仕組みです。 カスタマーにとってはクリエイティブ改善の運用を省力化できると同時に、グロースハッカーにとっても新しい働き方が創造できるソリューションとして提供しています。

Rustの本質は、プログラムを理解する苦労を、未来から現在に移すことにある。 プログラミングRust p.120より はじめに www.rust-lang.org Rustは、とても良い言語です。 Rustを使う理由は、性能、信頼性、生産性を高めたいから、に尽きると考えています。 Rustを学ぶうちに、組込み開発でRustを使うと、多くの恩恵を受けられるのではないか、と考えるようになりました。 正直、組込みが一番Rustの恩恵を受けられるのでは、くらいに思っている。— 錆ありはぐれベアメタル (@LDScell) January 13, 2019 また、Rustを学ぶことは、プログラマとしてのスキルを向上させてくれます。 プログラミングRustで一番お気に入りの文章を引用します。 Rustを使い始めてわかったのは、C/C++では長い間かけてゆっくり学んでいたような「良い書き方」を学ばないこ

こんにちは。Studyplus開発部の田口です。 新規で立ち上がった開発プロジェクトにVueとVuexを採用してみたので、今回はその所感を書こうと思います。 Vue/Vuexの採用理由 今回のプロジェクトで開発するのは、Studyplusのアプリ内ブラウザのWebViewページです。 プロジェクトを開始するにあたって、アプリケーション自体は小規模で、画面の遷移がありつつサーバーとの通信を極力避けユーザーの入力情報を保持したいため、SPAで開発することにしました。 開発にあたって、 モダンな技術を採用し、社内に知見を貯めたい フロントエンドの専任がチームにいないため、専任でないエンジニアがコードを読むときなるべくコストがかからない (上記に関連して)日本語のドキュメントがあるとよい メインで開発を行う自分が過去に少しだけFluxアーキテクチャを触ったことがある という理由でVueとVuexの

久々に色々書きたい気持ちになった + 矢倉さんの書かれたものを見て、彼とは微妙に考えることは違うかなあと思ったので書くだけ書いてみる。意見似てるなと思ってるところは書かないようにはした（標準化方面周りとか）。あと、Webブラウザ周りの現状に明るくない同僚や友人向けのテイストは含んでいる。 そもそもの大前提 まず、Webという文書・アプリケーションプラットフォームの価値は「標準仕様に基づく相互運用性」「インストールせずとも使える」の二点に集約されると自分は思っている。 最近はずいぶん聞かなくなった「Webは簡単に作りやすい」というメリットは、「Win32のデスクトップアプリに比べると」という但し書き付きで、90年代は事実だったと思うけど.NET Frameworkの進化とかモバイルOSアプリが出たりとか業界の成熟に伴って事実ではなくなって久しいと思う。 この「標準仕様に基づく相互運用性」とい

当社の規定により満60歳で定年退職をした。長いようで短かった会社員生活も一区切りだ。自分のプログラマとしての会社員生活を振り返ってみる。無駄に長いし結論はないのでお忙しい人は飛ばして欲しい。 9月末なのでブログ界隈では退職エントリーがそこかしこに書かれると思うが、その中で自分の退職エントリーを連ねることにどれほどの意味があろうか。もちろんないのだが、それでも多くの書き手の年齢を考えると満60歳定年退職というところに若干の希少価値を見出せなくもない。 1984年に大学院修了して以来、プログラマとしてのキャリアを重ねてきた。大学時代の同期でプログラマとして就職したものは皆無だ。当時、工学部の同期はメーカーに就職するのがほとんどで、大手家電メーカー、自動車メーカー、電力会社などなど、当時の誰でも名前を知っている人気企業に就職するものが大半だった。 その中で、日本ディジタルイクイップメント（DEC

ヘンリー・D・ソローの「森の生活」 「難解だ」という評価に怖気て 手に取ることがなかったのだけれど なんだか読みたくなった。 自分にしっくりくる翻訳はどれだろう？ ということを探すため、 翻訳者（出版社）違いの3冊を借りてきました。 翻訳者はその仕事の中で 軸足をどちらに置くのか、それぞれの加減があるのでしょう。 ネット上でも、どこの翻訳が良いか と話題に挙げている人が何人かいた。 原書に忠実であろうとするばかりに、 日本語で何を云わんとするかがわかり難い、 だから海外ものは苦手、という人もいれば そーゆう文体が好きな人もいるらしく、 要は好みなのでしょうけれど、 私としては日本語としての文章に力があって欲しいと思う。 軸足は日本語派。 絶対に同じには訳せないんだもの。 であれば、日本語で、作品の良さが伝わる文章に仕立て直して欲しい。 あちらこちらと読みながら、 ソローの言葉を　噛み締めて

Good morning, my new workplace! pic.twitter.com/b4jEO3jun8— Naoki Takezoe (@takezoen) 2018年8月1日 Good morning, my new workplace! pic.twitter.com/NZfDYWvHUS— Naoki Takezoe (@takezoen) 2018年8月9日 トレジャーデータに入社したと思ったらいつのまにかArmに入社していました。 何を言っているのかわからないと思いますが、私もよくわかりませんでした。

はじめに最近 Rust に興味が湧いて少しずつ触ってみています。学習用に何かガッツリと取り組める題材が欲しいなぁと思い、Writing An Interpreter In Go という本にある Monkey というプログラミング言語の Go 実装を Rust で書き直す、ということをやってみました。 そして、Rust で書き直しただけでは少し物足りない感じがしたので、先の本には登場していない要素として Formatter 及び、wasm32-unknown-unknown をターゲットに Wasm へコンパイルしブラウザで動作させるところまで実装しました。 ちなみに Writing An Interpreter In Go は、既に様々な方が読まれているような有名な本なので特別紹介はしませんが、かなりの良書なので「読んだことない！」という方は是非読んでみると面白いかもしれません。 『Wri

mzpです。こんにちは。 今回、Misocaを辞めて転職する決断をした。そのため、これがこのブログへの最後の投稿となる。なので、Misocaへの感謝を述べつつ退職の報告としたいと思う。 🏢出会い 新卒で自動車メーカーの系列会社に入社し社内SEをしていたが、やりたいこととのギャップを感じはじめたので転職活動をはじめた。 その中で、以前から知っていたMisoca(当時の社名はスタンドファーム)に話を聞きにいった。 自分が自社サービスに興味があったことと、Misocaも資金調達に成功し人を増やすタイミングだったことがうまくマッチし、入社を決めた。 こう書くとちゃんと活動したように見えるが、実際は退職を宣言したあと、何人かの知人とご飯を食べていたら話が進んでいたので運要素が大きい。 資金調達に成功してうんぬんは最近知った。 当時のメモには選んだ理由に以下のものが書かれている。 なぜスタンドファー

2018年7月10日付けでタイププロジェクト株式会社を退職しました。 大学在学中の2012年8月からタイププロジェクトの仕事をするようになり、その後タイプエンジニア（フォントエンジニア）として2015年4月に入社しました。あわせると、6年近くにわたってお世話になったことになります。 タイププロジェクトがコンパクトなチームだったこともあり、製品版フォントのプロダクション、フォーマット変換やカスタマイズ、内製ツールの開発、制作ワークフローの自動化・省力化、イントラの管理などなど、とにかくいろいろなことに携わることができました。仕事を始めた当初はほとんど何もわかっていなかったのですが*1、おかげさまで随分いろいろなことができるようになり、自信もつきました。フォントへの興味がますます深まったのは、言うまでもありません。 タイププロジェクトに参加するまであまり想像していなかったのですが、実際の仕事で