ウェブ

Auth0を使用してNext.jsに認証を実装する方法

Auth0を使用してNext.jsアプリに認証と承認を追加するためのステップバイステップのチュートリアル。 Next.js SDKを使用して、アプリケーションをAuth0 APIに接続し、Reactの動的APIルートを作成します。

苛立たしいデザインパターン：メガドロップダウンホバーメニュー

メガドロップダウン、一般的な落とし穴、ホバーの出入りの遅延、軌道三角形の手法、SVGパスの出口領域を設計および構築する際に留意すべきすべてのこと。

SVGator 3.0を使用してSVGをすべて一か所で作成、編集、アニメーション化する方法

本日、[SVGator 3.0]（https://www.svgator.com/?utm_source=article&utm_medium=smashingmag&utm_campaign=svgator3_smashing）を詳しく見ていきます。これは、人気のあるSVGアプリケーションの新しいメジャーリリースであり、作成、編集、およびSVGファイルをアニメーション化し、SVGが提供するものを最初から最後まで最大限に活用します。

アダムアーガイルとポッドキャストエピソード37を壊す：VisBugとは何ですか？

このエピソードでは、VisBugについて話します。それは何ですか、そしてそれはChrome DevToolsにすでにあるオプションの配列とどのように異なりますか？ドリュー・マクレランは、その作成者であるアダム・アーガイルと話をして調べます。

コアWebバイタルをどのように改善したか（ケーススタディ）

Googleの「ページエクスペリエンスアップデート」は6月に公開されます。最初は、Core Web Vitalsのしきい値を満たすサイトは、すべてのブラウザーのモバイル検索でわずかなランキングの利点があります。検索はどのビジネスにとっても重要です。これは、BeauHartshorneとInstantDomainSearchの彼のチームがCoreWebVitalsのスコアをどのように改善したかを物語っています。

ツリーシェイク：リファレンスガイド

「ツリーシェイク」は、JavaScriptをバンドルする際に必須のパフォーマンス最適化です。この記事では、それがどのように正確に機能するか、そしてスペックとプラクティスがどのように絡み合ってバンドルをよりスリムでパフォーマンスの高いものにするかについて深く掘り下げます。さらに、プロジェクトに使用するツリーを揺るがすチェックリストを入手できます。

修正が必要なイライラするデザインパターン：バースデーピッカー

UXに関するこの新しいシリーズの記事では、いくつかの苛立たしいデザインパターンを詳しく見て、より良い代替案を探ります。また、それを構築または設計するときに覚えておくべき多くの例もあります。悪名高いバースデーピッカーから始めましょう。

リトルスマッシングストーリー

今日は、SmashingNewsletterの第300版を送信した日です。この記事は、舞台裏で働く人々からの小さなスマッシングストーリーを共有する小さなお祝いです。

CSSアニメーションとトランジションのイージング関数を理解する

イージング関数は、アニメーションの速度または速度に影響を与えることにより、アニメーションのルックアンドフィールを変更できます。この記事では、イージング関数について深く掘り下げ、それらを使用して自然で見事なアニメーションを作成する方法を見ていきます。

アクセシビリティテストのレイヤーをプロセスに組み込む方法

アクセシビリティの専門家であるKateKalcevichとMikeGiffordは、読者に「階層型アクセシビリティテスト」を紹介します。これは、デジタル製品ライフサイクルのさまざまな段階でさまざまなツールとアプローチを使用して、アクセシビリティの問題を早期に発見する方法です。