はじめに こんにちは、旅行 PF 部エンジニアの奥田です。 コードの変更を変更するとデザインが変わることは避けられません。その都度変更を確認するのは開発の一部ですよね。 影響範囲が広い変更を行った場合、確認すべきページ・箇所が増えてしまい、結果として時間や手間が増大し、それがストレスになります。 特に、大規模な変更を含む開発用ブランチをメインブランチにマージする際に、意図せぬ画面表示変更が混入していないことを確認することは、必須の作業になります。 日々の開発を進める中で、これを繰り返し行うのはなかなかに大

こんにちは(こんばんは)、Svelte不定期連載その3です。 過去の記事はこちら SvelteKit + Svelte を1年間くらい使ってみた知見など※SvelteKit メジャーリリース対応済み Svelteと他JSフレームワークとの比較 - Svelte不定期連載-01 Svelteでユニットテスト - Svelte不定期連載-02 今回はSvelteとStorybookを使ってみようの回です。 Storybookとは UIであるコンポーネントを管理・運用しやすくするためのツール、だと認識しています

こんにちは(こんばんは)、Svelte不定期連載その3です。 過去の記事はこちら SvelteKit + Svelte を1年間くらい使ってみた知見など※SvelteKit メジャーリリース対応済み Svelteと他JSフレームワークとの比較 - Svelte不定期連載-01 Svelteでユニットテスト - Svelte不定期連載-02 今回はSvelteとStorybookを使ってみようの回です。 Storybookとは UIであるコンポーネントを管理・運用しやすくするためのツール、だと認識しています

当記事は みずほリサーチ&テクノロジーズ × G-gen エンジニアコラボレーション企画 で執筆されたものです。 Google Maps は Google の提供するサービスの中でもなじみ深いサービスの一つです。 Google Maps Platform では Google Maps の機能やデータを簡単に利用することができ、Google Cloud 選択のきっかけになるプロダクトです。 G-gen の佐々木です。当記事では、Google Cloud のサービスではなく、同じく Google によ

はじめに こんにちは。FAANSバックエンドエンジニアの浜口（ @xlgorbylx ）です。普段はFAANSのバックエンドシステムの開発をしています。 FAANSとは、弊社が2022年8月に正式ローンチした、アパレル店舗のショップスタッフの販売サポートツールです。例えば、ZOZOTOWN上で実店舗の在庫取り置きができる機能や、コーディネート投稿の機能などを備えています。投稿されたコーディネートはZOZOTOWNやWEAR、Yahoo!ショッピング、ブランド様のECサイト等に連携が可能です。これによりお客

はじめに はじめまして。フロントエンド開発グループに所属している岩釣です。 スタンバイ の月間ユーザー数が1000万人を突破しました！(2023年4月末) 本記事ではそんなスタンバイのフロントエンド開発のコーディングガイドラインを紹介します。 なぜコーディングガイドラインを作るのか コーディングガイドラインを作成して運用するメリットは以下です。 コードの可読性の向上 コーディングガイドラインを規定しチーム全員がコーディングガイドラインに基づいて開発することで、コードの統一性が保たれ、コードの可読性が向上し

こんにちは、バックエンドエンジニアの近です！ 4/24〜4/26にかけてアトランタで開催されたRailsConf 2023にWEARバックエンドブロックから近・小山・高久の3人が参加しました。 去年はコロナの影響もあってオンラインの開催だったのですが、今年はオフラインでの開催となり、大勢が参加していて大盛況でした。 我々が開発・運営しているファッションコーディネートアプリ「 WEAR 」のバックエンドはRuby on Railsで開発しています。現在では、新機能の開発やリプレイスなど、チームメンバーの全員

はじめに こんにちは、クラウドエース データ/MLディビジョン所属の金です。 私は海外旅行を行ったり、日常生活でもたまにGoogle翻訳機を使っています。 翻訳結果については大体満足しているんですが、たまに固有名詞などの翻訳は変だなと思った記憶もあります。 最近Cloud Translation APIで用語集機能があるのに気づいてどんな結果が出るかやってみたいなと思いました。 Cloud Translastionのオプションには現在「Translation API Basic、Translation A

はじめに フロントエンドエンジニアの @mk0812 です。自分は普段BackOfficeというチームで新規機能開発を担当しています。 2023年3月〜5月あたりで社内の有志を集めて、Webアクセシビリティの勉強会を行いました。この記事はその勉強会の振り返りをしていきます。 ⁠参加者 ⁠フロントエンドエンジニア: 4名　 デザイナー: 4名 ⁠勉強会で使用した参考書 Webアプリケーションアクセシビリティ──今日から始める現場からの改善 (WEB+DB PRESS plus) なぜアクセシビリティの勉強会

はじめに ブラウザの開発者ツールはウェブ開発において必要不可欠なツールです。 開発者ツールを上手に使うことで、ウェブサイトのデバッグやパフォーマンスの最適化、アクセシビリティの向上など多くのことが行えます。 本記事では、ブラウザの開発者ツールの基本的な使い方や様々なテクニックについて解説します。 開発者ツールとは何か 開発者ツールとは、ウェブサイトのデバッグやパフォーマンスの最適化、アクセシビリティの向上など役立つ機能を提供するツールのことです。 主要なブラウザ（Google Chrome, Mozill

はじめに 当ポストは、低遅延配信の技術であるWHIP(WebRTC-HTTP Ingestion Protocol)を自分で動かしてみたい方へ向けた記事となります。 WebRTCを利用した配信映像の集信プロトコルであるWHIPは現在Internet-Draftではありますが、配信技術者やWebRTC技術者の注目を得て、実際に動かせる環境が整ってきました。 当ポストでは、WHIPが動く環境を作り、自前のWebRTCスタックをWHIPで使う簡単な方法を紹介します。 とはいえInternet-Draftというこ

はじめに こんにちは、CISO部の兵藤です。日々ZOZOの安全のためにSOC対応を行なっています。 本記事では、世間で横行しているフィッシング詐欺に関する情報を収集し、ZOZOを騙ったフィッシングを検知する取り組みについて紹介します。 目次 はじめに 目次 背景と概要 フィッシングハント - ドメイン編 ドッペルゲンガードメイン openSquat 構築 概要 特徴 運用 フィッシングハント - メール編 フィッシングメール収集源 フィッシングメール収集方法 Botによる監視 まとめ おわりに 背景と概要

G-gen の杉村です。Compute Engine の VM で Squid 等の HTTP プロキシサーバ経由でインターネットへ出るような構成を取った際、gcloud コマンドが不可解なエラーメッセージと共に失敗しました。今回はその事象と、解決方法をご紹介します。 事象 やろうとしたこと エラーメッセージ 前提知識 VM とプロキシサーバについて サービスアカウントと VM 原因調査 サービスアカウントは認識できている エラーメッセージ内の URL メタデータサーバはローカルからのみクエリできる 解決

この記事は、2023年4月24日(月)に行われた「さくらのテックランチ vol.3 ～レンサバサービス企画の松花堂弁当と新規事業3分クッキング～」における発表を編集部にて記事化したものです。 谷口と申します。本日は「レン […]

はじめに ページ上部に配置されたメニューバーをスクロースによって画面追従する際、通常は追従させる要素にstickyなどを付与して画面追従させるのが普通かと思います。 画面上部でついてくるこれです。 ですが、イレギュラーではありますが追従させる要素がスクロールによって画面から隠れた後、下部にその要素を配置するなどの要望があった際、window.scroll等を使うなどの方法がありますが、画面サイズによっては正常に動作しないなどの弊害があります。 今回はそんな要望が来た際に、要素の監視を行うIntersect