Articles, tutorials, and news from the JavaScript universe and the Java universe.
In these uncertain times, it seems prudent to reconsider spending money on American companies. The ongoing tariff fluctuations make it difficult to predict costs, especially for cloud services. Who knows how much your cloud service will cost tomorrow? That's why, effective March 1st, 2025, I've moved this blog away from AWS. It's now hosted on a German server. This change not only saves money but…
(no details available)
If you want to migrate Jasmine tests to Jest, jest-codemods helps you a lot. I used it in a project with more than 200 tests, and it slashed the effort by several days: ```sh npx jest-codemods ``` The tool is going to ask you a few questions. Here are the correct answers for a standard Angular project: ```sh ? Which parser do you want to use? ! TypeScript ? Which test library would you like to…
Using a Jest builder is an attractive option for using Jest in an Angular project. @angular-builders/jest:run is a production-ready solution. The name is a bit cumbersome, so let's call it the "Just Jeb" plugin because the author has published it on his website JustJeb.com . In a few years, we'll probably prefer Angular's native builder, but it's not fit for production yet. I'm covering it here.
The nice thing about Jest is it's easy to get started. However, most tutorials tell you about setting up Jest in a default Angular project. I was interested in using Jest in a monorepo, so I had to research. As far as I can see, there are five roads you can go: Starting with Angular 18 (or even later?), you can use the native support Angular offers . I'm covering this in another article , but as…
Since Angular 16, we've got native support for Jest! It's experimental, but that didn't stop me. I took it for a test ride. TL;DR: Angular's native Jest integration works surprisingly well. However, it's a technology preview, so several limitations stop me from adopting it. For example, it doesn't support multi-projects, and there is no support for Visual Studio Code.
If you're developing a library and an app in a monorepo, the `npm link` is your friend. It allows you to use the library the same way you're using a library you're downloading from npm. But it's more flexible: changes to the library immediately show in the app. TL;DR If you're in a hurry, skip to the "wrapping it up" section or scan this picture.
Let's talk about the new kid on the block. The islands architecture answers the ever-growing challenges of the popular single-page architecture (SPA). Well-written SPA applications offer superior UX. That's why tools like Gmail and Google Maps became popular in the early 2010s.
Recently, I've been trying to find out whether it's legal to use tools like GitHub Copilot or AWS Code Whisperer on my customer's code. To be honest, I still don't know. I expected the answer to be a simple "Yes, you can!" but it doesn't seem that easy. Disclaimer I'm no legal expert. This text is a layman's assessment of a legal issue. Please do not take it at face value. I've written it to…
(no details available)
Twice a year, a new major of Angular ships, and I need to update my Angular projects. More often than not, the automated update doesn't work, so I have to do it manually. In other words, twice a year, I wonder which version of TypeScript is compatible with the new Angular version. Not to mention the versions of node.js, zone.js, and Rx.js. Until recently, I used to create a new sandbox Angular…
After my Javaland 2023 talk about GraalVM , I was asked how to GraalJS on a stock JDK. At first, I was puzzled. It's possible, but it doesn't make sense. Only it does: since Java 15, OpenJDK ships without a JavaScript engine. Yes, you can! GraalJS is available on Maven Central, so nothing stops you from using it:
Adopting server-side rendering pays! Especially if you're running an Angular application on the web. Today, I activated Angular Universal for my blog, and it exceeded my wildest expectations. According to WebPageTest , SSR shaved up to 66% off the rendering time of the first page. That's what counts if you're into SEO. Google rewards fast websites, and it cares mostly about first contact. Once…
Some time ago, I noticed many developers confuse value types and records. Admittedly, that happens to me all the time, too, but these two concepts are fundamentally different. The term "value record" adds to the confusion. Plus, it seems the idea has evolved quite a bit since 2017, when I first heard about it . So I invite you to join my deep dive. In a nutshell Java records are syntaxtic sugar.…
My PDF viewer has been downloaded almost two million times in 2022! When I started the project in April 2018, I suspected there was a market niche to fill, but I never expected it to be so big. 1,946,858 downloads between 01.01.2022 and 31.12.2022 are 1,946,858 signs of trust. Here's a screenshot from npmtrends.com :
After almost ten years, I've made up my mind to leave Twitter. I won't delete my account because I hope Twitter becomes a friendly place again, as it was in the early days.
That's the wrong question. You shouldn't use either of them. Granted, that's probably not the answer you expected, so let me explain. Like so often, I don't insist on being right. Quite the contrary, I'm looking forward to heated and fruitful discussions. I want to make you think. But I guess I can convince you!
I didn't expect it to be so easy! The internet has many tutorials covering how to deploy Spring Boot on Fargate, and they all have one thing in common: they consist of many screenshots. You can follow their recipes step-by-step, but it doesn't seem trivial. AWS CDK takes the sting out of it. Look:
My crusade for simplicity goes on. This time, I've run into another trivial and useless mapping. The controller mapped snake_case parameters to camelCase like so: ```java @GetMapping("/employee") @ResponseStatus(HttpStatus.OK) public EmployeeDto findByName( @RequestParam("first_name") String firstName, @RequestParam("last_name") String lastName) { return…
The hours of Protractor are numbered: The Angular team has announced to stop development by the end of the year. So I started looking for alternatives and found Playwright.
Async/await simplifies your JavaScript code tremendously. But what if you're stuck with an old API using callbacks? You can easily convert it to modern JavaScript with a few lines of code. This option comes in particularly handy with PrimeNG dialogs. Their callback API is annoying because a modal dialog is just that: it's a blocking dialog. You want to wait until the user reacts, and in the…
MapStruct takes the sting out of mapping entities to DTOs, and Java records make for elegant DTOs. Add Lombok to the equation, and you end up with almost pure data classes and very little boilerplate code. Don't take my word for it. I can prove it. Have a look at GitHub repository to see how simple a Spring Boot application can be.
Two opposite trends dominate the Java world. Frameworks and infrastructure become simpler over time, but the average application becomes more clumsy and convoluted. When I enter a new project, I need more and more time to get to speed. It's not just my age or the demanding business use cases. My impression is the source code is more complex than it needs to be. When I talk to Java developers, I…
Angular 14 ships with typed reactive forms, and it's just great. Type inference, backward compatibility, fine-tuning options, and user-defined type definitions - it's all there. It's been a long wait, but it was worth it!
AWS can be overwhelming. Such a vast ecosystem, so many options, and so many configuration dialogs. But at least there is a UI giving you a search function and some guidance. It's just that nobody wants to use the UI in the age of DevOps, and it's out of fashion for a good reason. Modern programmers embrace the infrastructure as a code pattern, using nice and clean source code written in a…
Every once in a while, your boss asks you to check the licenses of your project. I've good good news for you: it's easy. Most popular open-source projects care about licensing, so you're probably already safe by looking at the licenses of the libraries you're using. But that's nothing you can rely on. Better check the transitive licenses yourself. That's a matter of minutes - at least if you've…
We've seen way too many attacks to IT systems over the last years. That's a flourishing industry run by criminals. That, in itself, is already worrying. It is a major threat to our lives. Literally. Granted, most hacker attacks are less dramatic, but there are many ruthless hacker attacks endangering lives. It's no fun when hospitals have to be closed for weeks or months, leaving their patients to…
Everybody and their grandma agree on 'Mobile First!', but we still develop on a laptop or desktop PC. Frequently, it's cumbersome to attach a mobile and debug remotely, and most of the time, it's not even necessary. Modern browsers allow you to emulate a wide variety of mobile devices. However, touch gestures seem to be ill-supported. I've found many helpful pages like…
How do you know if your code is running in a Service Worker thread or not? Can you use the global namespace for Service Workers the way you're using the global window namespace in UI threads? Is there a unified global namespace?
Let's collect some best practices for implementing reactive forms in Angular applications. Today I'll focus on chains of dependencies. If a FormControl controls another FormControl , which, in turn, controls a third FormControl , things quickly become messy. That's a pretty common scenario. So let's look at how to do it wrong and do it better. I'm pretty convinced talking about bad implementations…
You're stuck with an abandoned npm library? Most of the time, you can fix the problem yourself, at least for a while. I'll show you how to do that: My fork of ng2-smart-table uses the tool patch-package to keep the library alive with Angular 13. BTW, if you're in a hurry, scroll right down to the walk-through .
Never use .constructor.name in production code unless you like working long hours! I know from experience because that's what we did the other day. But wait - are you already familiar with the constructor.name idiom? It's tremendously useful. I'm using it almost every day for debugging.
Angular developers love change detection. You never have to care about it. It just works. Only sometimes it doesn't. When it fails, StackOverflow has many weird answers (among many good ones), so I often observe programmers following one cargo cult or another. I hate to admit it, but that includes even me, despite being a long-term Angular teacher. When I researched the article, I found out I got…
Many people ask me which Angular plugins I'm using. So here's my list. Most of these plugins are part of John Papa's Angular Essentials, the Angular Productivity Pack, and the TypeScript Extension Pack. You only need to install these plugins individually if you've behind a restrictive Firewall which doesn't allow you to install plugins from Visual Studio Code.
Sometimes one of your Angular services manipulates the DOM tree. That's an exotic use case, but PrimeNG puts that idea to good use. Remains the question of how to test such a service automatedly.
Most Angular services store data, implement a few calculations or validations and deal with the backend. For example, many Angular services are a queer variation of the backend-for-frontend pattern. They condense the data sent from the backend to match the requirements of the frontend. In an ideal world, you convince your backend team to implement this conversion in the backend - that's the…
There are two ways to test an Angular service. Either you test it as a regular class. Or you use the entire machinery of Angular. If you do the latter, ng-mocks is your friend.
Dealing with null and undefined is always fun in JavaScript. It really is, once you've got the knack of it. Until then, it's a nightmare. Understanding the difference between null and undefined seems to be the initiation rite of the JavaScript tribe. So be it. Let me be your priest guiding you through your initiation!
Jest is fast, powerful, popular, and it uses a different approach to Mocks and Spies than Jasmine. Let's have a look at how to do it. Spoiler: you'll want to use ng-mocks. It's a significant productivity boost, no matter if you're using Jest or if you stick to Jasmine and Karma. But let's have a look at the basics first.
The best architecture for an Angular app is not having an architecture. No, I'm not preaching chaos. There's nothing wrong with clean folder structure, loose coupling, and all the other architectural trivia we all know and love. But beyond that? Keep it simple. Let's put it bluntly: when you feel you need to implement an architecture, you're probably already deep on your road to hell.
The Jest plugin for VS Code is a bit shy. By default, it hides most of its helpful features. Here's how to unlock its power.
We've just converted an Angular project to Jest, and we love it. It takes half an hour to get everything up and running. You're rewarded with faster tests and the power of one of the leading test frameworks. Plus, you get rid of the browser. You don't have to install Chrome on your CI server. Even on your local developer PC, that's a big plus. Jest uses jsdom to simulate a browser. So you get rid…
Reactive programming is a lot harder than traditional, linear programming. Each time my Angular training progresses to the RxJS chapter, I'm looking into blank faces. What's all this fuzz about RxJS? It's confusing if you're coming from an older community, such as the Java world. Why bothering with callback methods, asynchronous code execution, and unfamiliar RxJS operators? Most learners get it…
Asynchronous programming is hard. Evolution gifted us with a marvelous brain capable of doing many things, but asynchronous and concurrent processes weren't top on the list. We can do it, but only to a certain degree. You should do everything to keep it simple. The async-await pattern is a marvelous tool to reduce complexity. But what does Angular do? Several years ago, Angular replaced the…
Angular 12 uses the production build by default. That doesn't mean the development build is gone - but if you don't update your project correctly, you'll end up without development build. Here's how to fix your project again.
npm has a clever approach to dealing with transitive dependencies. Cutting a long story short: it does the exact opposite of what Maven does. npm trades a waste of memory for a lot of headaches. I've seen worse trade-offs! I've written a small application to demonstrate the features. It uses three different versions of the same library simultaneously. At first glance, that's scary because it means…
(no details available)
We're living in crazy times. Nowadays, it's possible to run Linux applications on Windows. But when you add Docker to the equation, many people run into trouble with the local networks. Either they can access the server running in Docker, or the Docker container can't access a server running on Windows or WSL2. The latter proved to be a challenging problem. In a standard Linux installation, you…
Once upon a time, you could use Java without installing it. Nowadays, most operating systems make a developer's life difficult by trying to help. That's not a big deal if you need only one version of Java. However, if you need to switch between different versions, it doesn't suffice to set the environment variables PATH and JAVA_HOME . Here's what you need to do.