How to Create a Component Library with Storybook and Stencil
Learn how to build a robust component library using Stencil and Storybook π. From initializing your project π οΈ to designing atomic-level components βοΈ, all the way to complex organisms ποΈ. This guide walks you through each step of building a project with storybook. Enhance reusability and maintainability while enjoying real-time previews of your components π₯οΈ . Explore Storybooks way of dealing with accessibility βΏ and export your project for multiple frameworks. Perfect for teams looking to streamline their UI/UX development workflow π. Start crafting your component library today! π
Implement Ports and Adapters in a Hexagonal Architecture with NodeJS and MongoDB
π Learn how to build a robust application with Hexagonal Architecture using πPort & Adapters design pattern in NodeJS, MongoDB, and TypeScript! π Discover how to separate business logic from external dependencies, ensuring modularity & flexibility. π¦ Embrace clean code practices with decoupled components for smoother development and maintenance. π» Dive into NodeJS to power your backend, MongoDB for data storage, and TypeScript for type safety. π Level up your architectural skills and create scalable, testable, and maintainable applications!
Testing Cached Data with Redis, NodeJS, and Jest through Docker Test Containers
Testing cached data can be tricky π but tools like Redis, NodeJS, Docker, Jest, and Testcontainers make it easier! π By using Docker to spin up a Redis container for each test, you get a clean π§Ό cache instance. Jest allows you to write unit and integration tests π§ͺ to validate caching logic and interactions with Redis. Testcontainers handles container management behind the scenes. Ultimately, this stack lets you test real-world caching scenarios β thoroughly and consistently across environments. π So if you need to test your app's caching capabilities, this combo has you covered! πͺ
Mono & Msa : Front 5. Single Spa
Iβve been thinking β¦ π, why introduce micro front-ends without showing any implementation? π Well, this week, Iβve got just the news for you !!! π° Letβs embark in the implementation adventure π of micro front ends with the help of a popular tool called Single Spa ! π« Single-Spa removes the complexity in setting up a micro front end app by scaffolding the entire process !!! π This technology allows us to build and connect multiple Single Page Applications (SPAs) and provides a way so that they can interact, communicate and function seamlessly together π€ (even on one page π) Pretty cool, right ? I guess thereβs βοΈ thing left to do. Come read and code with me with the link below β€΅οΈ click on the article β‘οΈ
Mono & Msa : Front 3. Turborepo
Such a busy week ! π¨ but as promised, let's explore the next article in the front end section of this series π₯ This week, we will follow the next π£'s of our previous article on Monorepos!In this article, we will dive into the implementation of a Monorepo with the use of a technology called Turborepo ππ½ββοΈ But wait! What's Turborepo all about? Turborepo is a monorepo tool that helps eliminate build & pipeline related issues often found in monorepos by providing an efficient deployment mechanism and package management system β‘οΈ Let's take a look π ‡οΈ
Mono & Msa : Front 2. Monorepo
Oh, Hey Devs! βοΈπ» Happy new years to you & long live these holidays ππΎ As weβre rolling into a brand-new year, filled with new technologies to digest and thrown at our projects everyday like hot potatoes π₯, we might be tempted to include anyone of them that we can get our hands on just to gain a little more structure! What about resisting the temptation ? ^^ It turns out I may have some tech to share with you thatβs long been with us, has been known to be reliable, scalable and easy to implement! and guess what? you donβt even NEED to add yet another library just to have it!Howβs that for a 2023 project resolution. π Now hear me out, it might not be for every project but for the ones that are constantly scaling, youβll find it to be the perfect fit for you. Enters - The Monorepo! π°A dynamic and customizable structure for your codebase so your vision and team can benefit on more flexibility and even more speed!In this article, weβll dive into what monorepos are all about and how to implement one in our own project! Happy reading and see you next week for the next article in this front-end architecture series π click on the article β‘οΈ