Firebase Setup Series Overview: A Designer's Guide

Hi, I'm Jian from ARCOA. 👋 

In my previous post, I shared why I chose Firebase. Now it's time to actually set it up — and this series will walk you through every step.

"Can you really build an app without a developer?"

I was skeptical at first too. But after going through the process myself, I learned that Firebase is structured so non-developers can set it up step by step. This series captures the fastest and safest way to configure Firebase from a designer's perspective.

1. What You'll Learn from This Series

✅ Firebase Console Fundamentals

Project creation, Blaze plan setup, billing & budget configuration

✅ Google Authentication Setup

Building login functionality + preparing for FlutterFlow integration

✅ Written in Non-Developer Language

Focus on potential roadblocks and the "why" behind each step

📌 Detailed Firestore and Storage configuration, including uploads and security, will be covered in separate series!

2. Firebase Setup Series Overview

Part 1 — Firebase Project Creation

• Setting up your first Firebase project
• Google Analytics integration
• Understanding the Firebase Console structure

Part 2 — Complete Guide to the Blaze Plan

• Understanding Firebase's free tier vs paid tier
• Setting up billing safely
• Configuring budget alerts to avoid surprises

Part 3 — Google Authentication Setup

• Enabling Google sign-in
• Configuring OAuth settings
• Testing authentication flows

Part 4 — Apple Authentication Setup 

• iOS-specific authentication requirements
• Apple ID sign-in configuration

Part 5 — Preparing FlutterFlow Integration

• Connecting Firebase to FlutterFlow
• API permissions and configuration
• Testing the connection

3. What Makes This Series Special

1️⃣ Designer's Language

Concepts that developers take for granted are explained from the ground up, starting with "why this matters."

2️⃣ Screenshot-Driven Walkthroughs

Visual, step-by-step guides showing exactly where to click and what to expect.

3️⃣ Universal Examples

Uses generic structures (users, posts, etc.) that work for any type of app.

4️⃣ Real-World Experience

Based on actual confusion points I encountered as a first-time Firebase user:

• "What settings must I configure during project creation?"
• "Why upgrade to the Blaze plan (paid tier)?"
• "How do I set budget alerts without worrying about charges?"
• "Google Authentication — solving common roadblocks in one go"

4. What You'll Need

• Google Account (for Firebase signup)
• Firebase Account (Blaze plan recommended — requires credit card)
• FlutterFlow Account (optional, for integration)
• A Patient Mindset (it's okay to feel confused at first!)
• 1 hour daily (20 minutes to read, 40 minutes to hands-on practice)

5. Related Series You Might Find Helpful

📌 No-Code DB Design Series (5 Parts)

Learn how designers should think about database structure before building anything in Firebase.

📌 Firestore Setup Series (5 Parts) (Coming Soon)

After Firebase setup, this series will show you how to structure and populate your actual database.

Why Start with Firebase Setup?

Firebase is the foundation of your no-code app infrastructure. Think of it as:

• The house where your app lives
• The engine that powers authentication, data storage, and file management
• The bridge connecting FlutterFlow to backend services

Without a solid Firebase setup, nothing else works. That's why we're starting here.

Next Up: Creating Your First Firebase Project
Let's begin by creating a Firebase project and configuring the essential settings that will support your entire app.

🔗 Series — Firebase Setup

Pre-Setup: Why Firebase for No-Code Designers?
Series Intro: Firebase Setup Series Overview (This post)
Part 1: Firebase Project Creation(Next)
Part 2: Complete Guide to the Blaze Plan
Part 3: Google Authentication Setup
Part 4: Preparing FlutterFlow Integration
Part 5: Apple Authentication Setup 

Ready to build the foundation of your no-code app? Let's get started ✦