Latest Tutorials

In this capstone tutorial, we're going to actually use the micro-library in app code so you can see how the micro-library makes things easier for developers in real world development. In the previous steps of this 4-part tutorial, this is what we accomplished: In this final tutorial, we will now refactor an example component to use the @Component decorator and the attachShadow function from our micro-library.

As we covered in the previous tutorial , a micro-library helps developers implement common features more quickly than using the web APIs directly. Now in this tutorial, we will code our class decorator that allows our classes to instantly gain new features without writing the code for them every time. The class decorator eliminates boilerplate and allows users of the micro-library to focus on higher-level concepts while delegating common class setups to the micro-library. Implementing a class decorator is going to significantly improve the developer experience, allowing developers to code Web Components faster. We'll enhance the class-based implementation which custom elements rely on by cleaning up each constructor .

Welcome to the LLM model that's been absolutely everywhere on the Internet and news headlines in recent days – DeepSeek-R1! In this article, we take a comprehensive look at this new, industry-disrupting LLM. We'll investigate if it’s truly deserving of all the noise around it, or if there's something (i.e. censorship and GPT-4 references) more sinister going on beneath the buzz. So, brew some tea and settle in, because this is going to be an interesting ride. We're going to cover:

Accessibility is a cornerstone of good design, and color contrast plays a significant role in making content readable for everyone. Whether your users have visual impairments, color blindness, or are simply viewing your website under challenging lighting conditions, high-contrast themes are essential. In this blog, we’ll explore how to use shadcn/ui and Tailwind CSS to build a high-contrast theme that complies with WCAG standards. With tools like shadcn/ui , creating accessible, visually appealing designs is simpler than ever. Good contrast ratios ensure that text and UI elements are distinguishable from their backgrounds. The Web Content Accessibility Guidelines (WCAG) recommend:

Accessibility is not just a legal or ethical obligation—it’s an opportunity to improve the user experience for everyone. One of the easiest and most impactful ways to start is by implementing proper alternative (alt) text for images and other media. With tools like shadcn/ui , which is built on Radix Primitives and Tailwind CSS , you can take accessibility to the next level by creating user-friendly, accessible interfaces. In this blog, we’ll explore how to enhance accessibility with alt-text, then dive into how shadcn/ui can help you implement accessibility best practices with code examples. Alt-text describes the content or function of an image. For users with visual impairments, screen readers use alt-text to provide context. For example, consider an e-commerce website selling plush toys: