「Next.js」に関連する技術ブログ

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

Practicing InnerSource in KINTO Tech Blog (Celebrating our 1st anniversary🎉)

Introduction Hello, my name is Rina and I’m involved in Mobility Market development and operation at KINTO Technologies. Usually I work as a front-end engineer implementing websites using Next.js, but I am also one of the members of our Tech Blog team, where I mainly help manage the publishing schedule of all articles. Speaking of our techblog, one year has passed since our first article was released!🎉 This time, in order to celebrate our memorable 1st anniversary, I want to talk about its

Next.js App Router で Keycloak と @auth0/nextjs-auth0 を利用してマルチテナント認証機能を実装する

初めまして、 @takano-hi です。 2023年2月に AlphaDrive にジョインして、主にフロントエンド領域を中心に設計・実装などの業務を担当しています。 最近、Next.js のプロジェクトを新たに立ち上げる機会があり、せっかくなので App Router を採用しました。 そのプロジェクトの認証機能の実装に当たり、今まで他プロジェクトでも利用していた Keycloak と @auth0/nextjs-auth0 の組み合わ

Next.js Web アプリケーションにおける SSG とSSR の比較: 正しいレンダリングアプローチの選択

人気の React フレームワークである Next.js は、開発者がモダンな Web アプリケーションを構築する方法を変えました。Next.js は、Static Site Generation (SSG) や Server Side Rendering (SSR) といった強力な機能を提供し、アプリケーションのパフォーマンスとユーザー体験を最適化します。本記事では、SSG と SSR の主な違い、利点、いつどちらかを選択するか、それぞれのアプローチで AWS

TUNAGの新フロントエンドを支える技術と設計

株式会社スタメン でフロントエンドエンジニアをしている 神尾 です。普段は、エンゲージメントプラットフォーム「 TUNAG 」の開発をしています。 TUNAGでは、2023年1月からWebフロントエンドのリプレイスプロジェクトが始まり、今もプロジェクトが進行中です。現在のWebフロントエンドでは技術選定の選択肢が多く、選定にあたっての検討事項がとても多いと思います。

TUNAGのフロントエンドを段階的にリプレイスしている背景とインフラ構成

こんにちは、スタメンの手嶋、西川です。 普段はエンゲージメントプラットフォーム「 TUNAG 」の開発をしています。 プロジェクトの背景 技術構成・選定 リプレイス前 リプレイス後 構成変更における注意点 1. 意図せず情報がキャッシュされてしまうリスク 2. ダウンタイム発生のリスク リプレイスのフロー 振り返り 最後に プロジェクトの背景 これまでTUNAGは、プロダ

Next.js13 + TypeScript + jestでコンポーネントの単体テストをする

環境 ライブラリ バージョン next 13.4.2 react 18.2.0 react-dom 18.2.0 typescript 5.1.6 jest 29.6.2 jest-environment-jsdom 29.6.2 @testing-library/jest-dom 5.17.0 @testing-library/react 14.0.0 @testing-library/user-event 14.4.3 手順 1. Next.jsの環境構築 公式を参照し、TypeScriptベースで構築してください。 h

Next.js+TailWindCSSのランキングページ実装から、学生の開発では得られない経験ができた話

こんにちは! 6月7日から6月30日までの4週間弱、株式会社CAMのキギョトピチームで「CA Tec ...

新卒エンジニアが経験した研修とスクラムの世界 | 2023年度新卒入社エントリ

ご挨拶 はじめまして! 2023年4月よりスマートキャンプに23卒として入社しました小宮です。 社内ではリーブスと呼ばれています。学生時代のインターンでもジェネシスと呼ばれていたので、なんかカタカナ系のあだ名が多いです。 自分について文章を書くのは苦手ですが、とりあえず書いていきたいと思います。 自己紹介 出身地は東京の蒲田で、東京の住みたくない

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

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

KINTOテクノロジーズのテックブログにおけるインナーソースの取り組み(祝1周年🎉)

はじめに KINTOテクノロジーズでモビリティマーケットの開発・運用を担当しているリナです! 普段はフロントエンドエンジニアとして、Next.jsを用いて実装しています。 またテックブログの運営チームとして、記事のリリース管理なども行っています。 最初の記事 をリリースしてから早いもので、1年が経ちました🎉 今回はテックブログ公開1周年を記念して、テックブ

2023 JSNationとReact Summit参加レポート in オランダ・アムステルダム

こんにちは、ブランドソリューション開発本部フロントエンド部の田中です。普段はWebのフロントエンドエンジニアとして、FAANSのWebの開発を行なっています。 FAANSとは「Fashion Advisors are Neighbors」がサービス名の由来で、ショップスタッフの効率的な販売をサポートするショップスタッフ専用ツールです。 ショップスタッフ向けにコーデ投稿・成果確認などの機能が存在

【イベントレポート】ZOZO Tech Meetup〜ZOZOTOWNフロントエンドリプレイスの事例紹介〜を開催しました!

はじめに こんにちは。DevRelブロックの @wiroha です。6月8日に ZOZO Tech Meetup〜ZOZOTOWNフロントエンドリプレイスの事例紹介〜 を開催しました。ZOZOTOWNを支える開発において「フロントエンドリプレイス」にフォーカスした技術選定や設計手法、設計時の考え方などを具体的な事例を交えながら紹介するオフラインイベントです。 登壇内容まとめ ZOZOのエンジニアと技術顧問の

Next.js × NextAuth × Prisma × VercelPostgresで構築するモダン認証機能システム

はじめに 認証機能を一から作成したいと思い、Next.jsとNextAuthを使ったGithub認証機能の実装を行ったので、その手順を記事していきます。ユーザーデータ管理にPrismaを、データベースはVercelPostgresを使用しています。 ソースコード 実装したサンプルデータは下記リポジトリに格納しています。 https://github.com/MASAKi-cell/next-vecelPsotgres-app バージョン情報 今回実装したバージョ

Next.js で React Server Components を試してみた

こんにちは、フォルシアエンジニアの籏野です。 先日Next.js 13.4が発表され、App Router が Stable 版になりました。 App Router では最新の React の機能を利用することが可能になっており、その中でも特に注目したいのが React Server Components です。 これまでの Next.js では SSR 時にフェッチしたデータを利用する場合、getServerSidePropsやgetStaticPropsを利用していました。 これらの関数で

Next.jsアプリケーションにMicrosoft Clarityを導入してユーザーエクスペリエンスを向上させよう!

こんにちは!フロントエンドエンジニアのつかじです。 今回はNext.jsアプリケーションに Microsoft Clarity を導入してみたいと思います。Microsoft Clarityは、ユーザーエクスペリエンスを向上させるための無料の分析ツールです。このツールを使って、ユーザーの行動を理解し、アプリケーションのパフォーマンスを最適化しましょう。 なぜMicrosoft Clarityを導入するのか? Microsof
技術ブログを絞り込む

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

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