Authentication Guide

Authentication Guide

How to add user login, registration, and permissions to your application. Written for all skill levels.

Table of Contents

What is Authentication?

Authentication answers the question: "Who are you?"

It's like showing your ID at a bar:

  • You claim to be someone (enter username/email)
  • You prove it (enter password, or use fingerprint)
  • The system verifies and lets you in

Authentication vs Authorization

These are different things:

Concept Question Example
Authentication "Who are you?" Logging in with email/password
Authorization "What can you do?" Can you delete other users?

Real-world analogy:

  • Authentication: Your employee badge proves you work here
  • Authorization: Your badge color determines which rooms you can enter

Choosing a Provider

Clerk

What is Clerk?

Clerk is a complete authentication service that handles everything for you:

  • User registration
  • Login (email, Google, Facebook, etc.)
  • Password reset
  • User profiles
  • Session management

Think of it like: Hiring a security company instead of training your own guards.

How Clerk Works

Clerk Features

Feature Description
Pre-built UI Beautiful login/signup forms ready to use
Social Login Google, Facebook, GitHub, etc. with one click
Multi-factor Auth SMS codes, authenticator apps
User Management Dashboard to view/manage all users
Session Management Handles "remember me" and multiple devices
Webhooks Get notified when users sign up, delete account, etc.

Clerk Pricing

Plan Cost Users
Free $0 Up to 10,000 monthly active users
Pro $25/month More users + features
Enterprise Custom Unlimited

When to Use Clerk

Good for:

  • You want authentication done quickly
  • You don't want to manage passwords yourself
  • You need a beautiful UI without designing it
  • You're building a SaaS product

Not good for:

  • You need complete control over user data
  • You have a very tight budget (though free tier is generous)
  • You need offline authentication

Firebase Authentication

What is Firebase Auth?

Firebase Authentication is Google's authentication service. It's part of the larger Firebase platform (database, hosting, etc.).

Think of it like: A free security system from a big company, with optional upgrades.

How Firebase Auth Works

Firebase Features

Feature Description
Email/Password Traditional login
Social Providers Google, Facebook, Twitter, GitHub, Apple
Phone Auth SMS verification
Anonymous Auth Let users try your app before signing up
Custom Tokens Create tokens from your own server
Email Verification Verify user emails automatically

Firebase Pricing

Feature Free Tier Paid (Blaze)
Email/Password Unlimited Unlimited
Phone Auth 10K/month $0.01-0.06 per verification
Anonymous Unlimited Unlimited

When to Use Firebase

Good for:

  • You're already using other Firebase services
  • You want a free, reliable solution
  • You're building mobile apps (great SDKs)
  • You want Google's infrastructure

Not good for:

  • You want everything in one dashboard (Firebase is spread out)
  • You need advanced user management UI
  • You're worried about Google lock-in

Passport.js

What is Passport.js?

Passport.js is a library (not a service) for Node.js. You add it to YOUR code, and it helps you handle authentication.

Think of it like: A toolkit for building your own security system.

How Passport Works

Passport Strategies

"Strategies" are plugins for different login methods:

Strategy What It Does
passport-local Username + password (stored in YOUR database)
passport-google-oauth20 "Sign in with Google"
passport-facebook "Sign in with Facebook"
passport-github2 "Sign in with GitHub"
passport-jwt JSON Web Tokens (for APIs)

You can use multiple strategies at once!

Passport Pros and Cons

Pros Cons
Free - No monthly costs More work - You build everything
Full control - Your database, your rules Security responsibility - You handle password storage
No vendor lock-in - Switch anytime No dashboard - Manage users yourself
Works offline - No external service needed Learning curve - More complex setup

When to Use Passport

Good for:

  • You want complete control
  • You need to keep user data on your own servers
  • You have specific security requirements
  • You're building an enterprise app with compliance needs

Not good for:

  • You want quick setup
  • You don't want to manage password security
  • You need a user management dashboard

Roles and Permissions

What Are Roles?

A role is a label that defines what a user can do.

Real-world example:

Role What They Can Do
Guest View public content only
User View content, create their own content
Editor Edit anyone's content
Admin Everything + delete users

Role-Based Access Control (RBAC)

RBAC is a system where:

  1. You define roles (admin, user, editor)
  2. You assign permissions to roles
  3. You assign roles to users

Permission Examples

Example: Novel Writing App

Action Guest Free User Premium User Admin
Read public novels Yes Yes Yes Yes
Create novels No Yes (limit 3) Yes (unlimited) Yes
Use AI features No No Yes Yes
Delete any novel No No No Yes
View analytics No No No Yes
Manage users No No No Yes

Implementing Permissions

Simple approach - Check role in code:

IF user.role is "admin" THEN
    allow delete
ELSE
    show "Access Denied"

Better approach - Permission-based:

IF user has permission "delete_any_novel" THEN
    allow delete
ELSE
    show "Access Denied"

Why permission-based is better:

  • You can give an editor delete rights without making them admin
  • More flexible as your app grows
  • Easier to audit who can do what

Protecting Routes

What is Route Protection?

Routes are the URLs in your app:

  • /dashboard - user's dashboard
  • /admin - admin panel
  • /settings - user settings

Protection means: Only certain users can access certain routes.

Types of Protected Routes

Route Type Who Can Access Example
Public Everyone Home page, pricing
Auth Required Any logged-in user Dashboard, settings
Role Required Specific roles only Admin panel
Owner Only Only the owner of the resource Edit YOUR novel

Best Practices

Do's

Practice Why
Use HTTPS Encrypts data in transit
Hash passwords Never store plain text passwords
Use secure sessions HttpOnly, Secure cookies
Implement rate limiting Prevent brute force attacks
Add two-factor auth Extra security layer
Log authentication events Track suspicious activity

Don'ts

Practice Why It's Bad
Store passwords in plain text If database leaks, all passwords exposed
Use predictable session IDs Attackers can guess them
Trust client-side checks only Users can bypass them
Keep users logged in forever Security risk if device is stolen
Show detailed error messages "Password incorrect" tells attackers the username exists

Security Flow

Comparison Table

Feature Clerk Firebase Auth Passport.js
Type Hosted Service Hosted Service Library (Self-hosted)
Setup Time 15 minutes 30 minutes 1-2 hours
Cost Free tier, then paid Mostly free Free
Pre-built UI Yes (beautiful) Basic No (build yourself)
Social Login Yes Yes Yes (with strategies)
User Dashboard Yes (excellent) Yes (basic) No (build yourself)
Data Location Their servers Google servers Your servers
Customization Medium Medium Full
Best For SaaS apps, startups Mobile apps, Google ecosystem Enterprise, full control

Decision Flowchart

Quick Start Recommendations

Scenario Recommendation
"I'm a solo developer building a SaaS" Clerk - fastest to implement
"I'm building a mobile app" Firebase - great mobile SDKs
"I need to keep data on my servers" Passport.js - full control
"I'm in a regulated industry (healthcare, finance)" Passport.js - compliance control
"I want social login only" Firebase - simple and free
"I need enterprise features (SSO, audit logs)" Clerk or Passport.js