What Are We Testing?

Jest snapshot testing is primarily used for testing the rendered output of React components.

The rendered output is ultimately the element(s) that render in the DOM:

Kent C. Dodd’s AHA Programming Talk at React Summit Remote Edition

Often when writing or reviewing code, developers have a natural tendency to create an abstraction that avoids duplication upfront but evolves into a hairy situation as new use cases come. Kent C. Dodds in his recent talk at React Summit summarizes, demystifies, and visualizes this problem as well as a solution.

Are you the kind of programmer who prefers to never see the same code in two places, or do you make liberal use of copy/paste? Many developers swear by the Don’t Repeat Yourself (DRY) philosophy while others prefer to Write Everything Twice (WET). But which of these produces…

In the previous article, I walked through creating a basic SVG. In this article, I will pick up where we left off and explore SVG animations.

Whereas bitmap/raster graphics are composed of individual pixels, vector graphics are composed of individual shapes.

This provides for the ability for vector graphics to scale without loss of quality as they can render clearly at any resolution.

There is another benefit, however, to SVGs being composed of individual shapes. Each shape can be styled as we desire.

Since each shape in a SVG can be styled, this gives us the ability to create animated…

In this article, I explain what is a scalable vector graphic (SVG) and how it differs from other graphics. I will also walk you through coding your very first graphic!

A Primer on Computer Graphics

Table of Contents

Chapter 1 | Why Bother?
Chapter 2 | Learning the Basics of Elixir
Chapter 3 | Introduction to Phoenix
Chapter 4 | Implementing React
Chapter 5 | Working With PostgreSQL
Chapter 6 | Creating a PostgreSQL API Service
Chapter 7 | CRUD Operations
Chapter 8 | User Authentication
Chapter 9 | Channels

In just 9 chapters, we’ve learned the fundamentals of full-stack web development using Phoenix on the backend and React on the frontend. You should have enough knowledge to create your own full-stack apps and dive deeper into Phoenix and Elixir. …

Table of Contents

Chapter 1 | Why Bother?
Chapter 2 | Learning the Basics of Elixir
Chapter 3 | Introduction to Phoenix
Chapter 4 | Implementing React
Chapter 5 | Working With PostgreSQL
Chapter 6 | Creating a PostgreSQL API Service
Chapter 7 | CRUD Operations
Chapter 8 | User Authentication

What Are Channels?

Table of Contents

Chapter 1 | Why Bother?
Chapter 2 | Learning the Basics of Elixir
Chapter 3 | Introduction to Phoenix
Chapter 4 | Implementing React
Chapter 5 | Working With PostgreSQL
Chapter 6 | Creating a PostgreSQL API Service
Chapter 7 | CRUD Operations

Scope of This Chapter

In the previous chapter, we were able to create an API service with Phoenix. This is at the heart of full-stack development. However, we didn’t cover the critical use case of doing user authentication. We will be doing another mini-project so cover how to do this.

Getting Started

While I could just provide a template, let’s walk through the…

Table of Contents

Chapter 1 | Why Bother?
Chapter 2 | Learning the Basics of Elixir
Chapter 3 | Introduction to Phoenix
Chapter 4 | Implementing React
Chapter 5 | Working With PostgreSQL
Chapter 6 | Creating a PostgreSQL API Service

Scope of This Chapter

In the previous chapter, we were able to start the process of programmatically creating a PostgreSQL API service.

So far, we have things working so a GET request on /users returns a JSON object containing all the rows in our blogs table in our database. …