-
How to test Svelte components
January 26th, 2020Writing Svelte component tests with the Svelte Testing Library is simple. Let's take a look at the setup to get you started!
-
Print CSS with Angular
January 19th, 2020If you're using Angular, there's a good chance that you're using a component-based architecture. We can use this architecture to our advantage. Instead of creating one big print stylesheet with some selectors, which becomes unmanageable complex when you have to support multiple printable pages. We can move some of the layout back to the components.
-
NgRx creator functions 101
January 13th, 2020The createAction creator function opened opportunities in the NgRx world. With it came two other creator functions, createReducer and createEffect. Let's take a look at what's so special about it and why it's important.
-
Managing different slices of the same NgRx state
January 6th, 2020In this article, we'll iterate over an implementation to introduce multiple independent instances of a NgRx store slice. In an application, these instances can be represented by a tab-like interface. To come to a solution we'll use the Angular Router, NgRx Effects, and NgRx Router Store. We'll also see meta-reducers, helper reducer functions, and smart and dumb components.
-
Google Maps is now an Angular component -Angular In Depth
November 3rd, 2019The Angular Component pearl-lullaby (v9.0.0-rc.0) release introduces the second official @angular/component component, a Google Maps component. In this post, we take a look at getting started with the Google Maps component.
-
Use the new Angular Clipboard CDK to interact with the clipboard -Angular In Depth
October 28th, 2019The new Angular Material release brings us a new CDK clipboard module to interact with the clipboard. In this post, we'll explore how to use the new Clipboard CDK by going over some examples.
-
Reseed your database with Cypress
October 14th, 2019By using a Cypress task it's possible to run code JavaScript code in Node.js. We can leverage this API to reseed a database with data we're in control of. Having control over the data allows us to write specific and isolated scenarios to run tests against.
-
Good testing practices with 🦔 Angular Testing Library -Newline
October 3rd, 2019The Angular Testing Library provides utility functions to interact with Angular components, in the same way as a user would. This brings more maintainability to our tests, gives us more confidence that our component does what it's supposed to do, and it improves the accessibility which is better for our users. All these benefits, plus you'll see that it's fun to write tests in this way.
-
Guarding your Angular modules 💂 -Angular In Depth
September 16th, 2019A lot of Angular modules need to be imported with a static forRoot() function, via this function it allows us to configure the module. But sometimes we make the mistake to use the forRoot function more than once throughout an application. We might not notice it when this happens but often it is the cause of unexpected behavior, which is sadly hard to debug. In this post, we'll look into a solution.
-
A little trick with Angular forms and directives 🃏 -Angular In Depth
July 29th, 2019Imagine having a form that you want to use at multiple places inside your application. The form will have the same layout but the validation will be different. In our case, this form is used in a procedure and in each step of the procedure the form gets more restrictive. Can you keep it DRY? We had this problem and came up with the following solution.
-
My love letter to XState and statecharts ♥
July 8th, 2019I discovered XState a year ago, I already had encountered state machines and statecharts before but I missed the point. Now a year further, I'm here to tell you that these are worth looking into and that XState is a the library to get you started. For me, the most important points to use XState or statecharts would be that it's declarative and explicit, it's hard to create invalid state. The nice extra's that you get with it, is the tooling around it and the portability across frameworks.
-
Don't miss out on css variables
July 1st, 2019At first when I heard of css variables, I was a bit skeptical. Why would anyone use it if there are extension languages as scss, sass, less and stylus. After several years, I stated to notice more and more peoples using it, writing about it and talking about it. I was missing out on something... After a while of using it, I was hooked.
-
Writing a dev.to blog post with VSCode
June 12th, 2019Writing and publishing a dev.to blog post directly within VSCode
-
Reading Code Coverage
June 2nd, 2019An intro to code coverage, how to read it, and how to make use of it in your workflow.
-
Build once deploy to multiple environments 🚀 -Angular In Depth
May 20th, 2019In our quest to build a twelve-factor app where we build once and deploy to multiple environment we encountered some problems, but we managed to solve them. Read here how we did it.
-
Jump start your developer career with these 13 tips -Angular In Depth
May 14th, 2019I believe that to become a better engineer it all comes down to practice, practice and more practice. Especially when you just started your career. The problem is that when you're just getting started, there is much more to it than just writing lines of code.
-
Working with Angular forms in an enterprise environment -Angular In Depth
April 23rd, 2019At our company we struggled with Angular Forms at the start. This is because we dived in head first, without talking about how we would want to use it throughout out projects. This post shows how we're currently using Angular Forms to be more productive.
-
Social media cards with Vue and Gridsome
April 15th, 2019It's easy to create metadata tags with Gridsome, I was so happy with it that I wanted to write this post 😃. There is also a page in the docs on how to create metadata tags, but let's translate the theory into a real world example.
-
Common and easy-to-make mistakes when you’re new to NgRx -Angular In Depth
March 4th, 2019Writing and refactoring FizzBuzz in NgRx with maintainability in mind
-
Bending TSLint to your needs -Angular In Depth
January 10th, 2019Using the power of TSLint in an unconventional way to create rxjs-operator-counter.
-
Keeping browser tabs in sync using localStorage, NgRx, and RxJS -Angular In Depth
December 3rd, 2018We’re going to take a look at how we can keep state in sync when a user has multiple tabs open.
-
Semantically release your Angular library -Angular In Depth
October 22nd, 2018I’m taking you along in my journey towards a fully automated process for releasing a library! Using CircleCI and the semantic-release.
-
Test for accessibility and help millions of people -Angular In Depth
October 11th, 2018Essential tools for maximum accessibility
-
Exploring Drag and Drop with the new Angular Material CDK -Angular In Depth
October 4th, 2018Drag and Drop is a new feature in the new Angular Material CDK. Let’s explore it together!
-
Sharing data between modules is peanuts -Angular In Depth
September 10th, 2018A dive into NgRx selectors
-
Integrate Jest into an Angular application and library -Angular In Depth
August 15th, 2018Follow me in this play-by-play guide and let's integrate Jest within your Angular project!
-
Let's have a chat about Actions and Action Creators within NgRx -Angular In Depth
July 30th, 2018I think it's time you and I talk a bit about action creators. But before we get into action creators let's first start with actions.
-
Start using ngrx/effects for this -Angular In Depth
July 9th, 2018You're probably only using ngrx/effects to handle the communication to an external source by triggering an effect with a NgRx action.
-
How I test my NgRx selectors -Angular In Depth
June 25th, 2018Let us explore which methods I'm using to test my NgRx selectors.
-
Introducing ngx-testing-library
June 18th, 2018An adapter around dom-testing-library to provide lightweight utility functions to test Angular components.
-
Simple state mutations in NGXS with Immer -Angular In Depth
June 7th, 2018A follow-up post of "Clean NgRx reducers using Immer". But this time we're using NGXS as our state management library.
-
Clean NgRx reducers using Immer -Angular In Depth
June 4th, 2018Declutter your reducers with Immer
-
Data synchronization in multiple clients -ITNEXT
May 28th, 2018Often when working with a CRUD heavy application you find yourself or someone else asking the question, what should be done when multiple users are using the same screens at the same time.
-
ng update: the setup
May 21st, 2018Let your library automatically update with ng update
-
Required @Input() properties
May 14th, 2018How to create required input parameters
-
Parameterized selectors -Angular In Depth
May 7th, 2018How can I select an entity from the store by its id?
-
Normalizing state
April 30th, 2018A quick look at state normalization.