Nextjs・Firebase・Nodemailerでお問い合わせフォームを作る
はじめに Nextjs と Firebase を使って作成した Web サイトにお問い合わせさフォームを作成していたのですが、Nextjs Api Routes を使っていて実現するのにハマってしまったのでハンズオン形式で実現の方法をまとめます ここでのハンズオンの内容は以下のリポジトリにあります 学べること Cloud Functions for Firebase を使った Nodemailer のデプロイ 環境 VSCode Firebase tools 12.4.7 Firebase への Nextjs のデプロイ、GCP のプロジェクト用意は各自行ってください(firebase login も含む) npx などの nextjs 作成に関わるものもインストール済みとして進めます 1. Nextjs のプロジェクト準備 まずは問い合わせフォームを作成します ここでは特にバリデーション
Next.jsを使う必要がない小規模なSPAの最小構成を考えてみた
はじめに React開発におけるNext.jsのプレゼンスが日に日に増している今日この頃ですが、Next.jsを使う必要がない小規模なSPAを作る場合の型が欲しくなり、色々調べて技術選定をした上で実際に作ってみるところまでやったので、その技術選定理由とセットアップ手順を共有したいと思います。 フロントエンドの移り変わりは速いとはいえ、割とホットな技術を選定できたと思うのでしばらくは使っていけそうです（そう思いたい…）。 前提 趣味で小規模なSPAを作る場合を想定 ルーティングなしの単機能アプリ SSRが必要ない モーダルなどの動きのあるUIが必要ない 技術スタック Vite Preact TypeScript Tailwind CSS Cloudflare Pages 技術選定理由 Vite 少し前まではこういうケースではcreate-react-appを使用していましたが、Viteに置き
Next.jsをFirebase Hostingで使う
Next.jsをFirebase Hostingにホストする方法を説明します。 Setup Next.js & Firebase Hosting Next.jsのexamplesのwith-firebase-hostingを使います。 Next.jsのプロジェクトが出来たら、firebase loginでFirebaseにログインします。 さらにテスト用のプロジェクトをFirebase Consoleで作成します。 Firebaseのプロジェクトを作ったら、firebase projects:listでProject IDを確認します。 ここで確認したIDを.firebasercに記述します。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
