「Next.js」のビルドを実行する場合、アクセスするAPIを切り替えたりと、検証環境と本番環境を切り替えてビルドしたいことが多数あります。その場合に「env-cmd」をインストールして環境ごとにビルドを切り替えていきます。
Next.js
「Next.js」の環境を切り替えてビルドする
Next.js
Next.js
「Next.js(React) + GSAP」でアニメーションを実装する
Webページでアニメーションを使用する場合は、便利なライブラリ「GSAP」を使用しております。
またスクロール時にアニメーション表示する場合は、「ScrollTrigger」と組み合わせて使用すると楽に実装できます。
Next.js
Next.js + Materialデザインで、簡単に確認ダイアログを実装する(material-ui-confirm)
「React」で「MUI」を使用したプロジェクトで、確認ダイアログを表示する場合、「material-ui-confirm」を使うと便利です。
通常のJavaScriptの確認ダイアログのように処理を実装する事ができます。
Next.js
Nextjs + MUI で開発を行う(非SSR)
「Next.js」でマテリアルUIを使ってアプリを作成したい場合は「MUI」というライブラリを使用するのが手っ取り早いです。
今回は「MUI」とマテリアルデザインのアイコンを表示する「icons-material」の導入方法をまとめます。
Next.js
Next.jsでSassを使用する
Webで「css」を開発する場合は「Sass」を使用して開発すると記述が楽に行えます。
今回は「Next.js」で「Sass」を導入する内容をまとめました。
導入自体は簡単に行えます。
LINE
「Create LIFF App」でLIFFアプリの開発環境を構築
「LIFF」アプリの開発入門となります。
今回は「LINE」が用意した「Create LIFF App」というツールを使用して、「Next.js + TypeScript」の環境で「LIFF」アプリの開発環境を構築しましょう。
Next.js
[Web] Next.js + TypeScriptでアプリ開発！
近年、Webアプリケーションを作成する場合に「React」を使用して開発する傾向があります。
そんな「React」で、楽に開発するためのフレームワーク「Next.js」と「TypeScript」を使った開発環境の構築を解説します。
Works
「THE HIROSHIMA STRIKER」イベントサイトを開発
私が主催する音楽イベント「THE HIROSHIMA STRIKER」のサイトを開発しました。
開発手法などを記載しております。
使用言語: HTML / JavaScript / css / PHP
フレームワーク: Laravel / React / Next.js