YashMandiyashmandi.hashnode.dev·Apr 21, 2024Mastering Chakra UIIntroduction Chakra UI emerged as a game-changer in the realm of React development, offering a rich library of customizable components to streamline UI creation. Founded by Segun Adebayo, Chakra UI made its debut as an open-source project aimed at si...DiscussReact
Opemipo Disucoderoflagos.hashnode.dev·Mar 19, 2024MightyMeld + Next.js: The Perfect Duo for Component CreationThere are so many accessibility tools coming into the frontend space; it's a thing that's been evolving rapidly in recent years. Tools that utilise the JAMstack (mostly) have been the most visible form of accessibility in frontend development. In thi...Discuss·11 likes·101 readsFrontend Development
Emiliogetemilio.hashnode.dev·Feb 24, 2024How to load and render Markdown files into your Vite React app using TypescriptBackstory (skipable) Ok so I was REALLY struggling with this one. I’m building an app, and for ease of use and maintenance, for the terms and conditions, privacy policy and other stuff I wanted to write them in markdown instead of plain TSX. I could ...DiscussReact
Catherine Anokwurucatihuoma.hashnode.dev·Jan 24, 2024Exploring Styling with Chakra UIChakra UI is a React component-based library that provides a set of accessible, reusable, and customizable components for building user interfaces. It was developed by Segun Adebayo. Chakra UI leverages Styled System to handle styling with Emotion se...Discuss·2 likes·56 readsstyled-components
Ayush KumarforFrontend UI/UX - Noteskrayush1109-ui.hashnode.dev·Nov 7, 2023Chakra UIChakra UI Documentation 1. Installation npm i @chakra-ui/react @emotion/react @emotion/styled framer-motion 1.2 📄 package.json - dependencies { "name": "chakra-ui", "version": "0.1.0", "private": true, "dependencies": { "@chakra-ui/icon...DiscussCSS-FrameworkChakra-ui
Deepak Kumariamchitti.hashnode.dev·Aug 13, 2023Chakra UI ExperienceI've been utilizing Chakra UI on several projects both personal and org level large projects. So, whatever I'll be sharing is based on my experience :). Feel free to comment and let me know what are your experiences with Chakra UI. Introduction Chakr...Discuss·30 readsReact
Raif Shareefraif.hashnode.dev·Jul 19, 2023Building a landing page hero with Vue-Chakra-UI design systemI just finished a short course on "how to use a design system in code" by Design System University [2]. This post is for documenting what I've learned and putting it into practice. We'll go over putting together a super simple landing page header sec...Discuss·89 readsDesign Systems
Favour OgbondaforOpen Replay's Technical Blogopenreplay.hashnode.dev·Jul 18, 2023Creating A Weather app With Next.jsIn this article, you will learn how to create a weather forecast app using Next JS and Chakra UI. The app will use the OpenWeatherMap API to get its weather forecast, time and date, and the icons needed. To start the project, you must have an OpenWea...DiscussOpenReplay
Odafe Alaiyaodafe.hashnode.dev·Jun 28, 2023Demystifying Chakra UIIn the fast-paced world of web development, it becomes imperative for web developers to not only deliver fast, captivating sites but the speed of delivery of these sites cannot be over-emphasized. This is where Chakra UI comes in, offering a powerful...Discuss·14 likes·161 readsReact
James CotterforPerformio Engineeringengineering.performio.co·Jun 27, 2023Deciding on a React Component LibraryOne of the exciting new projects we’re currently working on at Performio is our design system, Electric. The primary goal for this project is to decrease the time to market on new development, so from an engineering perspective, we have decided that ...DiscussDesign Systems