January 2021 Summaries

The Vue watch API is a powerful tool for tracking reactive data changes and performing operations when those changes occur. It can be used with either ref or reactive values, offering flexibility in how it's applied. The key to using the watch API effectively is understanding its nuances and behavior depending on the type of data being watched. For simple data types like numbers, strings, and booleans, watching a single ref involves passing the ref as the first argument to the watch API with a callback function that applies side effects to the data. However, when dealing with complex data types like arrays and objects, additional considerations are necessary. To deeply watch nested arrays and objects, a deep copy of values may be required, using utility functions like lodash.cloneDeep. Additionally, watching multiple refs can be achieved by passing an array of refs to the watch API. The watch API also offers an optional third argument, "deep," which extends its functionality to keep track of deeply nested values. When watching reactive objects or arrays, it's often recommended to use lodash to ensure tracking both previous and current values.

Netlify is expanding its `Build Plugins` feature, allowing plugins to run custom automated tasks at different stages of the build-deploy lifecycle, including after a successful site deploy (`onSuccess`) and at the very end (`onEnd`). This enables new plugin capabilities such as crawling live deploy URLs, running performance audits, sending timely deploy data, testing Netlify Functions responses, and quicker access to Deploy Previews. The feature is now available for customers to install or create their own plugins, with opportunities for feedback on future features.

Netlify Functions provides a way to utilize serverless functions in Angular applications, managing infrastructure and creating a wrapper around AWS Lambda functions for easier use. To set up a Netlify Function, developers need to create a bare-bones function with parameters such as event and context, which can be used to pass data and retrieve information about the request. The function can return a promise with an HTTP status code and body, allowing for dynamic data display on the page. With Netlify Dev, developers can test their functions locally without deploying, and once set up, they can deploy their project to Netlify and see their live site's dashboard and logs.

Netlify has announced the general availability of Build Plugins, allowing developers to automate workflows and run plugins on top of Netlify's CI/CD infrastructure. The most popular plugins include Gatsby Cache for build speed improvements, Submit Sitemap for automatic sitemap submission, Image Optim for image optimization, Next on Netlify for building and deploying Next.js applications, and Lighthouse for performance audits. With an expanding catalog of available plugins and integrations, developers can optimize their websites for search, accessibility, and performance. The latest list of top 10 build plugins highlights the growing popularity of framework-specific plugins and emphasizes the importance of optimizing performance, search, and accessibility in web development.

This is a neutral, objective, and interesting summary of the text: Jamstack, a key concept in building websites, focuses on pre-rendering the entire front-end at build time and serving static output from a content delivery network (CDN). .NET developers can leverage tools like Statiq to generate static sites with dynamic functionalities. Statiq is a popular option for .NET developers, providing a first-class experience with Visual Studio and VS Code integrations. It uses modules and pipelines to process documents, which are immutable units of information that consist of content and metadata. A pipeline consists of one or more modules, each performing a specific action on the document. Statiq can be used in conjunction with headless CMS Kontent for fetching and rendering content. By publishing the site on Netlify, developers can take advantage of its built-in features, such as preview functionality and deployment tools. The tutorial provides a step-by-step guide to building a static site using Statiq and Netlify, covering topics from creating input files to integrating content from Kontent.

Netlify's career development framework is designed to support both individual contributors and managers, with two distinct tracks that allow individuals to move between them as opportunities and interests align. The framework emphasizes the importance of values, technical skills, and leadership skills for all employees, regardless of their level or role. It also introduces a 3x3 matrix to guide career development, with increasing complexity of work items, expanding Sphere of Influence, and growing Multiplier Effect. This framework is designed to promote growth, objective feedback, and collaboration among team members, and provides resources such as education stipends and coaching to support employee development.

This is a deep dive into the development of the Algolia Netlify plugin, an easy-to-set-up search experience that allows users to add Algolia search functionality in just a few lines of code. The goal was to provide a smooth user experience by leveraging existing Algolia products and integrating them with Netlify's build process. The plugin uses the Search API, Crawler, Autocomplete.js UI library, and OAuth2 authentication to create an Algolia account for users, crawl websites, extract content, and display search results using a pre-packaged UI. The development of the plugin involved creating a generic solution that could handle most websites without requiring code or advanced configuration, and took into account the unique challenges of extracting content from different website structures.

Netlify's Developer Experience Engineering team has been exploring ways to improve collaboration on a 100% remote distributed team. They've found that mob pairing, where multiple team members work together on code, can facilitate easier problem-solving and asynchronous collaboration. This approach has helped them learn from each other despite the challenges of working remotely, offering a reprieve while still fostering growth and teamwork.

The Composition API is a new way of writing and organizing code for building Vue applications, offering flexibility around how code is written while maintaining legibility, readability, and ease of maintenance. It provides reactive and ref helper methods to make data reactive, allowing developers to create more dynamic and interactive user interfaces. The API also includes computed properties, which can be used to calculate values based on dependencies, making it easier to perform complex calculations and updates. Additionally, the Composition API allows developers to define methods, which are regular functions that can be called from the template, and serverless functions, which can be used to run server-side operations without maintaining a dedicated server. The Composition API is particularly useful for building dynamic Jamstack applications, where serverless functions can be used to perform server-side operations such as authentication, validation, and data storage.

Background functions are available on Pro plans and above, providing a way to run processes in the background while the user resumes their flow. They are useful for tasks such as generating reports, scraping data from websites, and batch processing scripts. Background functions work by invoking an asynchronous function that runs separately until it completes, with the server returning a 202 response to indicate whether the invocation was successful or not. To create a background function, simply append -background to the filename of your serverless function, and export a handler function as you would for a standard serverless function. Background functions differ from traditional serverless functions in that they do not return additional responses about code execution success or failure, but instead rely on monitoring elsewhere to track issues.

The Developer Advocacy team at Netlify has shifted from a traditional advocacy role to a hybrid model that combines engineering work with community engagement. This change was made to address the misconception that developer advocates were either purely communicators or engineers, and to create a more empathetic and effective team. The team now consists of three parts: Integrations Engineering, Developer Experience Engineering, and Documentation. The Integrations Engineering team focuses on building plugins and integrations for popular frameworks, while the Developer Experience Engineering team works closely with Product Engineering to ensure quality and end-to-end support for customers. The Documentation team is also part of the hybrid model, focusing on creating high-quality documentation that supports developer experience. The team's Objectives and Key Results (OKRs) include qualified signups, active developers, engineering throughput, and career advancement. The department values systems thinking, empathy, and transparency, and strives to build a holistic approach to developer experience.

We have launched a free learning platform called Jamstack Explorers, which is built on the tech used to create it. The team recorded a podcast discussing the tech and workflow behind the project, sharing their knowledge with users. The podcast aims to make the content remotely interesting for listeners.