Published on

How to Create Your First Firebase Project in Under 10 Minutes

Firebase is a platform by Google that allows you to build and host web or mobile applications without needing to manage your own servers or databases. You can set up a basic project in under 10 minutes, giving you instant access to user authentication, real-time databases, and cloud storage. By using the Firebase Console and a few lines of code, you can connect a modern frontend to a powerful backend infrastructure that scales automatically as your user base grows.

Why should you choose Firebase for your first app?

Firebase is a "Backend-as-a-Service" (BaaS - a model where developers outsource the behind-the-scenes logic to a provider). This means you don't have to write complex code to handle things like user logins or file uploads. It handles the heavy lifting so you can focus on building the features your users actually see and touch.

In our experience, Firebase is the fastest way for a solo developer to move from a raw idea to a functioning product. Because it integrates directly with Google Cloud, you get professional-grade security and reliability right out of the box. You also get a generous free tier, which is perfect for experimenting with new ideas without spending a dime.

What do you need before starting?

Before you write your first line of code, you need to ensure your development environment is ready. Modern web development in 2026 relies on a few core tools that help you manage packages and run your code locally.

Prerequisites:

  • Node.js (Version 24 or 26 LTS): This is the environment that lets you run JavaScript outside of a web browser. Download the latest Long Term Support (LTS) version from the official Node.js website.
  • A Google Account: You need this to log into the Firebase Console.
  • A Code Editor: We recommend Visual Studio Code for its excellent extensions.
  • Basic Terminal Knowledge: You should know how to open a command prompt or terminal and type simple commands.

How do you create a project in the Firebase Console?

The Firebase Console is the central dashboard where you manage all your app's data and settings. Think of it as the control room for your application.

Step 1: Visit the Firebase Console and click "Add project."

Step 2: Enter a name for your project, such as "My First AI App." Firebase will generate a unique Project ID for you.

Step 3: Choose whether to enable Google Analytics. For your first project, you can keep this on to see how many people eventually use your app.

Step 4: Click "Create project" and wait a few seconds for the resources to be provisioned. Once it is ready, click "Continue" to enter your new project dashboard.

How do you register your app with Firebase?

Even though you created a project, Firebase doesn't know what kind of app you are building yet. You need to register your specific application (Web, iOS, or Android) to get your unique configuration keys.

Step 1: On the Project Overview page, click the "Web" icon (it looks like this: </>).

Step 2: Give your app a nickname, like "My Web App," and click "Register app."

Step 3: You will see a block of code containing your firebaseConfig. This object contains your API keys (Application Programming Interface - keys that identify your app to the service).

Step 4: Copy this configuration object. You will need to paste it into your code later to link your website to the Firebase backend.

How do you install the Firebase CLI?

The CLI (Command Line Interface - a tool used to interact with services by typing text commands) allows you to manage your project from your computer. It is essential for deploying your site to the web or using advanced features.

Step 1: Open your terminal or command prompt.

Step 2: Type the following command to install the Firebase tools globally on your machine:

# This installs the Firebase tools so you can use them anywhere
npm install -g firebase-tools

Step 3: Log in to your account by typing:

# This opens a browser window to verify your identity
firebase login

Step 4: Verify the installation by checking the version:

# You should see a version number like 13.x.x or higher
firebase --version

How do you initialize Firebase in your code?

Now it is time to connect your local code to the Firebase servers. We will use a modern approach that works perfectly with AI-assisted coding tools like Claude Sonnet 4.

Step 1: Create a new folder for your project and open it in your code editor.

Step 2: Initialize a new project and install the Firebase library:

# Create a package settings file
npm init -y
# Install the core Firebase library
npm install firebase

Step 3: Create a file named firebase.js and paste your config. Notice the updated storage URL format used in 2026:

import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";

// Your web app's Firebase configuration
// These values come from your Firebase Console
const firebaseConfig = {
  apiKey: "AIzaSy...",
  authDomain: "my-ai-app.firebaseapp.com",
  projectId: "my-ai-app",
  // Modern apps use firebasestorage.app instead of appspot.com
  storageBucket: "my-ai-app.firebasestorage.app",
  messagingSenderId: "123456789",
  appId: "1:123456789:web:abcdef"
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);

// Initialize Firestore (The real-time database)
export const db = getFirestore(app);

How do you save your first piece of data?

To test if everything is working, you can try saving a "document" (a single record of data) to Firestore (a flexible, scalable NoSQL cloud database).

Step 1: In your main JavaScript file, import the database you just configured.

Step 2: Use the following code to add a user to your database:

import { db } from './firebase.js';
import { collection, addDoc } from "firebase/firestore"; 

async function testFirebase() {
  try {
    // Add a new document to a "users" collection
    const docRef = await addDoc(collection(db, "users"), {
      name: "New Developer",
      joined: 2026,
      status: "Learning Firebase"
    });
    console.log("Document written with ID: ", docRef.id);
  } catch (e) {
    console.error("Error adding document: ", e);
  }
}

testFirebase();

Step 3: Go back to the Firebase Console, click on "Firestore Database" in the sidebar, and you should see your new data appearing in real-time.

What are common mistakes beginners make?

It is normal to run into errors when setting up your first project. Most issues stem from security settings or configuration mismatches.

  • Incorrect Rules: By default, Firebase locks your database for security. If you get a "Permission Denied" error, you need to update your Security Rules in the console to allow reads and writes during development.
  • Outdated Config: Using the old appspot.com storage bucket URL can cause file upload failures. Always use the firebasestorage.app format provided in the latest console.
  • Missing Imports: Firebase uses a "modular" system. This means you must import every specific function you use (like getFirestore or addDoc), or your code will break.
  • Node Version Mismatch: If you use a Node.js version older than 24, some modern Firebase features or build tools might not run correctly.

Next Steps

Now that you have successfully connected your app to Firebase, you can start building real features. We've found that the best way to learn is by adding one feature at a time. Try setting up Firebase Authentication so users can sign up with their email, or use Firebase Hosting to put your website live on the internet.

If you are building an AI-powered app, you can also look into the Firebase Genkit. This is a framework that helps you integrate large language models like GPT-5 or Claude Opus 4.5 directly into your Firebase functions.

For more detailed guides and API references, visit the official Firebase documentation.

Read the Create Documentation