Sitepen

Leveling-Up Your Dev Team

Mon, 10 Jul 2023 13:55:24 GMT

Software projects succeed or fail based on the quality of the teams behind them. Expert developers can be hard to find. So how do you get junior developers to level up? It’s not enough to teach how to use a framework or tech stack. Good developers can follow a pattern. Great developers know why patterns

TypeScript 5.0 Cheat Sheet

Wed, 07 Jun 2023 09:12:25 GMT

This cheat sheet is an adjunct to our Definitive TypeScript Guide. Originally published November 2018. Updated November 2022 for TypeScript 4.8.

Redesigning Enterprise Apps Efficiently: The Bottom Up Approach

Fri, 19 May 2023 13:04:20 GMT

Not long ago, good design was considered nice to have, but non-essential to a product or company. In today’s market, however, good design has become a commodity. The apps we use on our phones, our laptops, or even on our TVs are constantly scrutinized based on their quality of user experience design.

Getting Started with WebRTC

Tue, 16 May 2023 08:57:28 GMT

Did you know that a desktop browser has almost everything you need to make video calls? A client-side web app can use the WebRTC API, which is built into modern browsers, to access a system’s camera(s), start a video stream, and connect to a remote system, all without requiring any third party plugins. In the

The Definitive TypeScript 5.0 Guide

Tue, 21 Mar 2023 04:32:52 GMT

Originally published October 2018. Updated March 2023. This article describes the features and functionality of TypeScript 5.0. One of the most interesting languages for large-scale application development is Microsoft’s TypeScript. TypeScript is unique in that it is a superset of JavaScript, but with optional types, interfaces, generics, and more.

Building a Serverless Chat Application with Supabase

Tue, 14 Mar 2023 02:12:40 GMT

Modern times have seen an explosion in services providing a multitude of serverless possibilities, but what is serverless? Does this mean there are no servers? You’d think, but no.

Using Redux-Saga to Write a Game Loop

Mon, 13 Mar 2023 10:39:52 GMT

Redux-Saga is an intuitive side effect manager for Redux. There are many methods and tools to manage side effects with Redux, but Redux-Saga is fascinating because it’s an implementation of Communicating Sequential Processes, CSP for short.

Design to Development: Bridging the Gap for a Successful Handoff

Tue, 07 Mar 2023 05:23:57 GMT

Let’s be honest, getting designs from your UX team into the hands of your engineering team in a way that makes sense is rarely easy. Add tight deadlines, team changes, and miscommunication to this process, and your application will likely end up looking very different than what you expected.

Exploring the Creative Possibilities of Markov Chains for Text Generation

Thu, 23 Feb 2023 07:04:50 GMT

News about AI is everywhere right now. Whether it’s ChatGPT or Stable Diffusion, we’re using AI algorithms to generate text and images. Before the recent explosion of neural networks though, people have been using computers as word smiths for decades.

Using the Local File System to Enrich Your Apps

Wed, 15 Feb 2023 06:26:57 GMT

Use the File System Access API to read, write, and edit files on the local file system directly from the browser.

Unlocking the Power of Parser Combinators: A Beginner’s Guide

Thu, 09 Feb 2023 02:27:01 GMT

In this article, we’re going to explore a particular type of parser that is conceptually simple, super flexible, and crazy easy to test. We’ll use these parsers to help us solve a problem that many of us have been faced with and frustrated by: parsing dates.

Beyond the Code: A Look at the Next Steps in Mobile App Development

Tue, 07 Feb 2023 07:03:53 GMT

Developing a mobile app is a major accomplishment, but it’s just the first step in a long journey. In order for your app to be successful, it’s important to not only develop the app but also to beta test it, release it, and update it after it’s released to the public.

Going Private: How to Set Up and Use a Private Node Registry with Expo Application Services

Fri, 03 Feb 2023 03:00:00 GMT

We discuss the benefits of using a private node registry with Expo Application Services, as well as the steps involved in using such a registry.

Software & Data Architecture: Part 2

Wed, 01 Feb 2023 03:14:44 GMT

In the first part of this article, we learned about fundamental data architecture and modeling concepts that provide valuable insights into your system. While the visual nature of these artifacts is helpful in its own right, what other benefits can teams gain from analyzing and documenting these concepts?

Software & Data Architecture: Part 1

Tue, 24 Jan 2023 06:52:08 GMT

The definitions of ‘information architecture’ and ‘data architecture’ are, unfortunately, pretty broad. They cover many areas of systems engineering and are applicable across several disciplines, including the design of business processes, user experiences, and software implementations. Every concept you can find in any accepted definition for the terms has value.

The State of Machine Learning 2023

Wed, 18 Jan 2023 10:56:26 GMT

2022 increased the public spotlight on AI like no other year with the virality of image generation tools like DALL-E and Midjourney, text compositions from ChatGPT, and the increasing sophistication of humanoid robots. These systems certainly raise interesting societal questions around plagiarism and what “art” is, the ethics of AI content generation, and the actual beneficiaries of generalized task automation, among many others.

Intro to tRPC

Tue, 13 Dec 2022 09:44:50 GMT

The benefits of TypeScript are numerous, from strong type safety, code maintenance to refactoring, and more. It’s also not uncommon today for web developers to be responsible for both the front end and the back end of a project. This can be highlighted by the popularity of frameworks like Next and Remix, both of which allow developers to work on full-stack TypeScript applications.

Advanced TypeScript 4.8 Concepts: Classes and Types

Wed, 16 Nov 2022 02:30:00 GMT

Originally published November 2018. Updated November 2022. This article describes the features and functionality of TypeScript 4.8.

The Basics of Proxy

Tue, 08 Nov 2022 03:17:33 GMT

Modern JavaScript is amazing. There are so many features you might not have had a chance to use, and some that are probably being utilized by some of your favorite frameworks and tooling. One such feature is the Proxy.

Intro to HTML-first Frontend Frameworks

Mon, 31 Oct 2022 04:02:17 GMT

In the beginning was HTML, and our pages were fast. But they were boring, so we added JavaScript. JavaScript ended up being so capable that we ended up creating entire applications with it, dynamically creating and destroying DOM interactively to users’ delight. Applications grew in complexity and so frameworks were created to tame that complexity, giving developers components, state management, routing, and so much more.

Intro to Feature Toggles

Wed, 26 Oct 2022 06:32:41 GMT

Feature toggles (sometimes referred to as feature flags) are an engineering practice aiming to control application behavior without the need to deploy a code change. The behaviors that toggles can affect range from hiding under development features, limited feature release (canary) to a subset of users, or used to switch to fallback implementation in the event of a system issue, and more. These feature toggles are defined outside of the codebase in a shared datastore or service that the application can look up at runtime to determine the status (traditionally on or off, but some features toggle implementations can accept more descriptive values).

CI/CD Challenges: An Enterprise Overview of Continuous Integration, Delivery, and Deployment

Mon, 24 Oct 2022 10:48:08 GMT

Continuous integration, continuous delivery, and continuous deployment implementations cover a wide range of automation possibilities for your software. This article will provide an overview of these three principles, the benefits they can bring to your engineering efficiency, and potential challenges. A continuous integration pipeline is the first step to embracing a CI/CD process.

Intl for Your Apps

Fri, 07 Oct 2022 06:34:18 GMT

At some point when you build applications with a wide user base, you find that you need to support various combinations of languages and locales. This could be in the form of having to support a locale from the browser, or maybe a user has defined their preferred locale in their profile, so you need to display data in a different locale from the browser default. Taking a step back from translating text, which most likely involves you defining files in multiple languages, you can handle the formatting of dates and numbers in your applications.

Jest + ESM: Almost There…

Thu, 08 Sep 2022 06:18:35 GMT

Jest is one of the most popular testing frameworks, but it hasn’t really kept up with the growing support for native JavaScript modules (ESM) in the developer community. A fresh install of Jest will simply not work with native modules. However, Jest does have experimental support for ES modules.

The Basics of a Monorepo: Where Projects Go to Meet

Tue, 30 Aug 2022 09:17:55 GMT

You may not need a monorepo, but it’s useful to know what they are and what they have to offer. You could have a monorepo that is a mix of frontend, backend, utilities, linters, or more, each with its own set of build tools, and various needs. As a monorepo, it can help you tell a cohesive overall story for your projects.

The Web Speech API: Can You Hear Me Now?

Wed, 17 Aug 2022 04:47:08 GMT

How often have you wanted to yell at your computer or phone? What if your device could save that tirade as a text in an email or note you could review in the future, a memento of your favorite outbursts? Or, maybe you want to provide your users a more hands-free experience, with alerts that also speak to you. Or you simply want to add a clean voice-to-text component to your application. The Web Speech API provides developers with a tool to accomplish all of this! You can do two things with the Web Speech API: speech recognition and speech synthesis.

Give Svelte a Try

Thu, 11 Aug 2022 08:45:28 GMT

Svelte has become increasingly popular over the last several years, even being voted the “most loved” web development framework in the 2021 Stack Overflow Developer Survey. Quite a few articles have been written about how much nicer Svelte is to work with than React. Supposedly Svelte is easier to pick up for new developers and generally more pleasant to work with.

Welcome to Web Bundles

Fri, 08 Jul 2022 07:46:34 GMT

Web bundles are an exciting part of the web packaging specification. They provide you the ability to package up your entire website into a single bundle and share it with others. Have you ever had to create a zip file of your project and email it to someone? This is similar to how web bundles work, but in a formalized spec that can be opened directly in the browser.

Spend Some Time With the Temporal API

Tue, 14 Jun 2022 01:51:00 GMT

Ask almost any developer what their greatest fear is and one deep-seated topic will rise above the rest… dates. To be fair, this will mostly stem from where those dates originate.

Why Type Annotations in JavaScript are a Good Idea

Tue, 17 May 2022 05:58:33 GMT

In March 2022, a Stage 0 proposal was announced that would add TypeScript-like type annotations to the JavaScript language. The utility and ergonomics of static types for JavaScript have been debated since before TypeScript’s inception; some developers feel that types add needless complexity to the language, while others feel that types add a much-needed safety net. Today, static typing is one of the most desired JavaScript features, and adding some level of type syntax to the language would provide several benefits.

A Recipe for the Perfect Software Delivery Storm: Part 2

Tue, 05 Apr 2022 02:51:17 GMT

The first half of this 2-part series highlighted why ongoing maintenance is vital for the health of large-scale enterprise systems, especially heading into a substantial upgrade or replacement project as the system reaches end-of-life. We inverted the problem and started describing a recipe for implementing the worst “best” possible enterprise system upgrade project a business could ever want. Now, what other areas could we add to the recipe for even more fun? Disclaimer: The following recipe is intended as satire – not to be taken literally! Are engineers interacting directly with product owners? Who wants that! Add extra layers into the hierarchy, such as analysts with conflicting information or multiple levels of product owners with differing ideas on future direction.

A Recipe for the Perfect Software Delivery Storm: Part 1

Mon, 04 Apr 2022 02:22:59 GMT

Enterprise software delivery for large-scale projects is complex. It requires substantial time and financial resources to complete, whereas a single system can cost millions of dollars and take years to deliver. Firms will likely expect their software ecosystems to operate for decades before retiring or replacing them to maximize profit and justify the significant initial development outlay.

Doing It All With Deno

Fri, 01 Apr 2022 02:17:23 GMT

We’ve talked before about some of the great features Deno brings to the table: first-class TypeScript support, a solid standard library, support for Web standards, and implicit security. All of this makes Deno great for writing scripts and servers, but it also works well for writing client-side applications. You can create a complete web app with nothing but Deno (and libraries 😄): client, server, and even tests! In this post, I’m going to walk through a simple Deno-based Todos app.

4 Ingredients to Successful Software Development

Thu, 31 Mar 2022 02:00:00 GMT

Software engineering is one of the most challenging endeavors we can engage in today. Successful software projects must address the vast scope of today’s applications while paying meticulous attention to the small details that can make the difference between a fast, efficient system and a slow, cumbersome burden. Surprisingly, the things that are most often complained about – short deadlines, moving targets, etc.

Doing More with Expo: Using Custom Native Code

Thu, 24 Mar 2022 06:52:20 GMT

Expo, a framework that significantly improves the React Native developer experience, has become very popular in the last couple of years. Its “managed” workflow lets developers work entirely in React; the underlying native app, including the often messy process of updating React Native, is completely taken care of by the framework. Unfortunately, using the managed flow has traditionally required apps to stick to whatever set of native extensions are in the Expo Go client; if more native code is needed, developers have had to use Expo’s “bare” flow, which is missing many of the conveniences of the managed flow. This is no longer the case.

React Native Everywhere: iMessage Apps and Input Services

Fri, 08 Oct 2021 06:16:23 GMT

React Native is great for writing mobile applications. It lets you use web paradigms for UI construction, which are usually much simpler than the native analogues. Tools like Expo make developing apps even easier, allowing developers to mostly ignore the native side of things.

Automate Web Vitals Checks with Github Actions and Lighthouse

Wed, 04 Aug 2021 09:22:01 GMT

Introduction Web Vitals scores can have a huge influence on your search engine rankings and directly impact your user’s experience when visiting your website. Follow our guide to automating Web Vitals checks against your Vercel CI Deployment using GitHub Actions and ensure that you don’t introduce performance issues into your code that could affect your search engine ranking. Web Vitals and Lighthouse As we covered previously in our Size Matters: The Value of Performance Optimization post, your Web Vitals scores will directly impact your search engine ranking.

Deno: Desktop JS Evolved

Thu, 29 Jul 2021 12:09:28 GMT

Deno, introduced by Node.js creator Ryan Dahl during JSConf 2018, has grown into a credible alternative to Node.js, and the JavaScript and TypeScript communities have continued to track Deno’s progress. Like Node.js, Deno is a system for executing JavaScript code in various environments ( desktop, command-line, server, etc.). It works similarly to Node.js — you write scripts in JavaScript or TypeScript and run them using the deno command line program.

Improving Web Application Security with a Content Security Policy

Wed, 14 Jul 2021 05:06:48 GMT

A Content Security Policy (CSP) is an important aspect of securing websites and web applications. CSP is a resource security specification (W3C recommendation) for web browsers. It is configured by sending directives in an HTTP header.

Taming Strings with Template Literal Types

Fri, 18 Jun 2021 05:35:45 GMT

Among the vast number of improvements that ES2015 brought to the JavaScript language was a powerful feature called “template literals.” Naturally, TypeScript, as a superset of JavaScript, has supported this useful construct since its beginning. However, TypeScript 4.1 introduced a novel application of the template literal concept to increase the power and usefulness of its type-system: it introduced something called a template literal type. In this article, we’ll talk about this new feature and how you can use it to increase the robustness of one of the most challenging things that a type system can face: strings.

PWAs: Blurring the Line Between Native and Web Applications

Tue, 15 Jun 2021 06:49:09 GMT

Today’s software development landscape has never been more challenging. The rich capabilities of modern hardware and the high consumer expectations for performance and stability combine to ensure that developers need as much help as possible to meet their deadlines. Of all these challenges, one of the most vexing is the need to support today’s vast number of devices and operating systems. A primary goal for creating cross-platform applications is to ensure that as much code can be reused as possible.

My Engineers Love TypeScript, but Will it Actually Make My Project Better?

Thu, 10 Jun 2021 05:29:51 GMT

TypeScript has become a hugely popular alternative to JavaScript in the frontend web development community. Many engineering teams are convinced it is a critical tool that allows them to write better code faster. From a business perspective, however, things are not so straightforward.

How to git by with a GUI

Mon, 07 Jun 2021 12:26:31 GMT

Getting started with Git can be a daunting task, especially if you are not at home in the command line. Fortunately, Git is a mature and widely used tool so there is a lot of reference and “How do I…?” material available. One aspect less commonly covered is using Git with some of the numerous Git GUIs available.

Rome: The Last JavaScript Package

Tue, 01 Jun 2021 06:30:55 GMT

Rome is a new set of tools for working with web-facing technologies like JavaScript, TypeScript, JSON, HTML, Markdown, and CSS. The toolchain currently supports linting and formatting, with active plans to also support bundling, compiling, minification, type checking, testing, and documentation generation. Rome aims to holistically enable all aspects of the modern web-focused development workflow.

An Introduction to Continuous Software Development

Fri, 28 May 2021 04:11:11 GMT

Improve customer satisfaction and maintain an edge over competitors by getting cutting-edge features into production faster and with fewer defects with Continuous Software Development techniques. Continuous Software Development is a term applied to a set of incremental strategies that aim to reduce the delay between development and deployment of new features. The methods are an evolution of agile development practices.

How to Simplify Angular Unit Test Authoring

Thu, 27 May 2021 07:12:33 GMT

Are you working with Angular? Have you written hundreds of unit tests and do you feel like it is taking way more time to write the tests than it did to write the application code? Let’s talk about ways to speed up the authoring of those Angular unit tests and get back to doing the fun stuff. Angular components interact with users through the DOM and you want your automated tests to do the same. Here is an example of some test code that clicks a save button. See the Angular Components Library: More Than Just Material post for more information about how components work.

Hitchhikers Guide to NFTs

Wed, 26 May 2021 04:06:23 GMT

As the world warms up to the idea that cryptocurrencies are here to stay, many have started to think more deeply about the advantages these digital currencies offer over traditional money. Transactions are fast, security is guaranteed by design, and third-party verification is instantly and indefinitely possible. These characteristics of speed, security, and verifiability aren’t only useful for finance, and other sectors such as rare art and collectibles operate under the very same principles.

Nine Principles of Modern Data Architecture

Mon, 24 May 2021 10:29:10 GMT

It has been said that all businesses today are IT businesses. They just happen to make their money selling different things. While that statement may not be universally true, software and computer technology have become a central part of most companies’ day-to-day operations.

Size Matters: The Value of Performance Optimization

Fri, 21 May 2021 05:50:48 GMT

At SitePen, web application development is the core of what we do. We pride ourselves on our reputation for creating rich web apps that are highly responsive and reliable. The first chance that we have to demonstrate our skills is through our company website.

Angular Components Library: More Than Just Material

Thu, 20 May 2021 06:24:40 GMT

The Angular Components library started its life as Angular Material, a set of Material Design components built for Angular by the Angular team. Released around the time of Angular 5, the Angular Material library consisted of some 30 material components. The team had spent nearly two years building the components and during that process had been on the lookout for common patterns.

How to Choose A Web Development Partner

Wed, 19 May 2021 10:45:44 GMT

SitePen is a web development company focused on modernizing apps, tools, and teams for the Enterprise. Our claim to fame is our long-standing development team that through the years has created, developed, and supported the longest-lived enterprise platform for client-side web development, the Dojo Toolkit. Today, our platform-agnostic approach to web development enables our customers to make intelligent choices that propel their company’s web initiatives forward, allowing for unsurpassed performance, modularity, and stability. So let’s get right to it.

Vetting a UI Component Library

Mon, 10 May 2021 05:44:37 GMT

When developing web applications, choosing a UI component library is one of the earliest decisions your team has to make. Beyond reducing the amount of functionality your team has to maintain, UI component libraries shield developers from the complexities involved in designing user interactions that are accessible and behave correctly across browsers and devices. Choosing the right component library is nearly as important as choosing the framework in which your application is built.

Considerations When Modernizing Legacy Applications

Wed, 28 Apr 2021 04:55:17 GMT

Software development and usage of software-driven products are rapidly evolving subject areas. Healthy competition means crafting applications becomes quicker and cheaper over time. The customers of such systems expect ever-more-sophisticated capabilities and user experiences out of a growing pool of competitors.

Life Without Callbacks

Thu, 22 Apr 2021 04:44:52 GMT

Let’s face it. Reactive programming and the traditional web APIs are not friends. Event handlers, observers, dimensions, all of these things are meant to be used imperatively using callbacks.

5 Tips for “Spring Cleaning” Your Agile Practices

Tue, 20 Apr 2021 03:33:15 GMT

Maybe it’s the spring air and the budding trees. Maybe it’s the longer daylight hours. Maybe you watched too many home organization TV shows when it was too cold to go outside.

Floating on Tailwind CSS

Thu, 15 Apr 2021 11:16:21 GMT

As modern reactive front ends have begun to converge on effective module patterns and universal approaches to common application paradigms, it’s not uncommon to see much of the variance between frontends as far as how they expose and implement their given style guide. The implementation and the delivery of application styles to an underlying component tree have become almost an art form, where each application attempts to solve the ever-present CSS problems of naming and reuse in the best, most effective way possible. Tailwind CSS provides a set of style guide-agnostic utility classes backed by opinionated, customizable variables, allowing developers to switch between projects using the same CSS toolset.

Add CarPlay to your React Native App

Thu, 08 Apr 2021 05:03:06 GMT

CarPlay is an Apple iOS car integration standard that allows you to display content from your iPhone onto your compatible car head unit and control your phone. Common uses for this include casting music from services such as Spotify or Apple Music or for trip navigation using a map application. As CarPlay advances with each iOS release, more and more app categories are added, opening the door for more third-party apps to be created and accessed on your car head unit.

React Native: Crash Course for the Business-Side

Wed, 31 Mar 2021 06:48:36 GMT

Mobile development mostly deals with 2 platforms: iOS and Android. There are distinct ecosystems for both platforms — each has its own languages (Java and Kotlin for Android, Objective-C, and Swift for iOS), its own standard environment (Android Studio for Android, Xcode for iOS), its own app architectures, app stores, libraries, etc. The basic capabilities of each platform are similar, and the developer has to consider a lot of the same issues (screen size, obtaining permission for things like location data, etc.), but developing apps for each are distinct processes.

How to Choose a Software Development Company

Thu, 25 Mar 2021 08:21:27 GMT

There are many articles and blog posts on the internet that attempt to advise readers on how to choose a software development company. Almost all of them discuss the traits and attributes that make one vendor superior to another. The difficulty with this approach is that a vendor’s ability is meaningless if it doesn’t align with an organization’s needs.

Get Lean with Your MVP by Hacking Human Psychology

Mon, 22 Mar 2021 08:30:38 GMT

Most agile product teams have heard the concepts around using a Minimum Viable Product (MVP) to learn about what customers want, Lean Startup style, but the process of defining an MVP to fulfill those goals often proves to be easier said than done. Let it be reiterated that an MVP in software development is not needed when the market and/or user needs are well known, leading to much confusion and dilution of terminology commonality in which the enterprise world has used the term to simply refer to the first release of any product and the inevitable scoping such a release receives. One popular agilist widely said, “Oh, if it’s already viable, why even build further?” This is a simple misuse of the term! The Lean in Lean Startup refers to getting rid of what is waste relative to the immediate goals of a new product.

Software takes more than “the right technology”

Fri, 26 Feb 2021 05:04:28 GMT

Carpenters have lots of tools to pick from. Drills, impact drivers, circular saws, and miter saws; each tool may be really good for a specific purpose and a great carpenter will know when to use each one. However, the best carpenter is not necessarily the one who uses the most tools, but the one who best knows how to use the tools he has to get the job done quickly and accurately.

Introduction to Machine Learning with JavaScript

Mon, 19 Oct 2020 08:37:14 GMT

Machine learning is a subset of AI that is concerned with algorithms that can improve through experience. Experience in this case generally translates to being fed lots of data. What’s more interesting than what machine learning is though, is what it can do.

Agile Project Management: Best Practices and Methodologies

Mon, 19 Oct 2020 08:33:22 GMT

Want to get the most out of your dev management process? This article covers some of the best practices and methodologies SitePen uses to accomplish enterprise-level development goals. We’ll start with some basics on Agile methodology, then we’ll provide practical info about how our experience has culminated in a lean development process that turns ideas into milestones, and ultimately into product outcomes. We focus on instilling best practices throughout the software development lifecycle in all areas of the project to ensure that we not only leave behind a healthy codebase but also the healthy processes and teams to maintain and extend it for years to come. Agile principles are applicable in virtually all software development environments.

What’s new in TypeScript 4.0?

Tue, 29 Sep 2020 07:37:04 GMT

The recent release of TypeScript 4.0 offers a smorgasbord of improvements including improvements to coding editor experience, build scenarios and support for variadic tuple types. Let’s take a closer look at some of these improvements a developer can make use of in this latest release. TypeScript 4.0 has made two different updates that allow for more flexibility in typing tuples.

Architecture Spotlight: Event Sourcing – Part Two

Thu, 06 Aug 2020 08:00:00 GMT

In the previous architecture spotlight entry, we discussed Event Sourcing and illustrated the concept with a simple banking account example. We laid out many of its pros and cons to help readers decide if the pattern would be useful to them. In this post, we will be expanding the example and showing a working code implementation using a popular event streaming technology, Apache Kafka.

What is a 2nd Generation Framework?

Mon, 03 Aug 2020 09:43:49 GMT

An article on 2nd Generation JavaScript Frameworks & Libraries: beyond Angular, React, and Vue! recaps Geertjan Wielenga’s talk on the evolution of JavaScript and the influence of the enterprise in recent years. Wielenga spoke of the pioneers of JavaScript frameworks and libraries including Dojo (1.x), Mootools, Extjs, jQuery, and YUI which were among the first libraries to address the needs of the developer. Piecemeal solutions built on top of these to solve increasingly common problems and were followed by the need for building tools to aid in simplifying the complexity of deploying large web applications. Current LandscapeJumping to present day, Weilenga highlights the dominant front-end frameworks, Angular, Vue & React, categorizing them as “first-generation frameworks” and identifying their common (and serious) issues: Large amounts of technological churn added to the ever-evolving ecosystem around them that developers have to keep up with. Incompatible custom stacks. Developer specialization; developers identifying by framework instead of language.

Increasing Value in Your Software Development Lifecycle

Thu, 23 Jul 2020 04:40:04 GMT

Today, many software projects rely on some form of iterative software development lifecycle (SDLC) to incrementally deliver features to their users. A feature is identified, analyzed, designed, scoped, implemented, tested, and ultimately shipped to users – and this cycle is repeated for all features throughout a project’s lifetime. These types of methodologies are especially useful when developing web applications, where evolution happens at a rapid pace and time to market is often paramount.

Writing Tests that Work

Tue, 30 Jun 2020 10:18:49 GMT

Your team realizes that testing is valuable. Your team creates tests for already completed features. The result was encouraging and your team even found a few bugs hiding in the application.

Why Automated Testing Matters

Tue, 30 Jun 2020 10:07:05 GMT

Your software development team released an MVP application into production. The application only had a few features and the codebase is far from perfect, but there are big plans for the future! Your team presses on, adding features and your user base continues to grow. After a few months, cracks begin to surface.

Smart Contracts: A Tutorial

Wed, 17 Jun 2020 10:26:46 GMT

Now that we’ve demystified smart contracts and better understand what they are and how they work, let’s build our own contract on top of the Ethereum blockchain. Because smart contracts are computer programs at their core, many of the concepts that we’ll use to build a basic contract will seem familiar. Major advancements in developer tooling and infrastructure in the Ethereum ecosystem allow us to effectively develop a smart contract completely in-browser, so let’s get started.

Demystifying Smart Contracts

Wed, 17 Jun 2020 10:25:10 GMT

Smart contracts are often described as a transformative new technology that borders on magic, able to remove third-parties and monetary risk alike from business deals using the power of the blockchain. The autonomous execution and enforcement of an agreement may sound like something out of a Harry Potter novel, but the maturation of blockchain-based programming techniques have made smart contracts more of a reality than ever. Many types of business transactions today require intermediate parties to facilitate the exchange of goods or services. These intermediaries are necessary in business deals in order to verify that no single party violates the terms set forth in the contract governing an exchange, especially in deals involving a high degree of mistrust.

An Even More Modern Terminal-Based Development Environment

Mon, 15 Jun 2020 05:00:45 GMT

It’s been a year since I last talked about my development environment. Many things remain the same: I’m using neovim, zsh, and tmux. However, I have made a few changes to improve usability and make my day-to-day work feel faster.

The Importance of Good Software Architecture

Wed, 10 Jun 2020 05:48:02 GMT

Software architecture is the analysis, thought and design considerations that form the foundational scaffolding for a successful software system. If you write software for work or as a hobby, whether you know it or not, you’re already dealing with software architecture and the processes of making architectural decisions within your applications. You might even work for a company where software architecture is a defined, hired-for skill set with its own career development track.

Progressively Adopting TypeScript in a Dojo Toolkit Application

Wed, 03 Jun 2020 13:38:44 GMT

TypeScript has become a mainstay of modern web development libraries. Consuming functions and widgets written by a third party can be error-prone without some type of guidance. Introducing static typing to the interfaces doesn’t just reduce misuse, it has added benefits including intelligent code completion.

A Smooth Transition: Designing for the Development Handoff

Wed, 03 Jun 2020 11:35:17 GMT

In an olympic sprint relay, four runners operate as a team to sprint a total of four hundred meters. In order to compete at a record-setting level, an athlete needs to be capable of running one hundred meters in less than ten seconds. The training and dedication it takes to get to this level of performance is nothing short of staggering.

Business Analysis: One of the Overlooked Areas of Successful Software Development

Tue, 02 Jun 2020 10:04:54 GMT

As a career business analyst, I’ve lost count of the number of times I’ve asked this question. More often than not, stakeholders are ready to discuss solutions before dissecting the problem itself. The result? A half-baked “solution” that may or may not address the key problem, and likely also creates new problems.

Disciplined Engineering – Part 3: Refining Your Engineering Process

Thu, 21 May 2020 10:39:50 GMT

This is part 3 of the Disciplined Engineering series. It is for teams that have an established engineering process with confidence around the quality of their application. This article will help improve your engineering game by identifying the common patterns that will further improve your team’s focus on quality. If you don’t have an established culture of engineering at your company, we recommend reading Part 1: Building an Engineering Process.

Disciplined Engineering – Part 2: Creating Code Confidence

Thu, 21 May 2020 10:39:13 GMT

This is part 2 of the Disciplined Engineering series. It focuses on improving the confidence of the code produced by your team. If you haven’t already, we recommend reading Part 1: Building an Engineering Process as a prerequisite for these practices.

Disciplined Engineering – Part 1: Building an Engineering Process

Thu, 21 May 2020 10:38:31 GMT

This is part 1 of the Disciplined Engineering series. It is for teams that want to establish a culture of engineering excellence for their organization. For teams that already have an established process, we recommend reading Part 2: Creating Code Confidence. If you’re looking to further improve upon your process, please check out Part 3: Refining Your Engineering Process.

Snapshot Testing: Benefits and Drawbacks

Tue, 19 May 2020 09:15:14 GMT

Snapshot testing has become very popular for front end-development over the last few years. The term has almost become synonymous with Jest and React, but it can be used to test more than just components. This article provides a brief overview of what snapshot testing is, what it isn’t, and how it might be helpful for your project.

Sensible Improvements in TypeScript 3.9

Fri, 15 May 2020 13:18:06 GMT

The recent TypeScript 3.9 release primarily focuses on performance and stability, but it does include some language updates that are worth a closer look. Continuing its quest to save you from yourself, TypeScript 3.9 expands on the uncalled function checks that were introduced in version 3.7. These checks report when a function is used within an if condition without being called, like: const isValid() => someGlobalValue > 10; let answer: string; if (isValid) { // error because isValid isn’t called answer = ‘yes’; } else { answer = ‘no’; } The latest version brings this functionality to ternary operators as well: const answer1 = isValid ? ‘yes’ : ‘no’; // error const answer2 = isValid() ? ‘yes’ : ‘no’; // no error This type of functionality is a perfect example of the language going above and beyond to warn developers about potential problems with their code, especially when those problems aren’t syntax or type-related.

Performance Testing with k6

Wed, 13 May 2020 08:35:23 GMT

There’s an old adage in the software industry – premature optimization is the root of all evil. A corollary to this should be – no optimization is just as bad as premature optimization. It is often true that effort spent optimizing a system before features are properly implemented, correct and stable is effort wasted, but even a fully-implemented system can offer a terrible user experience if performance is never considered.

Accessibility Inspectors: A Basic Guide

Wed, 06 May 2020 10:10:02 GMT

As accessibility-minded developers working on accessibility-minded teams, we strive to design and build inclusive applications that yield a pleasant experience for all users. However, despite our best efforts we may make mistakes and implement features in a sub-optimal way, or worse, discover that some users cannot use those features at all. Fortunately, in recent years browsers have introduced tools that help debug some of these issues.

Virtual Reality in 2020

Tue, 05 May 2020 11:08:40 GMT

Virtual reality (VR) is one of the most interesting emerging technologies for the web in 2020. Recently at HalfStack Phoenix I shared insights on VR, WebVR, the web, and what makes VR a lasting technology that will change the way we interact with information over the coming decade. To better understand the adoption trajectory of virtual reality, consider a variation on Domestication Theory that describes three stages of progression for successful technologies: elation – the promise of the technology is limitlesslove/hate – the technology is the best solution for a number of niche marketstransparency – the technology gets adopted and is routine When modern VR headsets like the Oculus Rift and HTC Vive were demoed to the public the reaction was amazement.

Progressively Adopting TypeScript in an Application

Thu, 30 Apr 2020 07:00:43 GMT

SitePen is a huge advocate for TypeScript and the benefits of having well-typed code. TypeScript is especially powerful when used by medium and large teams that want to find ways to increase their overall confidence in their code. One of the questions we get asked often is how can we migrate a codebase that is currently written in JavaScript to TypeScript.

Getting Started with React Native

Mon, 06 Apr 2020 12:49:38 GMT

React Native is a JavaScript framework for writing hybrid native mobile applications for both iOS and Android platforms. React Native uses the same JSX and React development approach you would take for developing for the browser, but applications get built as native applications in Objective-C (for iOS) or Java (for Android) by the React Native tooling. The key difference between React Native and other JS mobile frameworks such as Ionic or Cordova is that the result is a hybrid native application rather than a hybrid web application utilizing web views.

Architecture Spotlight: Event Sourcing

Thu, 02 Apr 2020 05:16:47 GMT

Event sourcing is a powerful architectural pattern that records all changes made to an application’s state, in the sequence in which the changes were originally applied. This sequence serves as both the system of record where current state can be sourced from, as well as an audit log of everything that happened within the application over its lifetime. Event sourcing promotes decentralized change handling and state querying, meaning the pattern scales well and is a good fit for many types of systems that already deal with event processing or are looking to gain some of the many benefits offered by such a design.

New TypeScript Features that Improve the Developer Experience

Wed, 18 Mar 2020 05:24:59 GMT

In many ways, TypeScript is more like a powerful linting and documentation tool to author better JavaScript, rather than a separate programming language. One significant benefit of TypeScript is its deliberate support for some of the latest ECMAScript language features. Updating to new versions of TypeScript provides support for new language features but in a safe, backwards-compatible manner.

What Makes Intern Different

Tue, 10 Mar 2020 05:13:26 GMT

Intern has always taken a different path in the pursuit of flexible automated web app testing. In the early days, Intern leveraged AMD modules when most other testing frameworks were not modular or only supported CommonJS modules, allowing Intern to support modular code in any environment. Intern was also one of the first tools to leverage Istanbul to support code coverage analysis, and its flexible architecture supports integration into a variety of CI/CD environments.

Why did we start TSConf?

Fri, 06 Mar 2020 11:34:56 GMT

The ubiquity of JavaScript is undeniable; it’s the universal language of the web — a position that no other languages hold. JavaScript is flexible, able to adapt and grow as the web grows. But that flexibility is often the downfall of JavaScript; without a disciplined team working diligently to keep the codebase maintainable, JavaScript can fall apart.

HalfStack Conference – Phoenix, January 2020

Tue, 03 Mar 2020 05:33:03 GMT

HalfStack is a series of tech conferences focused on half of the web development stack – specifically, the part you interface with. It lives up to its claims of being “an authentic, high value experience for attendees and sponsors focused on UI-centric JavaScript and web development.” Friday, January 17, 2020 Alamo Drafthouse, Chandler, Arizona The morning got off to a great start with comfortable seating and fine dining at the Alamo Drafthouse in Chandler. First up was Alex Blom talking about “Hacking loops and programmatic patterns into age of empires.” Despite having nothing to do with JavaScript or front-end development, this was a captivating and relevant talk.

Exploring the Network Information API

Mon, 18 Nov 2019 07:31:13 GMT

In 2007, we were invited to speak at the Apple WWDC event. At the time we didn’t know why we were invited. We later learned that because there was initially no native SDK, developers were advised to use JavaScript, HTML, and CSS to create iPhone apps, and were encouraged to attend our session.

How to Pick a Web Mapping Library for your App

Thu, 07 Nov 2019 07:04:01 GMT

With the boom of location-based technologies like mobile location services and the Geolocation API in the browser, we have seen the growth of mapping and location inside of applications. Alongside this we have seen numerous mapping libraries appear for the web, allowing developers to build map-based experiences into their apps. These libraries abstract away the complexity of things like geographic coordinate systems, ordering map tiles correctly, panning, zooming, and various other behaviors.

JSConf US 2019: Pushing JavaScript Beyond the Browser

Mon, 30 Sep 2019 09:21:13 GMT

As a first-time JSConf attendee, I happily embraced the welcoming culture and fun atmosphere – surfing, anyone? But I was even more impacted by the presentations centered around JavaScript expanding beyond the browser, using JavaScript to help others, and the focus on community. Of course I’m an avid JavaScript engineer and believer (why else would I be at JSConf), but I left feeling awed and inspired after seeing how progressive and impactful the JavaScript ecosystem can be. JavaScript Helps You Build Amazing Things The realm of what can be done with JavaScript is rapidly expanding and JSConf provided some exciting examples of what is on the horizon.

Next Generation Virtual Scrolling

Wed, 25 Sep 2019 05:55:51 GMT

Rendering large data sets in the browser while optimizing for performance and accessibility is a complex problem. The current approach to handling long lists of data is using an infinite scroll pattern to incrementally load and render data just before the data enters the view. This approach comes with trade-offs that we will look at in detail as well as new features and standards that are coming down the pipe that will improve virtual scrolling in the future.

Getting Started with Electron, Typescript, React and Webpack

Tue, 17 Sep 2019 05:55:46 GMT

If you need to build a desktop application today, Electron is an increasingly common choice. It is cross-platform and is built using the same web technologies that you probably already know. We’re long-time users of Electron at SitePen and have previously talked about Setting up Electron with Dojo.

Using Progressive Enhancement to Design for Accessibility

Mon, 05 Aug 2019 07:44:55 GMT

The web is for everyone. That includes web apps built on web architecture. If you haven’t heard the word “accessibility” mentioned in the last couple of years, you may have been living under a rock.

Using WebAssembly with Web Workers

Mon, 22 Jul 2019 08:35:19 GMT

When building web apps, writing processing intensive code can be a challenge. One issue is getting predictable running times across browsers and JavaScript engines that optimise different code paths differently, as well as producing code that doesn’t interfere with user experience. Since 2010 we’ve had a standardised way to manage interactivity for long, non-DOM related tasks.

Deploying a Dojo App with Docker

Tue, 16 Jul 2019 07:44:28 GMT

So you’ve built an amazing app using Dojo and now you are ready to go live. After a bit of research, you learn that traditional deployments are challenging! Luckily, the days of FTPing files are long gone, and we can rely on Docker for fast, reliable deployments. Using Docker will not only document your build process, but it will also give you a Docker image you can easily deploy to production or run locally.

Outside the Box – Outsourcing Your UX Design

Thu, 27 Jun 2019 05:49:20 GMT

Outsourcing is such a dirty word. Unbearable customer service, subpar manufacturing, and corporate downsizing all come to mind when you hear it. But outsourcing has gotten a bad rap.