> Canonical URL: https://codingcat.dev/post/use-firestore-to-build-hugo-content

# Use Firestore to Build Hugo Content

✏️ Blog PostMay 21, 2019[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/angular-symbol-light.svg)![](/logos/tags/angular-symbol-dark.svg)Angular](/topic/angular)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)[![](/logos/tags/github-symbol-light.svg)![](/logos/tags/github-symbol-dark.svg)GitHub](/topic/github)[![](/logos/tags/security-symbol-light.svg)![](/logos/tags/security-symbol-dark.svg)Security](/topic/security)[![](/logos/tags/nextjs-symbol-light.svg)![](/logos/tags/nextjs-symbol-dark.svg)Next.js](/topic/nextjs)[![](/logos/tags/devops-symbol-light.svg)![](/logos/tags/devops-symbol-dark.svg)DevOps](/topic/devops)[![](/logos/tags/react-symbol-light.svg)![](/logos/tags/react-symbol-dark.svg)React](/topic/react)[![](/logos/tags/ai-symbol-light.svg)![](/logos/tags/ai-symbol-dark.svg)AI & Agents](/topic/ai)[![](/logos/tags/git-symbol-light.svg)![](/logos/tags/git-symbol-dark.svg)Git](/topic/git)

# Use Firestore to Build Hugo Content

![CodingCat.dev tutorial cover image](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/0d3b4005c9cd6dc3b7b51aae56943182563d1e56-1280x720.png?w=1280&q=82&fit=max&auto=format)[![Alex Patterson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)

**Use Firestore to Build Hugo Content ** is a technical guide on CodingCat.dev by Alex Patterson focused on Firebase, Angular, Google Cloud. Use a frontend app (Angular), to update a Firestore Backend, trigger Firebase Function, while maintaining git commits, and buld/deploy your Hugo site.

This tutorial will explore some fairly complex triggers and Git practices.

# Billing Limit Reminder

> Reminder to try and stay as free as possible. You should not run into problems, but just in case. In your Billing Dashboard create a new Budget for your project incase you try this more than say 50 times.

If you want to put a hard cap on builds checkout [Capping API Usage](https://cloud.google.com/apis/docs/capping-api-usage).

For the build API specifically you can go to [Cloud Build API Quotas](https://console.cloud.google.com/apis/api/cloudbuild.googleapis.com/quotas)

To update checkout [IAM & Admin->Quotas](https://console.cloud.google.com/iam-admin/quotas)

# Fork/Clone lesson-8-hugo

You can just clone [lesson-8-hugo](https://github.com/AJONPLLC/lesson-8-hugo) from GitHub but if you want to build out any triggers for Google Cloud building, I would suggest forking to your own repo.

## Clone your Fork

I will run through our example by forking to my ajonp account, you should see it "forked from AJONPLLC/lesson-8-hugo"

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/9f9d15912d22106426495297cc6ca98575211c4b-476x104.png?w=476&q=82&fit=max&auto=format)

You can do this by replacing your_name in this command.

Copied! 🐾

```
git clone https://github.com//lesson-8-hugo.git && cd lesson-8-hugo
```

## Test serving hugo locally

Your theme folder will be empty as it references a git submodule. First make sure that you have all of your submodules cloned locally.

Copied! 🐾

```
git submodule init && git submodule update --remote
```

Now lets run the hugo serve command. This tells hugo to serve using ajonp-hugo-ionic theme and use the config.toml file.

Copied! 🐾

```
hugo server -t ajonp-hugo-ionic --config config.toml
```

You should now see the home page listing the latest books at `http://localhost:1313/`.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/bcb6310fd2251efb3243261d48f95c4dcbd3d8e2-2240x1620.png?w=1600&q=82&fit=max&auto=format)

You can also view all the books in a list format at http://localhost:1313/books/.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/ca8be4889d8555f8a63305a02d30352423029c89-1354x716.png?w=1354&q=82&fit=max&auto=format)

This will be based on whatever the latest content had in `AJONPLLC/lesson-8-hugo` if you don't want any of it feel free to clear all files in `content/books`.

> Remember Hugo dynamically builds files, so if you delete all of the files in `content/books` you will get a 404 on `http://localhost:1313/books/`.

# Create Hugo firebase hosting site

## Create firebase project

Start by Adding a new Project

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/775655854f49d46109a92cb0d1e8318a91c60785-706x986.png?w=706&q=82&fit=max&auto=format)

Give the project a good name.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/e754d637525e591f88965bdc188cd5ae384b6b8e-1956x1474.jpg?w=1600&q=82&fit=max&auto=format)

You can then follow the Getting started under hosting, or follow the update local firebase files.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a3f4df479c4fdad163faf17c8a5d3d2e6fbd349c-2648x1092.png?w=1600&q=82&fit=max&auto=format)

## Update local firebase files

There are a couple firebase commands that you could use to manually add the correct hosting setup `firebase use ajonp-lesson-8` and `firebase target:apply hosting ajonp-lesson-8-hugo ajonp-lesson-8-hugo`. However, I feel it is easier to just update two files.

`.firebaserc`

Copied! 🐾

```
{
	"projects": {
		"default": "ajonp-lesson-8"
	},
	"targets": {
		"ajonp-lesson-8": {
			"hosting": {
				"ajonp-lesson-8-hugo": ["ajonp-lesson-8-hugo"]
			}
		}
	}
}
```

Your update .firebaserc

Copied! 🐾

```
{
	"projects": {
		"default": "your-project"
	},
	"targets": {
		"your-project": {
			"hosting": {
				"your-hosting-name": ["your-hosting-name"]
			}
		}
	}
}
```

In the above example replace the default project to match your project. For targets this is mapping your project to your hosting names, we will define the hosting name in firebase.json as the target.

firebase.json

Copied! 🐾

```
{
	"hosting": {
		"target": "ajonp-lesson-8-hugo",
		"public": "public",
		"ignore": ["firebase.json", "**/.*", "**/node_modules/**"]
	}
}
```

Your update firebase.json

Copied! 🐾

```
{
	"hosting": {
		"target": "your-hosting-name",
		"public": "public",
		"ignore": ["firebase.json", "**/.*", "**/node_modules/**"]
	}
}
```

You will now be able to deploy your site using the firebase CLI.

Copied! 🐾

```
firebase deploy
```

You should see a result with around 53 files.

> If you only see a few check that you ran the submodule update.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/7b6ec5dd7b9ed170ea71859b0701bf9738350c87-1304x856.jpg?w=1304&q=82&fit=max&auto=format)

# Create Hugo Content Google Cloud Build Trigger

Now that we have manually tested that everything works, we want to validate that we can trigger a Hugo build everytime a commit occurs.

## Google Cloud Project

Every Firebase project is really just a Google Platform Project. In order to use the cloud builder we need to enable billing, I suggest switching to the Blaze plan as you won't need to pay anything if you stay under the limits.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/59c21e4a1d2c64cf9c35abb8301581b290302c0f-2190x1326.png?w=1600&q=82&fit=max&auto=format)

Now start by going to [Google Cloud Console](https://console.cloud.google.com/).

You should see a dropdown selection for the project, select the correct project.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/5f5b7c3ebfec814df36245d47da37cf120c8dc22-836x100.png?w=836&q=82&fit=max&auto=format)

### Google Cloud Trigger Enable

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/c18d539621472f7864b1171d5be56ef090e7c61c-734x1080.png?w=734&q=82&fit=max&auto=format)

If this is a new project you will need to enable the cloud build API.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/8e16b86aee0e3065bc9d221faa4df5877f3edbd6-1216x874.png?w=1216&q=82&fit=max&auto=format)

> If you receive an error, please make sure that you have changed to a Blaze Plan in Firebase.

### Google Cloud Trigger Create

If you need more help on this lesson check our [Google Cloud Repositories CI/CD](/post/google-cloud-repositories-ci-cd) for a full walk through.

Select the source from GitHub, and consent.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/41ff44627f06bda5af6e11ee3177d7fcc4f529b1-1348x814.png?w=1348&q=82&fit=max&auto=format)

After you authenticate to GitHub choose your project and continue.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/31d5850656f95ea0f0b1ddc0fc65f19fd84580c8-780x216.png?w=780&q=82&fit=max&auto=format)

Settings

- Name: Hugo CI/CD
- Branch: master
- Build configuration: cloudbuild.yaml
- Substitution variables: _FIREBASE_TOKEN = yourtoken.

# Test Cloud Build Trigger

Before going further we want to make sure your trigger is working. So lets load a sample file into the `content/books` folder. Either copy the examplebook.md renaming to testtrigger.md or create a new file.

`content/books/testtrigger.md`

Copied! 🐾

```
title = "Example Book"
date = 2018-11-26T14:45:13-05:00
images = ["https://cdn.sanity.io/images/hfh83o0w/dev/8abc3816f3381f108a60200d13958d4929a79242-500x281.webp"]
+++

This is a commit test creating a book.
```

## Local git push

Add the new file if needed.

Commit locally

Then push to the remote GitHub repository.

Copied! 🐾

```
git push origin
```

## Trigger History

You should now see a history from this trigger listed in [Google Cloud Build History](https://console.cloud.google.com/cloud-build/builds)

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/abdef4dc621d8ec2360824b1c4d2dea69d6d699c-1870x564.png?w=1600&q=82&fit=max&auto=format)

## Automatically Deployed to Firebase

The last step in cloudbuild.yaml deploys to to firebase, you should see a successful deploy message in your cloud build logs.

Copied! 🐾

```
Starting Step #5
Step #5: Already have image: gcr.io/ajonp-lesson-8/firebase
Step #5:
Step #5: === Deploying to 'ajonp-lesson-8'...
Step #5:
Step #5: i  deploying hosting
Step #5: i  hosting[ajonp-lesson-8]: beginning deploy...
Step #5: i  hosting[ajonp-lesson-8]: found 54 files in public
Step #5: i  hosting: uploading new files [2/48] (4%)
Step #5: ✔  hosting[ajonp-lesson-8]: file upload complete
Step #5: i  hosting[ajonp-lesson-8]: finalizing version...
Step #5: ✔  hosting[ajonp-lesson-8]: version finalized
Step #5: i  hosting[ajonp-lesson-8]: releasing new version...
Step #5: ✔  hosting[ajonp-lesson-8]: release complete
Step #5:
Step #5: ✔  Deploy complete!
Step #5:
Step #5: Project Console: https://console.firebase.google.com/project/ajonp-lesson-8/overview
Step #5: Hosting URL: https://ajonp-lesson-8.firebaseapp.com
Finished Step #5
```

> Reminder if you don't see the new file it may be cached in the browser/service worker, you can force refresh the browser to see this.

# Fork/Clone lesson-8-firestore-functions

The [lesson-8-firestore-functions](https://github.com/AJONPLLC/lesson-8-firestore-functions) is setup to be the admin side of the site that will interact with [Firebase Firestore](https://firebase.google.com/docs/firestore/). I wrote this in Angular, but you could use any Web framework, iOS, Android, Unity...

## Install npm dependencies

Verify that you are in the base directory

Copied! 🐾

```
npm install
```

## Serve locally

At this time you are still pointing at the AJONPLLC project database so you will see some books listed. You must switch to your new firebase project that we created above by changing.

## Update the firebase configuration

> You only need one environment file, but I often have a dev and production setup with both.

In your Firebase Project Overview there is a gear for Settings->Project settings.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/fde90d168297a18d2827652d0caa2c62fbb0f05a-517x179.png?w=517&q=82&fit=max&auto=format)

Then select the "Add Firebase to your web app" under the "Your apps" section.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/0259630cb6930e7dad5bc7e32f1c889abbf149ab-946x357.png?w=946&q=82&fit=max&auto=format)

Copy the Javascript object that is assigned to config, in the next step we will paste this into our environment files.

`src/environments/environment.ts and src/environment/environment.prod.ts`

Copied! 🐾

```
{
    apiKey: "your-apiKey",
    authDomain: "your-project.firebaseapp.com",
    databaseURL: "https://your-project.firebaseio.com",
    projectId: "your-project",
    storageBucket: "your-project.appspot.com",
    messagingSenderId: "your-messagingSenderId"
}
```

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/56b40d172be182c9b472db614ca8ebbb4f7815fa-320x161.png?w=320&q=82&fit=max&auto=format)

## Authentication

Now because this is a new project that we are directing this app towards, you will most likely see an error if you go back to `http://localhost:4200` as we have not updated our Authentication settings yet.

You can update this in Authentication -> Sign-in method. Edit the Google Sign-in provider and enable it. You can find more in the [Firebase Authentication Docs](https://firebase.google.com/docs/auth/)

## Firestore database

Back in your Firestore project select Database->Create Database

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a64e7d286c0b815c38a222a8756f499786fc5dcc-1416x1042.jpg?w=1416&q=82&fit=max&auto=format)

I recommend always starting in a lock mode, it helps you understand what security you will need throughout the app without forgetting something later. At times it even helps with you Data Model as some setups on security are just terrible.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/72080d628703a9714d9e149ca942e1c6386b0d4d-1222x768.jpg?w=1222&q=82&fit=max&auto=format)

> Note at this point because your project is in lock mode you will not be able to successfully update the Firestore database and you will see failures, as every login we update a users record.

## Firebase Hosting Updates

### Update the project name everywhere

You can do a full project find and replace looking for `ajonp-lesson-8-admin` and replace with your-name.

Example I changed mine from `ajonp-lesson-8-admin` to `ajonp-lesson-8-admin2`. If you use VSCode you can do it like below.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/ea4af0dd1c6b51abbc1d3ee304979a2cb849766f-394x190.png?w=394&q=82&fit=max&auto=format)

src/styles/ajonp-lesson-8-admin -> your_name

If you get an error that looks similar to this, it is because the styles file was changed and we just switched all the references in the line above.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/db0a9a9e88b14253dff73b4a178f8066da021d2f-1042x239.png?w=1042&q=82&fit=max&auto=format)

I changed mine from `ajonp-lesson-8-admin-app-theme.scss` to `ajonp-lesson-8-admin2-app-theme.scss`.

> At this time you can test adding and deleting books from the database, but we still have plumbing to work on getting these to build the Hugo site.

# Build Angular Project

At this time I have not started using the Ivy rendering engine, but I hope it can complete builds faster in the future. Grab a quick coffee when you run this one.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/b4a567870ac61f4db75e138a64266db9e4909f38-682x360.png?w=682&q=82&fit=max&auto=format)

Now your entire site is ready for hosting, you can try it locally but running `firebase serve`.

# Deploy Firebase Hosting from CLI

Now that we have a production Angular build in `dist/ajonp-lesson-8-admin2` we can deploy this out to our Firebase Hosting, we just need to create a new site that is authorized.

## Create new site

Hosting->Dashboard->Advanced select "Add another site"

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/6c11fc281f567cbb5961a9711b22d73509967adb-684x255.png?w=684&q=82&fit=max&auto=format)

## Update Authorized Domains

Because we are serving this from a different domain than normal you will need to add it to our Authorized Domains. You can find this in Authentication->Sign-in method->Authorized domains, select "Add domain".

This will be `your-project-admin`.firebaseapp.com

You should now see three localhost, default (our Hugo site), your-project-admin site.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/2ed58cc812a46ee4ccd9140ad952db7268c695f2-952x279.png?w=952&q=82&fit=max&auto=format)

# Update Firestore Trigger to match your GitHub repo

Now that we have both a Hugo site up and running and an Angular admin site up and running we can setup a Firebase Function to trigger everytime we add/delete a book.

## Create Your Github Personal Token

You will need to [Create Github Personal Token](https://github.com/settings/tokens), otherwise you will be sending your password for each request. You can find this in settings->Developer Settings->Personal Access Tokens, select "Generate New Token". This is like a password but you can restrict what access the token is allowed.

For this you can give the repo and read:user access, Name it something meaningful.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/184d222d7f9ab517302b1cb77a9673da9574a6eb-753x866.png?w=753&q=82&fit=max&auto=format)

## Add GitHub Personal Token to Firebase Functions

You can not run this command to save your token out where only Firebase Functions will have access. In a future lesson I am going to show how to secure these better.

You should see a message like this.

# Deploy Firebase Functions from CLI

Now Deploy your functions, this will transcode the typescript and put the js files in the lib directory. I have both of these set to run on Node 8.

You should see a success message

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/6ef97c09e31bb6094747bf24cd10480a1e4323d3-669x211.png?w=669&q=82&fit=max&auto=format)

# Add a book, watch it show in Hugo site

> Warning you could have a race condition occur where your first trigger to build happens after your last. There are a few work arounds for this that I don't cover in this lesson. Remember everytime you save a build happens in Google Cloud Build to regenerate your entire Hugo site.

In the bottom right corner you can click the + fab button, this will open the form for a New Book.

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/c6ad9213406348b24dfda995b2ad52fabd53b219-399x355.png?w=399&q=82&fit=max&auto=format)

Once you click save this will trigger the Cloud Function `gitBookCreateHugoCommit`. Checkout the [logs](https://console.cloud.google.com/logs/viewer)

Watch for the build to take place in [Google Coud Builder History](https://console.cloud.google.com/cloud-build/builds)

You can then navigate over to your Hugo site (after about 2 minutes) and see the new book.

## Delete a book

This does the same thing as adding except it will trigger the `gitBookDeleteHugoCommit` Cloud Function.

## Resources, Links & Official Documentation

- [**Firebase Documentation:**](https://firebase.google.com/docs) Firestore, Data Connect, Authentication, App Check, and Cloud Functions
- [**Angular Developer Guide:**](https://angular.dev/overview) Signals, standalone components, and enterprise Angular workflows
- [**Google Cloud Architecture & Docs:**](https://cloud.google.com/docs) Cloud Run, Kubernetes Engine, BigQuery, and Vertex AI guides

## Related CodingCat.dev Tutorials & Podcast Episodes

- [**Deploy Angular & Next.js apps with App Hosting, now GA! in Firebase: Web Architecture & Implementation Guide**](/post/firebase-2025-04-apphosting-general-availability): Hands-on web engineering breakdown of "Deploy Angular & Next.js apps with App Hosting, now GA!" (2025-04-09). Learn how to integrate Firebase, Google Cloud, Web...
- [**Angular and React Bindings for Data Connect in Firebase: Web Architecture & Implementation Guide**](/post/firebase-2025-04-dataconnect-web-bindings): Hands-on web engineering breakdown of "Angular and React Bindings for Data Connect" (2025-04-29). Learn how to integrate Firebase, Google Cloud, Web Dev, SQL in...
- [**What web frameworks does Firebase App Hosting support?: Web Architecture & Implementation Guide**](/post/firebase-2025-06-app-hosting-frameworks): Hands-on web engineering breakdown of "What web frameworks does Firebase App Hosting support?" (2025-06-05). Learn how to integrate Firebase, Google Cloud, Web ...

## Frequently Asked Questions (FAQ)

### What are the main takeaways from Use Firestore to Build Hugo Content?

Use a frontend app (Angular), to update a Firestore Backend, trigger Firebase Function, while maintaining git commits, and buld/deploy your Hugo site. Use Firestore to Build Hugo Content explores practical patterns for Firebase, Angular, Google Cloud in modern software engineering. Throughout this post, Alex Patterson breaks down real-world implementation details for Firebase, Angular, Google Cloud so developers can apply these patterns directly in production.

### How do you implement Firebase best practices in production?

When adopting Firebase and Angular in a production stack, start by validating your configuration against the [**Firebase Documentation**](https://firebase.google.com/docs) (Firestore, Data Connect, Authentication, App Check, and Cloud Functions). Focus on incremental adoption, automated testing, and observability so your team can measure performance and developer velocity improvements at each stage.

### Where can I watch the full Use Firestore to Build Hugo Content walkthrough and find related code resources?

You can explore the complete write-up and code examples right here on CodingCat.dev, and subscribe to the [**CodingCat.dev YouTube channel**](https://www.youtube.com/@CodingCatDev?sub_confirmation=1) for weekly video tutorials. For a deeper dive into Firebase, check out our related guide: [**Deploy Angular & Next.js apps with App Hosting, now GA! in Firebase: Web Architecture & Implementation Guide**](/post/firebase-2025-04-apphosting-general-availability).

✏️ Visual Architecture Diagram

## how this post connects together.

Follow AJ from first principles to production-ready architecture.

Let’s build it!✏️ Visual Diagram: Use Firestore to Build Hugo Content✓ Good PatternVISUAL DIAGRAM[Diagram Walkthrough]Step-by-step diagram breakdown for Use Firestore to Build Hugo Content: start with Use Firestore to Build, implement Hands-On Implementation, and ship to production.AAA Contrast Verified▶ Watch on @CodingCatDev YouTubeRelated Course & Video

## Watch the Related Video Deep Dive: The Odin Project 2: Git & GitHub Engineering Workflows

Understand how Git actually stores snapshots, master branching and interactive rebase, write atomic commits, and automate PR checks with GitHub Actions.

[View Full Page →](/course/odin-git-and-github-workflows)![](https://cdn.sanity.io/images/hfh83o0w/production/665a6b1f24fc33a6ec350bd555607c1017e79848-1376x768.png?rect=6,0,1365,768&w=1920&h=1080&q=82&fit=max&auto=format)[@CodingCatDev62.5K / 100K Subscribers Goal](https://www.youtube.com/@codingcatdev?sub_confirmation=1)[Subscribe on YouTube→](https://www.youtube.com/@codingcatdev?sub_confirmation=1)[Watch on YouTube App ↗](https://www.youtube.com/watch?v=IIUMYo1GWx0&list=PLCOTCGP0a3VY)

## related deep dives.

[All Blog Posts&rarr;](/blog)[![The Firebase plugin is now available in Codex: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/4e2c8e99f437cb576972d406ec32394a82a19480-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-09-firebase-plugin-for-codex)September 29, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [The Firebase plugin is now available in Codex: Web Architecture & Implementation Guide](/post/firebase-2026-09-firebase-plugin-for-codex)

Alex Patterson's hands-on web engineering breakdown of "The Firebase plugin is now available in Codex" (2026-09-28). Learn how to wire up Firebase, Google Cloud, Web Dev, AI in production web apps.

[![Alex Patterson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)[![The Odin Project 2: Git & GitHub Engineering Workflows](https://cdn.sanity.io/images/hfh83o0w/production/665a6b1f24fc33a6ec350bd555607c1017e79848-1376x768.png?w=1376&q=82&fit=max&auto=format)](/course/odin-git-and-github-workflows)November 4, 2026[![](/logos/tags/git-symbol-light.svg)![](/logos/tags/git-symbol-dark.svg)Git](/topic/git)[![](/logos/tags/github-symbol-light.svg)![](/logos/tags/github-symbol-dark.svg)GitHub](/topic/github)

### [The Odin Project 2: Git & GitHub Engineering Workflows](/course/odin-git-and-github-workflows)

Understand how Git actually stores snapshots, master branching and interactive rebase, write atomic commits, and automate PR checks with GitHub Actions.

[![Alex Patterson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)