Sansan Tech Blog

Sansanのものづくりを支えるメンバーの技術やデザイン、プロダクトマネジメントの情報を発信

フロントエンド

今さら聞けないビジュアルリグレッションテストをChromaticで始める

Bill One Entry*1グループの秋山です。 1. はじめに 2010年代前半に登場したReactやVue.jsに代表される宣言的UI実装は、大規模なSPAの構築を可能にしました。その一方、フロントエンド領域に新たなアーキテクチャが導入されたことで、それまでWebアプリケー…

Eight で Internet Explorer のサポートを終了するために行ったこと

こんにちは。Eight でエンジニアをしている鳥山(@pvcresin)です。 2022 年 6 月 15 日、Internet Explorer(IE)のデスクトップアプリの提供が終了しました。 それに伴い、PC 版 Eight では IE のサポートを完全に終了し、閲覧することができなくなりまし…

ハイフンに似た文字が Shift_JIS でエンコードできない問題とその解決策

初めまして! 2022年の3月に入社しました渡邉です。 現在はデータ戦略部という部署に所属しておりまして、多種多様なデータを収集・活用するためのサービス開発に携わっています。タイトルにある通り、今更になって Shift_JIS と格闘する羽目になったのです…

esbuild-loader 試してみたら開発ビルドが 2〜3 倍速くなった話

こんにちは。Eight でエンジニアをしている鳥山(@pvcresin)です。 散歩が趣味なので、暖かくなってきて嬉しい今日このごろです。 さて今回は Web フロントエンドのビルド時間短縮のため、esbuild-loader を導入した話をしたいと思います。

ビルドシステムをcreate-react-appからViteに移行した話

こんにちは、技術本部 Bill One Engineering Unitの江川です。 2021年4月に新卒としてSansanに入社したのですが、早いものでもう1年が経ってしまいそうで驚いています。 今回は、そんな早かった1年に思いを馳せつつ、Bill Oneフロントエンドのビルド周りを高…

変更に強いコンポーネント設計の方針と規約(Webフロントエンド)

技術本部 データ戦略部 Newsグループの木田です。 最近、初めて自作キーボードに挑戦しました。ちょうど2枚目のモニターも買ったので、モニター2台と自作キーボードで快適に記事を書いています。 予めお断りしておきますが、この記事は元々、社内向けに設…

GIF しか残ってなかったオリジナルのローディングを CSS アニメーションで再現した話

こんにちは。 Eightでフロントエンドエンジニアをしている鳥山(@pvcresin)です。 気づいたら開発者体験(DX)向上の取り組みばかり記事にしていたので、たまには実装の記事も書いていこうと思います。 今回は、ローディングを CSS アニメーションで実装し…

EightからjQueryが消えた日

Eight Engineering Unitで主にEightのWebフロントエンドを担当している青山です。 今回はEightが長年利用していたjQueryを依存から削除した、という内容を、その経緯を交えながらお伝えします。 レガシーコードをリファクタリングされているエンジニアの方々…

TypeScript を導入して 1 年が経って感じた良かったこと・困ったこと

こんにちは。Eight でエンジニアをしている鳥山(@pvcresin)です。 最近は、デザインとエンジニアリングの距離をもっと近くにできないかということばかり考えています。 なかなか難しい課題で、すぐには答えが出そうにありません。 さて今回は、以前書いた…

TypeScript / JavaScript の import を自動でソートする

こんにちは。Eight でエンジニアをしている鳥山(@pvcresin)です。 マイブームはコンビニで買える GODIVA のベルギーダークチョコレート(アイス)を食べることです。 濃厚で甘すぎず、量も多すぎないところが気に入っています。 今回は TypeScript や Java…

Internet Explorer 11 (IE11) に対応するためにやったこと

こんにちは。DSOC サービス開発部 Bill One Entryグループの山﨑です。 クラウド請求書受領サービス『 Bill One 』で取り込まれた請求書のデータ化システム『 Bill One Entry 』を開発するチームでエンジニアをしています。 bill-one.com Bill One Entry の…

Visual Regression Testingで安心できるフロントエンド環境を作る

こんにちは。Eight事業部で主にフロントエンドを担当している青山です。 今回はEightのWebフロントエンドコンポーネント集にVisual Regression Testingを導入した事例を紹介します。 他社さんの事例や勉強会を見るに敷居も下がってきているようで、遅ればせ…

まだ間に合う!node-sass(LibSass)から sass(Dart Sass)への移行

こんにちは。 Eight で エンジニアをしている鳥山(@pvcresin)です。 違う違うと自分に言い聞かせていますが、おそらく花粉症になってしまいました 在宅勤務で良かったです。 今回は Sass のコンパイルに使用しているライブラリを node-sass(LibSass)か…

compass-mixins から PostCSS の Autoprefixer に移行する

こんにちは。 Eight でフロントエンドエンジニアをしている鳥山(@pvcresin)です。 最近、事業部長に Slack の絵文字をプレゼントするという実績を解除しました。 早く使われないかなとそわそわしています。 さて今回は、Sass の mixin を集めたライブラリ…

eslint-loader の使用をやめることで、ビルド時間を短縮した話

こんにちは。 Eight 事業部でエンジニアをしている鳥山(@pvcresin)です。 最近は、持ち手部分に適度な厚みと重さがあるいい感じのカトラリー(食卓用のナイフ・フォーク等)を探すのにハマっています。 おすすめのものがある方はご一報いただければ幸いで…

Eight 、TypeScript はじめました

こんにちは。Eight でフロントエンドエンジニアをしている鳥山(@pvcresin)です。 最近は UI デザインとアプリケーションのパフォーマンス改善、ビルド時間の短縮に興味があります。 Eight の Web フロントエンドは JavaScript(JS)で書かれていましたが、…

新規事業開発での技術選定の意思と意図 (フロントエンド編)

こんにちは、関西支店で新規事業開発室に所属するソフトウェアエンジニアの加藤です。Bill Oneという新規サービスの開発に携わっています。 バックエンド編の続きとして、フロントエンドで私たちが使用している技術やライブラリを振り返って、どんな意志と意…

© Sansan, Inc.