• Head over to the Firebase Console.
• Either start a new Firebase project or pick one you've already got.
• On the left sidebar, under "Build," find and click on "Authentication."
• Go to the "Sign-in method" tab.
• Turn on the "Email/Password" provider.
• Also, enable the "Email link (passwordless sign-in)" option.

• Add Firebase to your web app by following the setup instructions in the Firebase Console.
• Install the Firebase SDK for JavaScript:

npm install firebase

• Import Firebase into your project:

import firebase from "firebase/app";
import "firebase/auth";

• Initialize Firebase with your project's details:

const firebaseConfig = {
  apiKey: "YOUR_API_KEY",
  authDomain: "YOUR_PROJECT_ID.firebaseapp.com",
  projectId: "YOUR_PROJECT_ID",
  storageBucket: "YOUR_PROJECT_ID.appspot.com",
  messagingSenderId: "YOUR_MESSAGING_SENDER_ID",
  appId: "YOUR_APP_ID",
};

firebase.initializeApp(firebaseConfig);

const actionCodeSettings = {
  url: 'https://www.example.com/finishSignUp?cartId=1234', // Make sure this URL points to your sign-in completion page
  handleCodeInApp: true,
};

firebase.auth().sendSignInLinkToEmail(email, actionCodeSettings)
  .then(() => {
    // The link was successfully sent. Save the email locally to complete sign-in after the redirect.
    window.localStorage.setItem('emailForSignIn', email);
  })
  .catch((error) => {
    console.error('Error sending email link', error);
  });

• After the user clicks the sign-in link in the email, they'll be redirected to the URL you specified.

// Check if the current URL is a sign-in with email link
if (firebase.auth().isSignInWithEmailLink(window.location.href)) {
  // Retrieve the stored email from local storage
  let email = window.localStorage.getItem('emailForSignIn');
  if (!email) {
    // Ask the user for their email if not available
    email = window.prompt('Please provide your email for confirmation');
  }

  // Sign-in the user with the email link
  firebase.auth().signInWithEmailLink(email, window.location.href)
    .then((result) => {
      // Clear email from storage
      window.localStorage.removeItem('emailForSignIn');
      // User is signed in successfully
      const user = result.user;
    })
    .catch((error) => {
      console.error('Error during sign-in', error);
    });
}

• Make sure that only authenticated users can access critical pages and data.
• Set up Firebase Security Rules and Authentication State Observers to manage authentication state changes.

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User is signed in.
    console.log('User signed in:', user);
  } else {
    // User is signed out.
    console.log('No user is signed in.');
  }
});

firebase.auth().signOut().then(() => {
  console.log('User signed out');
}).catch((error) => {
  console.error('Error during sign out', error);
});