Building a Simple Web Application in Dart

Dart is a programming language developed by Google and made popular by Flutter, their mobile development framework for cross-platform application development.

The Dart language is a general-purpose language, built to be used for far more than just mobile development, and, in this short tutorial, I will show you how to build a basic web application, using Dart.

Using Socket.io to Create a Multiplayer Game with Angular and Node.js

When it comes to client and server communication, there are quite a few approaches towards solving the problem. You could create a RESTful API or GraphQL API on your server and consume it on-demand with your client, or you can go the socket approach and interact in real-time through events. There isn’t a wrong way to do things, but some ways are better than others given the task at hand.

Let’s take for example gaming and online multiplayer games. While certain aspects of the game would make sense to use REST or GraphQL, not everything would feel responsive enough. Instead it makes sense to use sockets.

In this tutorial we’re going to explore Socket.io for our client and server communication. We’re going to create a Socket.io server with Node.js and that server will communicate with each of our games running as Angular applications.

Service Workers With Workbox In A Hugo Static Generated Site

As you know, The Polyglot Developer is a static generated website that is built with Hugo. Given the nature of static generated websites, they are generally much faster than the CMS alternatives, but just because they’re fast, doesn’t mean they pass all of Google’s tests by default.

In an ongoing effort to try to satisfy Google PageSpeed Insights and Lighthouse when it comes to search engine optimization (SEO) and other best practices, I was lead to the progressive web application (PWA) test. There are many factors that determine if something is a PWA, but one of those resides in the use of service workers. In case you’re unfamiliar, service workers accomplish many things, with the most common of those things being caching.

Implementing service workers in an application is not necessarily the most complicated task, but as your applications evolve, things might become more chaotic. This is where Workbox comes in. With Workbox, you can use very clean APIs to pre-cache your static site resources as well as cache resources at runtime. We’re going to see how to use Workbox to implement service workers for caching Hugo content and other resources such as images, fonts, and scripts.

Track Element Viewability With JavaScript Or Google Tag Manager

As you might know, sponsored advertisements are one of the things that are funding The Polyglot Developer and everything it accomplishes, so keeping sponsors happy and supplying them the metrics they need is very important. However, in most circumstances, more specifically when it comes to banner creatives, page views is not enough. For example if your sponsors or potential sponsors asked how many impressions each of your advertisement zones gets, you can’t just list off the page views that those particular pages get because how do you know if the user actually saw the advertisement?

I’ve heard a few names when it comes to element impressions. Some call it element or image visibility, and some call it viewability. It doesn’t really matter as they are both trying to determine if the user has actually seen the image or element on their screen.

In this tutorial we’re going to take a look at tracking if users have seen a particular image or set of images using simple JavaScript as well as an alternative method that links directly with Google Analytics (GA) called Google Tag Manager (GTM).

Two-Factor Authentication With TOTP Using Node.js And Speakeasy

Almost two years ago I had written a tutorial around 2FA in a Node.js API with time-based one-time passwords. If you’re unfamiliar, two-factor authentication is becoming the norm, which it wasn’t necessarily back in 2017. If you’re managing user accounts in your web applications, it is critical that you offer your users a second factor of authentication to prevent phishing and malicious login attempts.

While the previous tutorial is still valid, it uses a less popular library to accomplish the task. This time around we’re going to explore using a more popular library called Speakeasy to manage two-factor authentication (2FA) within our Node.js with Express.js application.

Developing A GraphQL API With Node.js And MongoDB

While REST APIs are amongst the most popular when it comes to client consumption, they are not the only way to consume data and they aren’t always the best way. For example, having to deal with many endpoints or endpoints that return massive amounts of data that you don’t need are common. This is where GraphQL comes in.

With GraphQL you can query your API in the same sense that you would query a database. You write a query, define the data you want returned, and you get what you requested. Nothing more, nothing less. I actually had the opportunity to interview the co-creator of GraphQL on my podcast in an episode titled, GraphQL for API Development, and in that episode we discuss GraphQL at a high level.

You might remember that I wrote a tutorial titled, Getting Started with GraphQL Development Using Node.js which focused on mock data and no database. This time around we’re going to take a look at including MongoDB as our NoSQL data layer.

Using Hapi.js, Mongoose, And MongoDB To Build A REST API

To continue on my trend of MongoDB with Node.js material, I thought it would be a good idea to use one of my favorite Node.js frameworks. Previously I had written about using Express.js with Mongoose, but this time I wanted to evaluate the same tasks using Hapi.js.

In this tutorial we’re going to develop a simple RESTful API using Hapi.js, Joi and Mongoose as the backend framework, and MongoDB as the NoSQL database. Rather than just using Hapi.js as a drop in framework replacement, I wanted to improve upon what we had previously seen, by simplifying functions and validating client provided data.