CodeIsGo.com

The author’s experience with building a minimal web application that would serve him and his wife as a recipes collection for food that we enjoy cooking. Convenient bonus features like PWA functionality (i.e. using the app on the phone or tablet when standing in the kitchen) and user authentication should be available too, making sure it’s not just functional, but also enjoyable to use. By Tom.

The article then describes:

• Why Fauna?
• Basic App Functionality
• Vue App Setup
• Serverless Functionality
• Local Development Configuration
• User Authentication
• Functions

… and more. The cloud services author used for this project (Cloudinary, FaunaDB and Netlify) all have a very generous free tier without any noticeable throttling or service restrictions. Good read!

Performance is a touchy subject in software engineering. It’s one thing to write code and ship it; it’s another thing entirely to make it faster and more enjoyable for your users — and the next developers after you. Published on theninja.blog.

In this article, we will look at how to speed up your Vue.js web applications, thereby improving both user experience and developer experience as well. The article covers topics:

• Lazy loading route components
• Minimize the use of external libraries
• Compress and optimize images
• Lazy load images
• Reuse functionalities across your app

While there are even more ways to optimize our Vue applications not listed here, the five techniques listed above are among the most used. You will get code examples for each topic mentinoned. Nice one!

Having a defined process will help you work in a more organized and fluid way. Here are the key components of a UX workflow. By Mehek Kapoor.

When working in a design team, it’s likely that your team works according to a certain methodology in order to conduct an effective design process. But if you are working as the only designer in a small company or doing freelance work, client deadlines and constantly changing user requirements are some of the things that take most of your time and energy.

In such situations, how do you make sure that you have a proper approach and a design methodology to follow when working on any project? Before we get to the answer to this question, there are a few things that are important to understand:

• What is a UX design strategy?
• Why should a designer have a design strategy?
  • Step 1: Understanding user requirements
  • Step 2: Performing a competitive analysis
  • Step 3: Searching for a suitable user base
  • Step 4: Doing user research
  • Step 5: Creating a product roadmap
  • Step 6: Building the user interface

… and much more. Your designs are your craft, and any live website that you have designed can really add a lot of potential to your portfolio. It can give you more work in the future and make your profile stand out in the pool of designers. Excellent!

Recently at our semi-regular architecture discussion group, we’ve been looking at the Auth0 service: what it is, how it works and when it might be a good idea to use it. By Adam Warski.

This article focuses on using Auth0 as a case-study for the more general problem of when to use external services in our microservices mix, and when to roll your own.

As we move towards fine-grained single-responsibility microservices, it’s increasingly feasible to use an external service for the “standard” parts of each system. We’re commonly doing this with logging, using services such as Loggly or DataDog. We’re using managed databases, be it on AWS, Heroku or database-vendor-specific solutions. We’re storing binaries on S3. Externalising user authentication and authorization might be a good candidate as well.

On one hand, it’s totally reasonable not to write yet another UserService which handles user authentication and authorization. It’s been done before, and we all like to reuse code. On the other, using an external service requires us to let go of the otherwise total control we have over our system.

The article is split into:

• Introduction to Auth0
• External microservices
  • Replaceability
  • Security
  • Latency
  • Extensibility
  • Cost
  • Automation
  • Testing

Let’s not forget about testing! Since we are externalising part of our system, we will no longer be able to run everything on our laptop. We’ll need service stubs for local development anyway. Good read!

Knative is an open source project that extends Kubernetes by providing a set of middleware components simplifying deploying, running, and managing serverless applications. By Boris Lublinsky.

While there are many Knative examples for Knative serving and Knative eventing, it is hard to find examples written in Scala. In this blog post (and corresponding code on GitHub), we’lll fill in this gap by providing some Knative examples in Scala.

Knative Serving supports deploying and serving serverless applications and functions. It is built on top of Kubernetes and Istio, is easy to get started with, and scales to support advanced scenarios.

This guide then describes:

• How to Install Knative
• Knative Serving examples
• gRPC services with Knative
• gRPC services with Knative
• Knative Eventing examples

In this post, we explored both Knative serving and eventing, highlighting many provided interaction patterns. And you will get detailed example how to use Scala and Akka for implementation of Knative Service, event consumers and custom event producers. Great read!

This post is my attempt to illustrate a Proof of Concept (PoC) author built to try out some ideas. Primarily author wanted to understand more about how to create great product experiences. By TK.

When we say high-quality software, this can mean so many different things. But we wanted to focus on three parts:

• Clean Code: Strive to write human-readable code that is easy to read and simple to maintain. Separate responsibility for functions and components.
• Good test coverage: It’s actually not about coverage. It’s about tests that cover important parts of components’ behavior without knowing too much about implementation details.
• Consistent state management: The need to build with software that enables the app to have consistent data. Predictability is important.

Library called tsdx was used to sey up all the Typescript configuration. It’s mainly used to build packages.

This is the first part of this project to learn more about user experience, native APIs, typed frontend, and tests. Project is centered around building 2 pages - home page and the search page displaying product lists. Plenty of links to further resources together with many code examples documenting the whole journey. Nice one!

Web Components are a newly supported standard. They’re a great match for Design Systems because they’re futureproof and work with any framework. Building proper UI Web Components can be quite a task though, especially if you want them to be accessible. By Erik Kroes.

The article does a great job of explaining what Web Components are and how to use them with accessibility in mind.

Web Components are a set of standards:

• Custom Elements: A way to create your own HTML elements
• ES Modules: Self-contained modules of JavaScript code that can be reused and extended
• HTML Templates: Reusable fragments of DOM
• Shadow DOM: Encapsulation of DOM

Together these standards enable “Reusable extendable encapsulated self-contained components for the web”. That’s quite a mouthful, but not very clear.

In practice, this means you can create your own HTML elements. These elements have their own bit of encapsulated DOM. In this, and many web-related cases, DOM stands for Document Object Model. …It means the HTML element you make can’t be touched or influenced by whatever is outside of the element. They can’t be accidentally styled, and they won’t mess with your global styles either. And because it’s an ES Module, the whole element can be distributed and extended. All these aspects together make up a Web Component.

You will also get code examples, explanation what is shadow DOM, and light DOM, overview of aspects that need special attention when creating an accessible user interface control, what are accessible UI components and plenty of links to further reading. Great job!

This is the inside view of how exactly a router operates. You only need to know this if you are poking inside a router implementation. If that is the case, my condolences. By Kamila Součková.

The packet has a destination IP address. This is matched in the routing table, using a longest-prefix match (LPM), i.e. it matches IP address prefixes. It may either be for a host the router is directly connected to (on some interface), or it may need to be sent further, through a gateway (through some interface). Therefore: The routing table maps a prefix to either a next hop through a gateway and an interface, or a direct connection through an interface.

The guide is split into:

• Some terminology
• The data plane: life of a packet
  • It needs to be routed: L3/router
  • It needs to be passed down: L2.5/ARP glue
  • It needs to be forwarded: L2/switch
  • The logic: Applying the tables
• The control plane: how to fill the tables
  • L3 / routing table
  • L2.5 / ARP table
  • L2 / MAC table

You will also get code (in P4 - P4 programs specify how a switch processes packets.) accompanying the explanations and demonstrating implementation. The author promises to provide the complete source code to a functional router in near future. Good read!

In this tutorial, authors propose a way to “mimic” group memberships - which can be either by team, project or any other aggregation you may need - using stock Kubernetes authorization features. By Juanjo Ciarlante @cncf.

As Kubernetes group membership is handled externally to the API itself by an Identity Provider (IdP), the cluster administrator needs to interact with the Identity Provider administrator to setup those group memberships, making the workflow potentially cumbersome.Identity Providers may not provide group membership at all, forcing the cluster administrator to handle access on a per-user basis, i.e. Kubernetes RoleBindings containing the “full” list of allowed end-users.

Source: https://www.cncf.io/blog/2020/09/17/simplify-kubernetes-resource-access-control-using-rbac-impersonation/

The article then does a good job explaining:

• Assumptions and prerequisites
• Overview of Kubernetes authentication
  • ServiceAccounts (SAs)
  • Users (external Personas or Bot users)
• Overview of Kubernetes Authorization and RBAC
• Using impersonated “virtual-users” to control access
• A working example with RBAC rules

… and much more. Extensive and detailed article useful for anybody working with Kubernetes. Great read!

This is a starter guide for UX Designers about delivering accessible websites. As a UX Designer you’e an advocate for the user. You’re responsible for making sure the product is useful and usable for all users, including those with disablities. By Peter van Grieken.

Your role as a UX Designer is to help the team approach accessibility as a facet of user experience rather than a checklist of requirements.

The article is split into multiple resources, including:

• Don’t design for mouse interactions alone
• Design what keyboard interactions look like
• Use of colour
• Colour contrast
• Be consistent - elements should be identified the same on all pages.
• Think about communication
• Video and audio content need text alternatives
• List of books about accessible UX desig

A big section is also dedicated to accessibility issues and how to find them. When you design and build websites properly, disabled people can use them. Unfortunately, many websites are designed in a way that makes them difficult or impossible for some people to use. Excellent read!