npm doesn’t like to be fenced in by a corporate firewall. Too bad most npm installations live precisely there. The other day, I ran an
npm install on the customer’s PC. The same command that finishes in 40 seconds on my machine took roughly a quarter of an hour. Plus several hours of troubleshooting. It was a Deja-Vue experience to me, having lived this nightmare several times before, so it’s high time to collect a short list of hints. BTW, if you want to contribute to this list of life-savers, please do so. Just leave a comment, thus giving me an opportunity to include it to the list.
These two settings almost always do the trick:
npm config set https-proxy http://username:email@example.com:8080
npm config set proxy http://username:firstname.lastname@example.org:8080
Isn’t it funny that I start writing a series of articles about Java 8 Lambdas in 2018? Mind you: my first article dates back to April 2012, six years ago. I fell in love with functional programming even earlier. I suppose it was roughly in 2008, ten years ago. From this perspective, functional programming is nothing new to me. I’m using it on a daily basis when I’m writing TypeScript code.
As things go, I work in a very conservative environment, so I know a lot of projects that have adopted Java 8 last year. And I’m bewildered what programmers make of it – and why. It’s high time for a reality check. Java’s Lambdas and method handles are great, no doubt about that. Streams are great, too. Sometimes.
More often than you might think, they are not.
Functional programming is en vogue. There are many good reasons to adopt functional programming. Recently, I watch more and more Java programmers using the new programming style. As things go, they experiment and play with their new toy, pushing it to the limits. This article briefly shows why Lambdas are useful, what Java programmers make of it, and concludes with a few recommendations to do it right.
Spectre and Meltdown came as a shock. They showed that low-level CPU optimizations have an impact on our lives. Plus, they proved an illusion of most programmers wrong. Yes, you’re using a high-level language. But that doesn’t mean all those abstraction layers shield you completely from the CPU. I’ve demonstrated the effect of the CPU cache on a Java program some time ago.
The link between my click-bait introduction and the topic of the day is the RAM of your PC. CPUs have evolved much faster than main memory. Nowadays, CPUs spend most of their time waiting. A modern CPU can perform several instructions per CPU cycle. But if it has to access main memory, bypassing each of the three caches, it has to wait for roughly a hundred cycles. See this article on Extremetech.com for more details.
They announced Vue.js to me saying “It’s like Angular, only they did it right this time”. I don’t think there’s anything wrong with Angular, so my curiosity was piqued, and the stakes were high. What does Vue.js better than Angular? So I spend two afternoons playing around with Vue.js.
Before starting to dig into the source code, let me share my first impressions with you. Vue.js is fast, it’s simple, and it’s easy to find info on the internet. I also felt that the error messages could be better, but then, that’s a typical beginner’s problem. In the early days, the error messages of Angular weren’t helpful at all. Vue.js is younger than Angular, so I guess they’ve done a good job here, too.
There were two pleasant surprises I didn’t expect. First, there’s a small but useful ecosystem. There’s tool support, there’s a small CLI to get started, and there’s even a browser plugin to help you debugging.
Second, there’s decent TypeScript support. At first glance, the source code seems to benefit a lot from the syntactical sugar of TypeScript. I always thought Vue.js was meant to be the successor of AngularJS, founded and supported by developers who didn’t accept the design choice of Angular 2. And one of the key choices was to embrace TypeScript. So TypeScript support comes as a surprise.
Before anybody starts a useless flame-war again, let’s have a look at the scope of Vue.js. It covers a rather limited scope. It supports the “V” of MVC. Everything else is up to you. Most people opt for third-party libraries. Some of these libraries (Vuex, the router, the CLI, and –
until recently – vue-resources) are maintained by the Vue.js team, so the scope of Vue.js is slightly larger than the scope of React.js, but even so, these libraries are optional.
By the way, if you’re already familiar with the migration guide from an alpha version of Bootstrap 4, read it again. The Bootstrap team has made a couple of last-minute changes.
After a long search, I’ve finally found two good libraries bringing the design language of Material Design to Bootstrap. Actually, I’ve seen similar attempts before. Just think of the Paper theme bundled with BootsFaces. It’s not bad, but I wasn’t too excited when I saw it. I didn’t run a comprehensive test yet, but at first glance, the libraries I present today match my idea of Material Design better. Please take that with a grain of salt: beauty lies in the eye of the beholder, so that’s just my personal opinion.
We start the new year with a new version of BootsFaces! BootsFaces 1.2.0 brings a few new features, a lot of bugfixes, and an improved navigation on the documentation page.
Gone are the days of customizing Bootstrap with the sweat of your brow. At least if you’re using a current version of Angular and Bootstrap 4. Mind you: Bootstrap 4 is built with SASS. Angular supports SASS as a first-class citizen. So it’s hardly surprising that it’s a child’s game to customize Bootstrap with an Angular application.
Basically, you have to follow these four steps:
That’s it! Now you can customize Bootstrap by editing the
The Angular Animations API adds a shallow abstraction layer to the animations offered by CSS. It’s a bit like so many other Angular libraries: it adds enough syntactic sugar to make it useful, but it adds little value to the underlying technology.
At least, that was my first impression. During my research for this article, I’ve learned that such a shallow abstraction layer make a lot of sense. For instance, the same API could be used with AngularNative. As far as I know (correct me if I’m wrong!), that’s not the case today, but who knows what the future has in store for us.
’nuff said. Let’s get our feet wet with real source code. Have you ever seen at the back-side of your application? This demo doesn’t work with Internet Explorer because I wanted to keep the source code of the demo simple, so please use another browser to see the animation:
Today’s tech tip is almost too primitive to mention. However, on second glance, it shows how to use Angular efficiently. I reckon there’s a general pattern there, even if I haven’t been able to distill it yet to make it a textbook lesson.
Consider a carousel, such as the first demo at our BootsFaces showcase. It displays three images. At every point in time, only one of the three images is shown, unless you click to show the next image. In that case, the next image starts to slide into view, replacing the old image.
Things get ugly if we’ve got hundreds of images. They also get ugly if the carousel is used to implement a wizard. Chances are that the content of the second page of the wizard depends on the input provided on the first page of the wizard. In other words, the second page can’t be rendered at load time. As you can imagine, our use case was a combination of these two options.
The other day, I was asked to compare frameworks like Angular and React.js. It was an interview, so I didn’t notice the tiny slip. Developers reading the interview didn’t hesitate to point out that React is a library, not a framework. A few months earlier other developers reminded me you can’t compare Angular with React because the former is a framework, while the latter is not.
The reactions of the community where so emotional that I gather many people consider it an important difference. That, in turn, means it’s fun to play devil’s advocate. It’s the kind of games generating new insights.
Image source: PixabayThe age of a programming language shows in the clever tricks programmers use. One such trick is used by CDI. Did you ever wonder why you have to put an empty
beans.xml into the
By the way, you may not even aware that the
beans.xml is allowed to be empty. Many developers aren’t. You can use the
beans.xml to configure a couple of things, leading developers to believe they have to do that. Plus, the IDEs tend to complain about an empty XML file because they consider it ill-formed. As far as I know, Netbeans generates a non-empty
beans.xml by default. But still, even if you haven’t seen it yet, it’s allowed to put an empty
beans.xml into the
META-INF folder of your jar (or the
WEB-INF folder of your *.war file). Empty meaning really empty: it’s a file of zero bytes length.
What good is such a weird file?
We’ll answer this question in a minute. Plus, this article shows you how to read arbitrary files hidden in a jar file, or – more generally speaking – somewhere in the classpath. By the way, this is one of the few situations when the Junit test succeeds but the real application fails. That is interesting enough in itself.
Truth to tell, we can’t answer the question. Actually, it’s the wrong question, anyway. The real question is “Which one is better for my project?”
Because that’s what we found out during our investigation: During the last couple of years, Angular and React have learned a lot from each other. Each team is watching the progress of the other team. Good ideas tend to be adopted by the other team after a while, provided they match the general philosophy of the framework.
So we came to believe you can do anything with either framework. We’ve collected a couple of technical criteria helping you choose the right tool for the job. But you should base your decision on technical considerations alone.
Recently, I’ve been working with a project team embracing code reviews. The experience wasn’t pleasant. Most of the time, it was downright annoying.
The general idea of code reviews is that one of your team members dedicates several hours of their precious time to look at your code and help you to improve it. That’s a generous offer. Plus, hardly anybody rejects an opportunity to learn and improve their coding style. I, for one, definitely don’t. So how come the code reviews were such a pain in the ass?
Earlier this day, a developer opened a bug ticket for BootsFaces.
<b:panelGrid />, they said, is buggy. Adding a comment between the columns corrupts the layout, they said.
Actually, that’s true, but I wouldn’t call it a bug of BootsFaces. It’s a peculiarity of JSF. We could solve it in BootsFaces. At least, most of the time. I’m sure there are corner cases we’ll always miss unless we start to parse the code as thoroughly as a compiler. That’s possible, but it doesn’t match the general idea of JSF. Even worse, we can only solve the bug for BootsFaces components. It still exists for standard JSF, PrimeFaces, ButterFaces, and every other JSF framework you combine with BootsFaces. So I prefer to explain the bug instead of solving it.
At first glance, there are many similarities between Angular and JSF. Both offer a decent abstraction layer from the DOM, both offer two-way binding (yes, I know it’s optional since Angular2), and both use components as building blocks of the application. Even better, both frameworks offer a way to create your own custom components. The difference is that hardly anybody creates custom components in JSF. Angular programmers do it all the time.
Things get even more mysterious when you learn that JSF has been designed with creating components in mind. It should be easy. But the vast majority of developers doesn’t think so.
Angular takes components to a whole new level. When AngularJS 1.0 was released seven years ago (on Oct 20, 2010), that was a revolution. Developers used components all the time, no matter which framework they used. Everybody knew it’s a good idea to download or buy a powerful third-party framework. The idea was that powerful components like datatables or charts should be developed by experts.
AngularJS and its predecessors changed all that. They made the process of creating components much more democratic. They enabled everybody to create their own component. React and Angular 2+ go one step further down that road. They force every developer to write their own components. The entire program is built on custom components. There’s no way to avoid custom components.
Have you ever had the opportunity to work on a factory automation project? Currently, I’ve got the opportunity to program software controlling real hardware in an assembly line. My program influences real machines in the real world. Most of the software I’m writing remains in cyberspace, so I consider “getting real” pretty exciting.
One of the key requirements of our project is that we have to use the Modbus protocol. That’s an old protocol dating back to the 80s. Even so, I wasn’t happy with the documentation. One might expect such an old, battle-tested protocol to be thoroughly documented. Well, it is, in a sense. The only problem being that most of it has been written for experts. So I decided to write a cursory introduction for the hurried Java developer. After reading it, you should be able to understand the expert documentation. Along the way, you’ll learn something about the IoT world the media keep raving about. If you’re only interested in Modbus, just scroll to the PLC section.
Infer is a static code analysis tool promising finding many bugs that escape the attention of many other tools. My curiosity was piqued. The result was underwhelming: Infer found four possible
NullPointerExceptions in the source code of BootsFaces. Later I ran SonarQube. It found many other potential
NullPointerExceptions. Any in both cases, half of the findings where false positives.
Since version 2.0, TypeScript has a built-in NPE finder. It works very well. Of course, it sometimes finds false positives, too. But if you activate the compiler switch
--strictNullChecks from day one, that’s not a big problem because you notice the problem while you’re writing the code. You can tell the compiler to ignore the non-bug in a couple of seconds.
TypeScript 2.5 is there! That’s the headline of the tweet sending me to the TypeScript 2.5 announcment. To my surprise, the article described a new refactoring of Visual Studio Code. Did they choose the wrong title? Is this article really about TypeScript, or is it about an IDE?
As it turns out, refactoring is baked into the programming language. In former times, refactoring used to be what IDEs do. Nowadays, refactoring is a compiler feature. At least in the case of .NET languages and TypeScript.