「TypeScript」に関連する技術ブログ

企業やコミュニティが発信する「TypeScript」に関連する技術ブログの一覧です。

Intersection Observer APIを使ってスクロール後に下部メニューを表示させる

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

【Playwright 入門】Playwrightで始めるE2Eテスト

はじめに こんにちは!フロントエンド開発課の koki _matsuraです。 この記事では、E2Eテスト フレームワーク として用いられるPlaywrightのインストールといくつか基本的なテストコード、最後に 拡張機能 についてもご紹介させていただきます。これからPlaywrightでテストを書きたい人、E2Eテストに少しでも興味を持っていただける方に読んでいただけると幸いです。 目次は次

株式会社エイチーム様とフロントエンド合同勉強会を開催しました

レバレジーズ株式会社 テクノロジー戦略室室長の竹下です。 2023/3/24に、エイチームさんと、フロントエンドをテーマに合同勉強会を開催しました。 以前もプレイドさん と合同勉強会を開催したことがあるのですが、前回は2社クローズだったところを今回は connpassで一般公開 して開催しました! また、弊社の開発拠点が東京の渋谷で、エイチームさんの開発拠点が名古

Vueでpropsとslotを使って再利用コンポーネントを開発する話

こんにちは、KINTO Technologiesグローバル開発部でフロントエンド開発をしているクリスです。 普段フロントエンド開発でコンポーネントを開発する際はpropsを利用して必要な情報を渡す、という話はよく耳にすると思います。Angular, React, Vue, Svelteといった今よく使われているフレームワークではそれぞれの書き方でこの機能を実現しています。すべてのフレームワークを言

【MIIDAS Tech LIVE #1】を開催しました

こんにちはミイダス Tech Officeです。 ミイダス株式会社のテックチームが直近で開発した機能を現場のエンジニアから共有する「 MIIDAS Tech LIVE 」 第1回目の開催となる今回は3つのリリース情報をお届けしました。 採用マッチングサービス「ミイダス」は、独自の診断ツールで採用のミスマッチを減らす中途採用サービスです。メインの採用関連の機能に加え、診断や研修、

読みやすいコードを書くためのガイドライン

はじめに 長くシステム開発に携わっていると、最初は素早く開発することができたけども、今では新たな機能を付け加えるのに、多くの時間を費やすようになったという話をよく聞きます。 初めはシンプルだったソースコードも年月が過ぎていくなかで、機能追加やバグ修正、変更を行なっていくと、コードが非常に複雑化していき、開発者が修正するコストの増加やコ

Svelteでユニットテスト - Svelte不定期連載-02

こんにちは(こんばんは)、Svelte不定期連載その2です。 過去の記事はこちら SvelteKit + Svelte を1年間くらい使ってみた知見など※SvelteKit メジャーリリース対応済み Svelteと他JSフレームワークとの比較 - Svelte不定期連載-01 今回はSvelteのユニットテストについて書いていこうと思います。 モジュールはこちら。 Vitest + jsdom + @testing-library/svelte の3つを使用して行います。 Vitest vite

SREチームはじめました

こんにちは。フォルシア株式会社SREチームの小孫です。 フォルシア株式会社ではこの春からSREチームを始動しました。今回は、なぜこのタイミングでSREチームを始めることになったのか、具体的にどういうことをやっていくのかを紹介します。よく耳にする大規模サービスのSREとは違う、弊社の課題をふまえたSREを目指しているので、私たちの話が少しでも参考になれば

新卒がエンジニアとしての一歩を踏み出すまで

こんにちは、見習いフロントエンドエンジニアのぱやぴです。 新卒として2022年4月に入社、9月に配属されもう早一年がたとうとしていることに驚きを隠せません。何より後輩が入ってくるということが最大の驚きです。 そこで今回は入社から執筆現在(4月)までの約1年間に何を行い、何ができるようになったのかを紹介したいと思います。 AGESTの新卒エンジニアはこうい

TypeScript × axios × Backlog APIで課題登録!

はいどーもー! 早いもので新卒入社から丸3年、コミュニケーションIT事業部の宮澤響です! 本記事では、 Backlog API を利用した Backlog への課題の登録方法について、私が実際にハマったポイントを交えながらご紹介します。 背景・前提 Backlogとは どうしてAPIで課題登録を? サンプルコードについて 下準備 APIキーの発行 プロジェクトIDの確認 スペースのURLの確認 やって

TypeScript × axios × Backlog APIで課題登録!

はいどーもー! 早いもので新卒入社から丸3年、コミュニケーションIT事業部の宮澤響です! 本記事では、 Backlog API を利用した Backlog への課題の登録方法について、私が実際にハマったポイントを交えながらご紹介します。 背景・前提 Backlogとは どうしてAPIで課題登録を? サンプルコードについて 下準備 APIキーの発行 プロジェクトIDの確認 スペースのURLの確認 やって

新卒エンジニアがリファクタを突貫したClean Architectureプロジェクトの舞台裏

プロダクトエンジニアリング部の小林です。 2022年4月に新卒として入社し、アプリケーションエンジニアとしてバックエンドからフロントエンドまで幅広く開発を行っています。 この記事では、配属されたチームで取り組んだリファクタリングをどのように行ったか、その舞台裏について紹介します。 プロジェクトの技術選定と背景 技術選定 Clean Architecture x Next.js x TypeSc

Google Home と SwitchBot API を使って、声で家電を自在に操作できるようにしてみた

1. はじめに 2. Google Homeのしくみ Home Graph について 3. Local Home SDK とは Local Home SDK を使って、やろうと思ったこと 4. Local Home SDKの導入手順 ①あなたが始める前に ②入門 ③スターター アプリを実行する ④クラウド フルフィルメントの更新 ⑤ローカル フルフィルメントを構成する ⑥ローカル フルフィルメントの実装 ⑦スマートウォッシャーを開始する ⑧TypeScript アプリを

Android / iOSアプリのE2Eテスト全部で250シナリオを自動化しました! 第3回 壊れやすいテストと向き合う

こんにちは。 株式会社ココナラで技術戦略室を担当しているKと申します。 ココナラアプリのE2Eテストシリーズ第3回目です。 今回は、E2Eテストの壊れやすさとその対応についてお話ししたいと思います。 まだ第1回、2回をご覧になっていない方は、先に以下のリンクからご覧いただければ幸いです。 https://zenn.dev/coconala/articles/a3a5e33cd1d981 https://zenn.dev/coconala/articles/a3a5e33cd1
技術ブログを絞り込む

TECH PLAY でイベントをはじめよう

グループを作れば、無料で誰でもイベントページが作成できます。情報発信や交流のためのイベントをTECH PLAY で公開してみませんか?