July 2018 Summaries

Code snippets in VS Code are a valuable tool for developers, enabling quick insertion of commonly used code blocks across different programming languages. The text explains how to create custom snippets stored in JSON files, accessed through the User Snippets menu, which can greatly enhance workflow efficiency. It also delves into advanced features like dynamic snippets, tab stops, placeholders, and variable placeholders, allowing for more interactive and customizable coding experiences. Furthermore, the concept of polymorphic code snippets is discussed, illustrating how a single trigger can be used across multiple programming languages for similar tasks, thus reducing the need to remember numerous snippet triggers. This approach is highlighted as particularly useful for developers working in diverse coding environments, promoting reusability and efficiency while maintaining a streamlined workflow.

Progressive Web Apps (PWAs) are gaining traction due to their ability to blend the advantages of web and mobile applications, utilizing recent browser APIs to enhance user experience while avoiding platform lock-in. They offer several benefits, including offline functionality through service workers, app-like interactions, and the ability to be installed on a user's home screen without the need for a traditional app store. This article delves into the process of building a PWA, discussing key aspects such as responsiveness, connectivity independence, discoverability, and how service workers enable re-engagement through push notifications. It highlights the historical context of PWAs, noting Mozilla's contributions and the impact of Firefox OS experiments on the development of crucial APIs like service workers. The text also provides a practical example of a PWA implementation, emphasizing the importance of a web app manifest and detailing steps to ensure the application is responsive and connectivity-independent. Additionally, it discusses challenges related to caching strategies and the benefits of tools like Google's workbox-sw for managing service workers. The piece concludes by encouraging developers to enhance their web apps with PWA technologies and invites them to explore further resources and examples available on GitHub.

The post, part of a series titled "How CSS Works," explores the concept of z-index in CSS, a property that controls the stacking order of elements on a webpage's two-dimensional display. It elucidates that z-index can manipulate the paint order of elements, making them appear "closer" or "farther" from the user, but this only applies to elements with a position other than static and within their respective stacking context. The article explains that stacking contexts can be created using various CSS properties, such as position values or opacity, and highlights the potential confusion arising when elements display in unexpected layers due to local stacking contexts. By understanding these nuances, developers can apply z-index more predictably in multi-layered UIs, avoiding common pitfalls and ensuring the desired display order of elements.