BootsFaces 1.1.2 is chiefly a maintenance release. But as usual, there are also a couple of improvements.
BootsFaces 1.1.2 is chiefly a maintenance release. But as usual, there are also a couple of improvements.
In the previous parts of this series, we’ve learned how to work with data loaded asynchronously. Now let’s have a look at some of the advanced use cases. How can we combine multiple REST calls if we need the result of both to start working?
Let’s continue our address example. Let’s assume we want to send a letter to a customer. To send the letter, we need two chunks of data: the content of the letter itself, and the address we want to print on the envelope. We can’t send the letter until we’ve received the response of both REST calls.
In the first part of this series, we’ve seen how to call a REST service and how to display the result asynchronously. Now we’re going one step further. How to work with data that isn’t really there, but can only be observed as a volatile stream of data events? Because that’s what an
Observable is. Reactive programming is stream processing, and the strictest form of reactive programming uses
Observables without memory.
Web applications benefit a lot from reactive programming. The application reacts immediately when the user clicks, even if it takes a couple of second to load the data. In the early days, applications used to stall at this point. The computer froze, and you couldn’t say whether it had crashed or not. So developers invented the progress bar. That’s still freezing but in a more entertaining way.
Modern web applications do a lot better. They show the next page immediately, filling in data a bit later. That approach has many advantages. It gives the user immediate feedback. You can also load the top-most data first and load less often used data later. In most cases, this even means the user can continue their work earlier.
Let’s have a look how to do this with Angular. Reactive programming isn’t difficult, but if you’re not used to it, you have to learn to think outside the box.
The other day, a co-worker and I held a talk at the Java Forum Stuttgart. Our topic was the UI techradar we’re currently developing. So much of the talk was devoted to comparing UI frameworks, raving about Angular, about the advantages of programming your smartphone natively in ObjectiveC, and why it’s still a good idea to stick to Java and JSF.
All of a sudden one of the attendees asked a question I wasn’t prepared for. It was a good question, but I didn’t take it as seriously as it deserved. Even worse, I laughed it off. That’s something you must never do. When I noticed my mistake, it was too late to correct it. So I decided to blog about it. It’s a late answer, and I don’t know if it’s ever going to be read by the guy asking the question, but here it is.
The question was:
Angular and React may be great. But do you really expect everybody who’s crossed the 35 years mark to learn a new programming language each year, just to use the UI framework of the week?
Before you ask, I don’t think anything’s wrong with object-oriented programming. But recently I’ve attended an interesting talk at the JAX conference. By the look of it, the speaker, Manuel Mauky, wasn’t happy with object-oriented programming. Instead, he propagated functional programming and Redux.
While I don’t agree with him, I considered his reasoning compelling. I’ll try to summarize it as best as I can.
By definition, object-oriented programming means to combine data with algorithms. To me, this always seemed to be natural. After all, data is meaningless until you know what to do with it. From this point of view, objects join two concepts that belong naturally together.
Manuel tackles things from a different angle. He doesn’t believe that data and behavior belong together. He’s pretty much convinced that the application state should be separate from the functions defining the behavior of the application. We’ll see that this approach has many advantages.
I guess you all know the situation. One day or another, you realize that you’ve got more work than you can manage. So your boss adds a new team member to your team. It goes without saying that you embrace them full-heartedly and teach them their new job with all the respect and empathy they deserve. In virtually no time, they are just as productive as everyone else, and they become a valuable part of your team.
It’s the “or not” part this article is about. As to my experience, many people are badly prepared for onboarding new team member. Software developers are no exception. Quite the contrary: many software developers are more interested in tech than in people, which doesn’t help to embrace new team members.
Putting it in a nutshell, the new version of BootsFaces doesn’t bring you new features. Instead, it focuses on quality and compliance with the HTML code recommended by the Bootstrap team. There’s only one new component, a few more concepts, but more than a hundred bug fixes. Granted, several of these bug fixes solve bugs introduced during the development of BootsFaces 1.1.0 itself, but even so, it’s an enormous progress. Since BootsFaces 1.0.2, we’ve committed to the core library more than 200 times, not to mention the commits to the showcase project. As it turns out, even a version introducing a single new component can be a major release.
Update May 02, 2017: Typo gremlin
Despite several weeks of testing, our good old friend, the typo gremlin, has sneaked into BootsFaces 1.1.0 again. This time,
<b:form /> and the
<b:growl /> are affected. We’ll publish version 1.1.1 soon, probably already this week-end.
The next version of BootsFaces was scheduled to be published during the Easter holidays. However, we decided to spend a few extra weeks to improve the quality of the documentation of the framework. When testing the showcase, we observed that it is a bit confusing because many examples use old API fallen out of grace during the last couple of updates.
The advantage for you is that you can test the release candidate and report bugs you’ve found. We believe that the release candidate is stable enough to publish it as the final version. Nonetheless, the delay is an opportunity to fix bugs that may have slipped our tests.
It’s a bit surprising that there so many libraries offering internationalization for Angular applications. It’s surprising because there the Angular cookbook describes a well-thought approach to internationalization. Unfortunately, ng-xi18n was broken last time I checked, so let’s explore another library today. ngx-translate is a simple but useful library for supporting multiple languages. The companion library ngx-translate-extract makes working with ngx-translate even easier by extracting texts to be translated automatically.
Update Nov 18, 2017:
Luckily, the official Angular i18n approach has been fixed since I’ve written the original version of this article. Even better, it’s part of the Angular CLI. See the documentation of xi18n for full details. Nonetheless, ngx-translate is still interesting. It’s a lightweight alternative. Plus, it translates the application at runtime. In contrast, x18n forces you to provide a pre-compiled application for each language. That’s better because it’s faster, but it’s also a bad thing because you can’t switch between languages without starting the application from scratch.
What’s the difference between ng-xi18n and ngx-translate?
Talking of ng-xi18n: there’s a big difference to ngx-translate. ng-xi18n has been developed with professional translators in mind. In particular, this library uses the well-known XLIFF standard. Developers probably tend to think this standard is clumsy. It’s XML, and it’s sort of bloated. ngx-translate, in contrast, uses slime Json file to map one language to another. The backside being it supports fewer use-cases than XLIFF.
Angular has been designed with testing and mocking in mind. This includes mocking HTTP services in general, and mocking REST services in particular. The Angular team even provides a fairly generic mock HTTP service. That service is a horn of plenty of good ideas. The only problem is the limited scope of the solution. It’s meant to serve the needs of the documentation of Angular. The team even promises that the service may break at any point in time.
In other words: it pays to implement your own generic mock HTTP service. That’s what we’ll do today.
To my disappointment, I didn’t find a clear answer by researching the internet or by asking the question on Twitter. So I’ve started to gather information myself. That wasn’t easy, so most of the article is based on indirect hints and educated guesses.
This is a topic I consider important enough to abandon the “non-commercial-only” policy of BeyondJava.net. I hardly ever quote from or link to professional web pages unless they are so ubiquitous you can’t avoid them or there’s a good reason to do so. Web security definitely is one of the best reasons. Today, Wordfence – a professional company providing a popular WordPress security plugin – has published an interesting blog post about the green “secure” bar in your browser’s URL.
Secure vs. safe
Cutting a long story short, “secure” doesn’t mean the same as “safe”. That’s particularly annoying for Spanish and German users because these languages don’t distinguish between secure and safe. (Chances are that this holds true for many, if not most, other languages, too). Users read a green “secure” in the address bar and feel “safe”.
But in reality “secure” means that the connection between the client and the server is secure. That’s great. It means that nobody can intercept the messages and manipulate them. But that’s all it means. It does not prevent the server from being malicious.
Revoking security certificates
The good news is that when a malicious website is discovered, the certificate guaranteeing the security of the connection usually is revoked, and the server is added to a blacklist. But that takes time, and it’s not guaranteed it’ll ever happen for a particular malicious website. Plus, Wordfence reports that the revocation of a certificate does not or not always result in a red address bar. You can see the revocation, but this information is buried in the developer tools. In other words, it’s invisible to most casual users.
It’s a good thing that Google has added the “secure” and “insecure” bars to the browser’s address bar, but that doesn’t mean you don’t have to be careful. Keep looking at the address bar. Keep looking for anomalies. Nowadays, fake URLs are increasingly clever, but even so, you can spot most of them if you’re alert. The Wordfence blog covers the topic in much more detail and has a few interesting examples of fake URLs.
It’s astonishing how simple writing web components is with Angular. In a way, this shouldn’t be a surprise: components are the building blocks of every Angular application. However, last week we wrote a component I already knew to be difficult to implement in merely an hour or two. That was really a surprise.
Our choice was a multiple-choice select box. There are plenty finished components out there. However, Angular 2+ is still young, so there are few (if any) native Angular multiple-choice boxes we can use. Integrating a component based on other technologies like jQuery is possible, but usually, it takes some time and it’s always a compromise. So I reluctantly agreed when my coworker suggested to quickly write our own component. “It’s simple”, he said. “It ain’t much work”. It’s true. It wasn’t.
Another approach is putting foreign objects into an SVG and to draw that SVG image into an HTML5 canvas. The
foreignObject is currently only partially supported by most browsers, but even so it seems to do the trick for many common usecases.
It always pays to listen to Uncle Bob Martin. He’s clearly someone who’s got something to say. But that doesn’t mean I always agree. Today, I don’t. And I consider it interesting why we disagree.
I’ve just read Robert Martin’s post“The Dark Path”. He picks three innovative traits of Kotlin and Swift: strict null checks, strict exception handling and making classes final (in Java speech) or closed (in Kotlin lingo) by default. It’s an interesting post I recommend to read. Uncle Bob shortly explains these features, continues with complaining about languages becoming too complex because they try to fill each leak of their predecessor languages, and closes with an ardent call to write tests. Like usual, he arguments very convincingly. It’s hard to disagree after reading the article. Yet I do.