Findy Team+でフロントエンドエンジニアをしている 川村(@peijun333)です。 Findy では、フロントエンドのコード品質と安定性を確保するために Jest などのテストフレームワークを積極的に活用しています。通常、Jest は CLI から実行してテスト結果をコンソールで確認しますが、コマンドを用意する手間や、テスト経過のデバッグのために都度 console.log などでその内容を確認しなければならずとても不便です。 そこで、今回はテストの自動化とリアルタイムなフィードバックを提供する JavaScript の統合テストツールである Wallaby.js を紹介します。Wallaby.js を導入することで、開発効率の向上が期待できます。 Wallaby.js とは？ 前提条件 VS Code でテストの修正 Wallaby.js はリファクタリングに強い スナップシ

有望なスタートアップに入社して、事業を伸ばして、上場したい。ストックオプションを使ってお金持ちになりたい。 そんな考えはもう古い。 今アツいのは、勢いのないスタートアップに入社することだ。 勢いのないスタートアップとは、資金調達のニュースが結構前に出たきりあまり露出がなく、社員数も増えていない、停滞していそうなスタートアップのことである。 私は歴10年ちょっとの中堅もとい中年エンジニアなのだが、エンジニアとしての実力は贔屓目に見ても中の下程度だ。 しかし、勢いのないスタートアップでは私のような凡庸な人間であってもとても重宝される。 勢いのないスタートアップの経営陣は能力が高くなく、すごい社員もあんまりいない。 みんなすごくないから、黙々とほどほどに仕事をしているだけで貢献を認めてもらえる。 つよつよエンジニアがすごいスピードで開発しているのを見て劣等感を感じることはないし、よくわからないエ

Node.jsはいらない場合がある、むしろいらない場合の方が多いかもしれない、 そしてDenoとBunを使い分けて代替する方法を説明するという記事です。 Post Node.js ランタイムの登場 Node.js のあとにできたランタイムがいくつも登場しています。 Deno Bun WinterJS LLRT この中でも、人気であるDenoとBunを中心に考えていきます。 DenoやBunに変えるメリット これがなければNode.jsから変える必要はないと思います。 私は、以下の3つが、2ランタイムに共通して言える大きなメリットだと思います: ネイティブTypeScriptサポート 高速 Web標準 ネイティブTypeScriptサポート 現在、JavaScriptを記述するときは、TypeScriptを利用することが多いと思います。 Node.jsでTypeScriptを使うとき。tsc

今から10年前の2014年4月に、いわゆるIT系大企業のDBエンジニアを辞めてメルカリでソフトウェアエンジニアとして働き始め、そこから紆余曲折を経て10年たった。 当時の予定通り、まだ現役でコードを書いている。海外に拠点は移り、色んな国の人たちと仕事をするようになり、役割もテックリード、マネジャー、CTOと変わってきた。ソフトウェア開発について考え方もさまざまな変遷を経ているが、少しずつ培ってきた、大事にしていることをあげてみる。 ソフトウェア/アーキテクチャ/コード ソフトウェアは他者の価値(i.e. 課題を解決する/コストをカットする)を生み出してなんぼ。コードが綺麗でも売上は立たない。 アーキテクチャやプログラミング言語のトレンドは変化する。追いかけるよりも、その時々のチームやプロダクトに合った設計やプログラムを選択する。 遊び心は大事。チームやプロダクトにそれほど合ってなくても新し

Webブラウザで3Dモデルを高速に描画する「Babylon.js 7.0」正式リリース。MMD（MikuMikuDance）やApple Vision Proサポート Webブラウザで3Dモデルを高速に描画する「Babylon.js 7.0」正式リリース。MMD（MikuMikuDance）やApple Vision Pro、WebXRなどをサポートし、よりリアルなレンダリングを実現する機能追加も行われた。 マイクロソフトは、Webブラウザ上で2Dや3Dモデルの高速なレンダリングなどを可能にするオープンソースのJavaScriptライブラリ「Babylon.js」の最新版「Babylon.js 7.0」正式版をリリースしました。 We are proud to announce that Babylon.js 7.0 has officially been released! The ne

Intro Chromium にコントリビュートするためには、ソースコードを理解する以外にも、もろもろ必要な周辺知識がある。 ドキュメントはかなり整備されている方ではあるが、そのドキュメントにたどり着くのが難しい場合もある。 レビュアーなどが親切に教えてくれるものをローカルにメモしているが、それも散らばってきたため、ここにまとめることにする。 まずは初期状態で公開するが、どんどん更新していき、長くなっても分割しないで追記を繰り返そうと考えている。 関連サイト 始めて取り組もうとすると、まずどこを見ればわからないところから始まる。 似たようないくつかのサイトがあり、使い分けがされているからだ。 code search https://source.chromium.org/chromium/chromium/src コードをインタラクティブに検索するためのサイト Workspace 風の U

1. 株価はサプライズによって動く 株式相場には常にプロの投資家がうごめいており、各銘柄の各種業績数値を常に予想して投資活動をしている。そんな状況下において、仮に「売上が前年比2倍」という決算が発表されても、株価が2倍になるわけではない。むしろ3倍が予想されていたのに、2倍だったら失望売りとなる。つまり事前予想と比較してこそ意味があり、staticな値や過去実績との比較を特徴量にすることはあまり意味がない。事前予想と決算の乖離、または前回予想と今回予想の乖離こそが意味のある特徴量であると言える。 2. 業績数値の単純な変化率では株価インパクトは測れない 営業利益の事前予想100億円に対し、決算が200億円の場合、 変化率 = （ 実績 - 予想 ) / 予想 の計算式を使うと、変化率は100%となる。 この変化率を特徴量にするのは一見もっともらしいが、株においてはこれは使いづらい。 営業利

皆様こんにちは。QAエンジニアのブロッコリーこと風間裕也（@nihonbuson）と申します。私は本業で株式会社10XのQAエンジニアとして勤務する一方、副業としてB-Testingを開業し、さまざまな会社でQAに関する相談に乗ったり、登壇や執筆活動を行っています。 また社外活動として、WACATE（ソフトウェアテストの合宿型ワークショップ形式勉強会）の実行委員長や、ソフトウェアテスト技術振興協会（ASTER）の主催するJaSST Review（ソフトウェアレビューのシンポジウム）の実行委員長を務めています。 本記事では、私がどうしてQAエンジニアというキャリアを歩んでいるのか、そして品質保証（QA、Quality Assurance）という分野でどのように開発チームと協調しながら開発してきたのかをお話しします。 筆者近影 学術と企業のギャップに驚いてテストの浸透に動く テスト技術に磨きを

1. はじめに 企業に務めるソフトウェアエンジニアにとって、生産性向上というフレーズは聞かない日がないほど身近なものです。私自身も日々の仕事が、チームや組織の生産性向上に寄与するかどうか、意識しながら働いています。そもそもソフトウェアエンジニアという仕事は、人を機械に置き換えるという性質上、生産性向上とは切っても切り離せないという関係性を超え、生産性を向上させる営みそのものと言っても差し支えありません。 では私たちソフトウェアエンジニアのDNAである生産性向上の出自は何処かと探っていくと、どうやら資本主義と共に拡大してきたイデオロギーであることが分かります。資本主義は無限の成長を志向するエンジンを内蔵しており、現在先進国に住まう私たちの生活の豊かさは疑いなく資本主義の恩恵に依拠しています。その一方で、200年以上稼働し続けるこの資本主義というシステムについて、昨今多くの学者と有識者がその綻

デジタル庁サービスデザインユニットでは、一貫したデザインや操作性でウェブサイトやアプリを提供するための仕組み「デザインシステム」の構築に取り組んでいます。どなたでも構築中のデザインシステムのデザインデータを閲覧することができます。 更新情報2023年12月26日 [バージョン1.4.1]スタイルやコンポーネントの修正・更新を行いました 2023年10月18日 [バージョン1.4.0]スタイルやコンポーネントの追加・修正・更新を行いました 2023年8月31日 [バージョン1.3.4]スタイルやコンポーネントの修正・更新を行いました 2023年7月31日 [バージョン1.3.3]新規コンポーネントを追加、スタイルやアセットなどについて修正と更新を行いました 2023年6月29日 [バージョン1.3.2]コンポーネントを追加、テンプレートやガイドラインの一部修正と更新を行いました 2023年6

http://localhost:3000/ にアクセスすると、Waku のデフォルトのページが表示されます。 React Server Components 冒頭で述べたように、Waku は React Server Components に対応しています。React Server Components は React の新しいパラダイムであり、サーバー上でのみ実行されるコンポーネントを提供します。サーバー上でのみ実行されることで、以下のような利点があります。 クライアントに JavaScript が送信されないため、バンドルサイズを削減できる コンポーネントを非同期関数として、直接データベースや外部 API からデータを取得でき、パフォーマンス上の利点がある React Server Components は、サーバー上でのみ実行されるため、クライアント側でのイベントハンドリングや状態

ビジュアルリグレッションテストツール４選！ユーザーが語る各ツールのメリット https://trident-qa.connpass.com/event/308664/ X https://twitter.com/__sakito__

株式会社はてな フロントエンドエキスパート mizdra 1997年生まれ。2020年3月に電気通信大学情報理工学域Ⅰ類を卒業、4月に株式会社はてなに入社。2022年2月にフロントエンドエキスパートに就任し、チームの開発をリードしながらはてな社全体でのフロントエンド啓蒙活動を担う。HNの読みは「みずどら」。 X（Twitter） SpeakerDeck mizdra’s blog 技術や業界など仕事についての情報収集の基盤として多くのエンジニアを支えていたTwitter（現X）が、以前とは異なる姿となってゆく今、必要な情報を過不足なく収集しインプットする方法に悩みを持つ人も少なくありません。 「アフターTwitter時代の情報収集」と題したこの連載では、業界をリードする方々に、Twitterの変化によって普段の情報収集の方法がどう変わったか、欲しい情報を効率よく集めるために何をしているのか

IntroductionFor a long time, centering an element within its parent was a surprisingly tricky thing to do. As CSS has evolved, we've been granted more and more tools we can use to solve this problem. These days, we're spoiled for choice! I decided to create this tutorial to help you understand the trade-offs between different approaches, and to give you an arsenal of strategies you can use, to han

Web版VSCodeがDockerコンテナをWASM環境で起動、Webブラウザ内ローカルマシンとして利用可能に。拡張機能「vscode-container-wasm」登場 WindowsやMacなどのデスクトップPCでVisual Studio Code（以下VSCode）を利用して開発をする場合、同じローカルマシン上でDockerコンテナのLinux環境を起動し、VSCodeのターミナルで接続して操作することは、開発環境としてよくあることだと思います。 これと同じことをWebブラウザ版のVSCodeでも実現する、すなわちWeb版VSCodeが同一Webブラウザ上にWebAssembly化したDockerコンテナを起動し、Web版VSCodeからローカルマシンとして接続し利用できる、実験的実装を実現したVSCodeの拡張機能「vscode-container-wasm」が登場しました。 V

個人的なJavaScriptの情報収集の方法についてまとめてみます。 JSer.infoなどをやっているので、JavaScriptの情報については色々な情報源を見るようにしています。 JSer.infoの範囲の中での情報源については、次の記事でまとめています。 JSer.info 13周年: JavaScriptの情報源を整理する - JSer.info この記事では、少しスコープを広げてJavaScriptの情報収集についてまとめてみます。 かなりスコープが広がってしまうので、万人向けの方法ではなく、個人的な情報収集方法としてまとめています。 この記事では、膨大な情報の中から見つけるというアプローチをとっているので、人によって向き不向きがあると思います。 情報収集の方法 情報の元となる情報源はさまざまなサイトや人になると思います。 しかし、そのサイトや人ごとに見ていくというのはかなり大変