-
tour-of-heroes-react-vite-cypress-ts
Vite version of the final application built in the book CCTDD: Cypress Component Test Driven Design
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
appsyncmasterclass-frontend
Frontend for a Twitter Clone built with Vue, Tailwind, AWS Amplify & Cognito
-
appsyncmasterclass-backend
Backend for a Twitter Clone built with Serverless Framework, JS, AWS AppSyc, Lambda, DynamoDB & Cognito.
-
tour-of-heroes-react-cypress-ts
The final application built in the book CCTDD: Cypress Component Test Driven Design
-
InfluxDB
Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
We'll start by examining a Tour of Heroes repo, featured in the book CCTDD: Cypress Component Test Driven Design. This repository demonstrates various test checks, including lint (ESLint), type checks (TS), unit tests (Jest), and Cypress component tests & end-to-end tests. The tests are parallelized to reduce feedback time to approximately five minutes, which is an optimal duration to promote a continuous feedback loop for this size of repo.
This YAML file details the CI implementation, including combined code coverage with CodeCov. For a simpler example without Cypress parallelization and code coverage, check the Github Actions YAML file of this template. The ideas presented here can be applied to any front-end application.
But what happens after the PR is merged? What about continuous deployment? For this, let us examine another UI app which employs Amplify for deployments: Yan Cui's Vue-based Twitter clone. Looking at this repository, we find two YAML files. PR.yml is very similar to our previous Tour of Heroes example, though this application is built with Vue & JavaScript rather than React & TypeScript. Noticeably, it only runs on PRs.
In this section, we will explore the process of implementing Continuous Integration and Continuous Deployment (CI/CD) for a service deployed on AWS. We will be using Yan Cui's AWS AppSync Twitter clone as a sample.
We'll start by examining a Tour of Heroes repo, featured in the book CCTDD: Cypress Component Test Driven Design. This repository demonstrates various test checks, including lint (ESLint), type checks (TS), unit tests (Jest), and Cypress component tests & end-to-end tests. The tests are parallelized to reduce feedback time to approximately five minutes, which is an optimal duration to promote a continuous feedback loop for this size of repo.