Become a cloud pro with hands-on experience in developing, styling, and managing a Cloud-Native web application using Tailwind, Google Cloud, and Firebase. No setup, no cleanup, no hassle.

Cloud Native Web Development - A Hands-On Guidebook-01.jpg

cloud-native-web-app.tar.gz

username

email

access_token

repository_name

author

firebase_proj_name

FIREBASE_TOKEN

cypress_key

cypress_projectID

dev_api_key

sapper

add-firebase-sdk

install-firebase-cli

cypress-cli

headless-mode

headless-mode-2

component-tests-1

component-tests-2

testing-library

cypress-dashboard

enable-tests-CI

enable-PR

svelte-intro

tailwindcss-component

tailwindcss-svelte

tailwindcss-svelte2

user-auth1

login-page

admin-page

user-svelte-store

signin-vs-signout

secure-admin-page

redirect

configure-firestore

create-user-interface-1

write-data-1

persist-new-blog-1

read-data-1

security-rules

configure-emulator

test-fcf-locally

new-service-placeholder

dev-integration

test-new-service

markdown2html

write-test-for-service-1

deploy-service-req-one

deploy-service-req-two

speed-up-CI-CD

local-dev

emulator-start

ch-2/lesson-5

ch-3/lesson-3

ch-1/lesson-4

ch-3/lesson-4

ch-3/lesson-5

ch-3/lesson-6

ch-4/lesson-3

ch-4/lesson-4

ch-5/lesson-1/1

ch-5/lesson-1

ch-6/lesson-2

ch-6/lesson-3

ch-8/lesson-3

ch-8/lesson-4

ch-8/lesson-6

ch-8/lesson-7

ch-8/lesson-8

ch-9/lesson-3

ch-9/lesson-4

ch-9/lesson-5

ch-10/lesson-1

ch-10/lesson-2

ch-10/lesson-3

ch-10/lesson-4

ch-10/lesson-5

ch-11/lesson-2

ch-11/lesson-3

ch-11/lesson-4

ch-11/lesson-5

ch-11/lesson-6

ch-11/lesson-7

create-user-interface-2

create-user-interface-3

create-user-interface-4

write-data-2

write-data-3

persist-new-blog-2

read-data-2

read-data-3

ch-12/lesson-2

ch-12/lesson-3

ch-13/lesson-2

ch-13/lesson-3

ch-13/lesson-4

ch-13/lesson-5

ch-13/lesson-6

ch-13/lesson-7

ch-13/lesson-8

ch-13/lesson-9

new-service-placeholder-copy

write-test-for-service-2

write-test-for-service-3

ch-14/lesson-1

This course is a hands-on guidebook to walk you through the journey to creating your first web application in the cloud.

In this course, you will have hands-on experience in developing, styling, hosting, testing, and efficiently managing a complete Cloud-Native web application. Along with this, you will learn how to make the important decision of choosing a technology or tool for your web application.

By the end of this course, you will have a set of expertise in developing cloud native web applications that will help you throughout your career.

Cloud Native Development with Tailwind, Google Cloud and Firebase

# CI/CD

CI/CD stands for **C**ontinuous **I**ntegration and **C**ontinuous **D**eployment. Let's quickly review the two terms individually.

## Continuous integration

"Integrate what?", you may ask yourself. The answer is source code, and making sure code
written by various team members is merged into a single default branch as
frequently as possible. This is important to avoid feature development in isolation.
The longer each team member works in isolation, the bigger the eventual merge is
going to be. Big merges are painful to review and come with great uncertainty as to
whether everything still works.

To reduce that Big Bang surprise when multiple features are eventually merged into
the default branch, automation and in particular automated tests are of the utmost
importance. The sooner you merge your code
with the rest of the team's code, the better.

Uncertainty, surprises and trouble are all nouns we want to avoid in software
engineering!

## Continuous deployment (or delivery)

CD takes CI a step further. On top of merging code into the default branch as
frequently as possible, why don't we deploy to production as frequently as possible,
too? What if we deploy to production for every merge to the default branch? If
that sounds scary, don't worry. It is perfectly normal for it to be a bit scary the first time you think about it!

A question that everyone asks their mentor on this topic is "How can I deploy
to production before my feature is complete?" The answer is complex, but boils down to something along the lines of "As long as your code is not used, you can deploy as much of it as you would like." A common pattern to hide unfinished code is called **feature toggles** (also known as feature switch, feature flag, feature flipper, conditional feature, etc.). In essence, we can think of it as an `if...else...` statement along the lines of this:

```
if (isFeatureOn("myFeature")) {
    // Execute the myFeature code here
}
```

As a team's CI/CD pipelines mature and feature toggles become more
sophisticated, you will end up with feature toggles based on a lot more than a
boolean value. For example, imagine a feature that is only enabled for Canadian
users who visit your web application at least once per week and have previously
provided feedback on beta releases. You can get as granular as you need to, and
there are services and techniques you can use to make the management of these
feature toggles simpler.

# Chapter activity overview

In the previous chapter, we developed the necessary scripts to manually deploy the
web application. Now, it's time to automate this process so that each change to the
master branch is automatically deployed.

Referring to the [project overview](https://www.educative.io/courses/cloud-native-development/project-overview) diagram, we will focus on the following area of the architecture diagram in this chapter: the "Deploy" task of the GitHub Actions pipeline.

Get an introduction to Continuous Integration and Continuous Deployment.

Introduction to CI/CD

Introduction

Create a GitHub Project Using Monorepo Template

Set Up Backend Using Sapper Template

Host Your Web App on Firebase

Set Up The Continuous Deployment Pipeline

Local Development

Feature Toggles

Production Monitoring & Rollbacks

Testing

Tailwind CSS

User Authentication

Database - Cloud Firestore

Firebase Local Emulator Suite

Trigger Services Based on Events

Final Tasks

What's Next?

Introduction to CI/CD

CI/CD

Continuous integration