「Next.js」に関連する技術ブログ
企業やコミュニティが発信する「Next.js」に関連する技術ブログの一覧です。
全272件中 166 - 180件目
Next.jsを使ったサイトの表示速度改善
2022/12/08
ブックマーク
この記事は、 ニフティグループ Advent Calendar 2022 8日目の記事です。 はじめに こんにちは！会員システムグループの渡邊です。普段はニフティトップページの開発運用を担当しています。 今回はニフティトップページでも採用しているNext.jsを使ったサイトの表示速度を改善する方法について紹介します。 実行環境 MacBook Pro（M1、2021） macOS v12.6.1 Next.js v13.0.6 next/image 画
NIFTY Tech Talk コソコソ噂話
2022/12/07
ブックマーク
はじめに この記事は、 ニフティグループ Advent Calendar 2022 7日目の記事です。 どうも！IWSです！普段はお客様が初めて@niftyをご利用になる際の無料ID会員登録システムや、サービスをご利用になる際のログインシステムの開発・運用を担当しています。 そして、それとは別にオンライン会議イベントサポートチーム（通称：オンサポチーム）としても活動をさせていただい
S3にあるファイルをExcelJSで加工してクライアントに返す方法
2022/12/06
ブックマーク
X（クロス） イノベーション 本部 ソフトウェアデザインセンター セキュリティグループの柴田です。 これは 電通国際情報サービス Advent Calendar 2022 6日目の記事です。5日目の昨日は、もう一人の柴田さんの記事「 Argo CDを使ってIstioをバージョンアップする 」でした。 はじめに Webアプリケーションの構成 動作イメージ コードサンプル はじめに 社内で Excel ファイルを扱
S3にあるファイルをExcelJSで加工してクライアントに返す方法
2022/12/06
ブックマーク
X（クロス） イノベーション 本部 ソフトウェアデザインセンター セキュリティグループの柴田です。 これは 電通国際情報サービス Advent Calendar 2022 6日目の記事です。5日目の昨日は、もう一人の柴田さんの記事「 Argo CDを使ってIstioをバージョンアップする 」でした。 はじめに Webアプリケーションの構成 動作イメージ コードサンプル はじめに 社内で Excel ファイルを扱
Atomic Designを導入してフロントを構成してみよう！
2022/12/05
ブックマーク
はじめに KINTOテクノロジーズでKINTO ONE新車サブスクリプションシステムのフロント開発を担当しているカンと申します。 現在担当している、プロジェクトから簡単にご紹介させていただきます。 KINTO ONE新車サブスクリプションシステムは新アーキテクチャの適用を順次取り込んでいます。 フロントチームはNext.jsとTypeScript、デザインパータンとしてAtomic Designを採用して
チームメンバーの活動を知る工夫
2022/12/03
ブックマーク
この記事は BASE Advent Calendar 2022 の3日目の記事です。 どうもこんにちは、ShopFrontチームの青木です。 主に ショップデザイン 関連機能の開発を担当しています。 今回は、チームのEMをしていた頃に、メンバーのGitHubやKibelaの活動など一箇所でまとめて見れるWebアプリを作成した話になります。 作成したWebアプリについて 自分のページのスクリーンショット 構成 ローカル
Google Cloud Run と Serverless NEG を活用した Next.js の Preview Deployment 機能の紹介
2022/12/03
ブックマーク
本記事は、CyberAgent Advent Calendar 2022 3日目の記事です。 はじめ ...
Advent Calendar 2022をはじめます
2022/12/01
ブックマーク
自己紹介 はじめまして、KINTOテクノロジーズでモビリティマーケットの開発・運用を担当しているリナです。 普段はフロントエンジニアとして、主にNext.jsを用いて実装しています。 最近のマイブームは、ガンプラを組み立てることです！ Advent Calendarとは 12月1日～25日にかけて、クリスマスまでの期間をカウントダウンするカレンダーのことです。 IT業界では、期間中に1
NestJS を使ってジョブメドレーアカデミーのバックエンド開発をどのように行なっているのか
2022/11/30
ブックマーク
はじめに みなさん、こんにちは。エンジニアの山田です。今回はジョブメドレーアカデミー（以下、アカデミー）の開発の皆さんに集まってもらい、 TypeScript と NestJS を使ったバックエンド開発をどのように行なっているのかをインタビューしました。 以前、アカデミーがリニューアルした際にチームメンバーにインタビューした note もあるので、未読の方はぜひそちら
AWS Amplify + Next.js + TypeScript で作るCognitoユーザープールのアカウント管理アプリケーション
2022/11/25
ブックマーク
はじめに 旅行プラットフォーム部の武田です。 最近、AWS Amplifyを利用してNext.jsのアプリケーションをホスティングする機会があり、実際にアプリケーションを作りながら開発の流れについて紹介します。 Amplifyで楽をしつつ一部のAPIはNext.jsのAPI Routesを利用する、というやり方が比較的シンプルで良いと感じました。 AmplifyでAPIを構築する場合、Next.jsのAPI Routesを利用する
JSConf JP 2022 に協賛します
2022/11/24
ブックマーク
2022年11月26日（土）に開催される、JSConf JP 2022にて、ミイダスはプレミアムスポンサーを務めさせていただきます。また、当日はスポンサーワークショップスペースでミイダスのフロントエンドの取り組みをお話しさせていただく予定です。ぜひご視聴・ご参加ください。 ミイダス株式会社の登壇 スポンサーセッション：11:00〜11:30 スポンサーLT：16:45-16:50
ミイダスのフロントエンドをNext.jsに移行した背景と課題
2022/11/21
ブックマーク
ミイダスのフロントエンド開発では、これまでReactとReduxを中心に、プロダクトや開発組織フェーズとその変化に対応するため技術選定を進めてきました。 そして2021年からスタートしたNext.jsへの移行計画「ミイダス2.0」プロジェクトの全貌について、フロントエンド開発を担当した後藤と松村、李に話を聞きました。 移行した背景や課題、今後の展望についてご紹介しま
Next.jsのローカルとGitHub Actionsで Daggerを実行してみた
2022/11/07
ブックマーク
こんにちは。X イノベーション 本部ソフトウェアデザインセンターの陳です。 CI推進活動の一環として、話題のCI/CDツールDaggerを使ってみました。 この記事では、DaggerでNext.jsプロジェクトのCIを構築して、ローカルと GitHub Actionsで実行する方法について紹介します。 Daggerについて みなさんはどのCI/CDツールを使っていますか？私が所属する部署では GitHub Actionsを使うこと
Next.js 13 の Turbopack をカスタムサーバーで試そうとした話
2022/10/27
ブックマーク
経緯 Next.js Conf 2022 でNext.js 13に関する発表、その中には Turbopack なる大変アツい代物がありました。 Next.js 13 Blog から 700倍だと？？ これは試してみたいですね。 TL;DR 2022/10/27 現在、v13.0.0 ではカスタムサーバー(Custom Server)向けに Turbopack を使う方法はありません。 バージョンアップを待ちましょう。 試してみる ブログでは優位性について記述があるものの、実際の手順は
Next.js + TypeScript + Docker + GitHub Actions の環境構築
2022/10/27
ブックマーク
こんにちは。X イノベーション 本部ソフトウェアデザインセンターの陳です。 この記事では Next.js + TypeScript + Docker + GitHub Actionsの環境構築の方法をまとめます。 セットアップ手順 以下のセットアップを行います。 1. create-next-appでNext.jsのプロジェクトを作成 2. 静的分析ツールESLintの設定 3. コードフォーマッターPrettierの設定 4. テスト フレームワーク のJest、React Testing Lib