How to Build a Full Stack App with Next.js 13 and Firebase

• Overview: This guide helps you create a full stack application using Next.js 13 and Firebase. It includes setting up a Next.js project, integrating Firebase for authentication and database, and creating signup and signin pages.
• Key Concepts: Next.js project setup, Firebase authentication, Firestore database, creating user interfaces.

// pages/signup.js
import { useState } from 'react';
import { auth } from '../firebase';


const Signup = () => {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');


  const handleSignup = async () => {
    try {
      await auth.createUserWithEmailAndPassword(email, password);
      alert('User created successfully');
    } catch (error) {
      alert(error.message);
    }
  };


  return (
    <div>
      <input type="email" value={email} onChange={(e) => setEmail(e.target.value)} placeholder="Email" />
      <input type="password" value={password} onChange={(e) => setPassword(e.target.value)} placeholder="Password" />
      <button onClick={handleSignup}>Sign Up</button>
    </div>
  );
};


export default Signup;