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

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

frourioを使って1ヶ月で管理画面をリリースした話

はじめに こんにちは、レバテック開発部の河村です。 私はレバテック各種メディアのリプレイスを担当しており、バックエンドを中心にフルスタック開発を行っています。 今回は管理画面のリリースで採用した、フルスタックフレームワークである frourio について、 frourio を採用した理由や使ってみて良かったこと、困ったことを紹介します。 この記事を通して、frourio

はじめての Next.js 入門(Headless CMSとの連携)

こんにちは。 株式会社 ラク スで先行技術検証をしたり、ビジネス部門向けに技術情報を提供する取り組みを行っている「技術推進課」という部署に所属している鈴木( @moomooya )です。 今回は最近プライベートで利用するようになったフロントエンド フレームワーク の Next.js について、使えるようになるまでに参考にした情報などをまとめようと思います。 Next.jsは ホ

Next.js と Auth0で認証機能実装してみた

こんにちは!スマートキャンプ、エンジニアの関口です! 私は現在BOXILと連携させる新規アプリケーションの開発に携わっております。 このアプリケーションは、バックエンドAPIはGo 、フロントエンドはTypeScript/Next.jsで構成されています。 このプロジェクトの中で私は認証機能を担当しました。認証機能はAuth0というIDaaSを利用して実装しています。同じ様な構成で認証

Next.js + NextAuth.js + Prismaで認証付きアプリケーションの作成

こんにちは。フロントエンドエンジニアの 渡邉 です。 普段はReactとTypeScriptを書いています。 今回は自分がNext.js + NextAuth.js + Prismaを使って認証付きアプリケーションを作成する際の土台を紹介をしようと思います。 フロントエンドエンジニアとしてトレンドの技術を抑えておきたいというのと、実際に新規のプロジェクトで開発する際に採用される可能性もあるので、Nex

プロダクト部の社内勉強会を刷新しました

TL;DR (概要) スタメン モバイルアプリGでAndroid・iOSアプリを開発してるカーキです! 昨年から、プロダクト部の勉強会の主催を担当させてもらっています。 突然ですが、皆さんの会社ではどのように社内勉強会を実施されているでしょうか? スタメンではこの6月からエンジニアの社内勉強会の方法を一新しました。 今回このブログでは、スタメンの社内勉強会を新たにど

React + microCMSで実現するZOZOTOWNキャンペーンページのノーコード化

はじめに 2020年新卒入社で、現在ZOZOWEB部所属の 武井 です。ZOZOTOWNのWebフロントエンド開発を担当しています。私は入社以来オフィスに2度しか出社したことがありませんが、そのうちの1度は スタッフインタビュー記事 の撮影のときでした。アートがたくさんある素敵なオフィスですが、それ以降出社できていません。まさか新卒1年目からフルリモート勤務をすると思っ

Core Web Vitalsの計測環境を整える

Core Web Vitalsの計測環境を整える はじめに 現在、MAMADAYSのWebチームでは昨年発表されたCore Web Vitalsを中心としたパフォーマンス改善に注力しています。 今回はパフォーマンス改善でも重要な計測部分について、MAMADAYSではどのようにCore Web Vitalsのデータを定点観測する環境を整えているのかをご紹介したいと思います。 Core Web Vitalsとは Core Web Vitalsとは、全てのサイトにお

すぐにできる! au 無料ゲームにおけるフロントエンドパフォーマンス改善事例

はじめに こんにちは、フロントエンドエンジニアの中畑 ( @yn2011 ) です。 au Webポータル 無料ゲーム では様々なフロントエンドのパフォーマンス最適化に取り組んでいます。今回は、既に実施した最適化の中から 対応コストが小さく、効果が分かりやすかったもの を中心に、対応事例のご紹介をします。 なお、 au Webポータル 無料ゲーム は Jamstack 構成となっており、Next.

ITベンチャーで働くエンジニアのNoCodeとの向き合い方

スマートキャンプでエンジニアをしている瀧川です。 みなさん、NoCode(ノーコード)やLowCode(ローコード)をご存知でしょうか? 考え方としては昔からありましたが最近国内で急速に注目されてきており、今月始めにはNoCodeツールであるAdaloを使って開発されたアプリが資金調達したことでさらに勢いが増したと感じています。 日本初!Nocodeで作成&#

Next.jsのAppとDocumentとページはどんな順序で実行されるのか調べてみた

先日commmuneの_app.tsxの整理をしました。 そのときに_app.tsxと_document.tsxとページコンポーネントがどんな順序で実行されるのか混乱したので調べてみました。

Next.jsのAppとDocumentとページはどんな順序で実行されるのか調べてみた

先日commmuneの_app.tsxの整理をしました。 そのときに_app.tsxと_document.tsxとページコンポーネントがどんな順序で実行されるのか混乱したので調べてみました。

Next.js 10 の新機能 next/image のオプション全部触ってみる

本記事は Next.js Advent Calendar 2020 の 22 日目の記事です。 こんにちは。旅行プラットフォーム部エンジニアの東川です。 フォルシアではフロントエンドフレームワークとして Next.js を使用していますが、2020年は Next.js にとって激動の年であったといえます。 この 1 年間でバージョンは 9.1 から 10.0 に上がり、SSG(Static Site Generation), ISG(Incremental Static Generation)などの新機能が次

Next.js + Express + TypeScript + PostgreSQL の WEBアプリをさくっと立ち上げてプロトタイプ開発をしよう

FORCIAアドベントカレンダー2020 20日目の記事です。 こんにちは、旅行プラットフォーム部の島本です。現在B2C向けの新サービス立ち上げを企てています。 新規事業立ち上げのプロセスの一つにプロトタイプ作成があります。 フォルシアには社内製のWEBアプリケーションフレームワーク(2019年に 新フレームワークを開発 しています)があるのですが、プロトタイプ作成の

AWS Amplify上にNext.jsで構築したアプリに対して、Next.js Analyticsを使ってみた

FORCIAアドベントカレンダー2020 16日目の記事です。 旅行プラットフォーム事業部の山門です。 Versel社が現地時間の10/27に開催したNext.js CONFでは、開催当日にver10の発表もあり、なかなかに盛り上がりを見せたのが記憶に新しいですね。 CONFでは画像周りのアップデートが大きく取り上げらていた印象ですが、自分の中では同タイミングで発表されたNext.js Analyticsの方に興味が

Multi-root Workspacesで、React monorepoプロジェクトのautoimportをいい感じに動作するようにする

この記事はBASE Advent Calendar 2020 15日目の記事です。 devblog.thebase.in こんにちは、Native Application Groupの大木です。最近React.jsを使ったフロントエンドアプリケーションの開発に取り組んでいますが、プロジェクトをmonorepoで管理しています。 今回は、monorepo管理にしたはいいが、Visual Studio Codeエディター(以下vscode)で、TypeScriptのモジュールのautoimportのパス解決に悩まされてやっ
技術ブログを絞り込む

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

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