Without Marbles

Person using a laptop

Note: If you haven’t read this article yet, start there.

Writing Unit Tests Sucks

Yeah, I said it. I don’t care who I offend either. Writing unit tests sucks. That being said, I will also say that unit tests are essential. Both things can be true.

If you have any full-stack developers on your team who write unit tests for your front-end app you may have already heard things like:

Wow, this is so much more complicated than writing unit tests on the back-end!

As a front-end developer, this is a pretty disappointing statement. However, I want to try to share some…


Why Is Learning State Management So Hard?

Woman holding the NgRx logo

Why Is NgRx So Hard?

When I was first learning NgRx, I struggled. A lot. There were simply too many new concepts to learn and not a lot of good training materials at the time. The official docs didn’t even exist back then!

Now I use tools like NgRx every day to build Angular applications. I have learned several things along the way getting to this point and I want to help other developers who may be having the same struggles I did. I want to create the tutorial I wish I would have had when I first started.

In order to do that, I…


Chalkboard Planning Diagram

Learn The Why Before The How

There are several different resources out there about how to test NgRx applications but I think there is a lack of resources talking about what to test and why. So, I thought I would add my musings about NgRx testing to help fill that gap. I will also use this as a reference for myself and will update it as I learn new things!

This will be theory only for now. I may add code examples in the future but, I think it’s important to think about things without code sometimes. Let’s get started!

General Unit Testing Theory


How do you eat an elephant?

Disclaimer

If you’re not familiar with modern state management tools this article will probably not be the best place to start. This article assumes that you have done your research on both NGRX and NGXS and are just looking for a guide to migrate things over. I will mention comparison points when relevant, but that is not the purpose of this guide. So, with that disclaimer out of the way, let’s begin!

In order to understand what work will need to be done to migrate from one library to another it may be helpful to…


Using HTMLElement

The Goal

In this example I wanted to show you how you can dive down into the DOM to find elements in your Angular templates. This can be used to make sure your Angular directives are working properly when writing tests. In order to do this we’ll be tapping into the power of the HTMLElement API. This will make it possible to manipulate and read properties of elements in our component’s HTML template.

* NOTE: This article is not meant to be a full scale tutorial on how to do testing in Angular . …


Puppets

Using Headless Browsers To Surf The Web

Today we’re going to be building an app that will scrape two websites for anything that matches a certain keyword. The two websites will be Medium.com and YouTube.com. Here we’ll be looking for article or video that contains the words “Headless Browser”. The hope is that the resulting list of resources will help us expand our knowledge on this topic.

In this project we’ll be using the following technologies:

Node will be the environment that’s used to run our code. Express will be used to run the…


When A Normal Form Won’t Cut It.

When you think about it, most apps are just forms. Lots and lots of forms. Sometimes those forms need to contain a lot of data. Some even need to be… *gulp*… dynamic. Meaning that the structure of the form can change depending on the user. The server will never know exactly what it’s getting. When this is the case you might need to tap into the power of nested forms. That’s exactly what I’m going to cover here.

Let’s go over our goals.

By the end of this article we want to have a “parent” form that will contain an…


Computer Code

One Man’s Epic Journey Across The Angular Landscape.

There are an enormous amount of things available to developers in the Angular framework. Some of them are used daily, and some never. As part of my ongoing journey to discover all that Angular has to offer, I occasionally like to explore some of the more seldom seen features. Today, we dig into <ng-content></ng-content>.

One of the main goals of Angular is to help the developer create reusable and composable components. I think ng-content is one of the simplest ways to do that once you understand how it works.

Dynamic content. That is the simplest way to explain what ng-content…


Children jumping

Forms are pretty much always harder than they look. Especially in today’s complex web experience. There are several different types of forms with lots of interaction that takes place behind the scenes. User logins, shopping carts, and social media profiles just to name a few. I wanted to demonstrate how to achieve a specific scenario that might not be as straight forward with Angular forms. Using child components.

There are two types of forms in Angular. Template-driven and Model-driven aka “reactive” forms. Template-driven forms are more basic and feel like a carry over from the Angular JS days. Reactive forms…


For those of you who haven’t been fortunate enough to go to NG-Conf, I highly recommend you try to make it happen. If you’re interested in Angular you should be here. If you use Angular at work you should definitely be here. I wanted to give a summary of my experience at my first NG-Conf.

TL;DR:
- NG-Conf is amazing.
- The speakers are really approachable.
- Angular 6 is going to be awesome.
- Stackblitz is super cool.
- NgRx is everything right now. (Also checkout NgXs)
- All your web apps should be PWAs.

First things first, the…

Josh Hicks

Software engineer, writer, traveler, weight lifter

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store