December 3, 2024
Chakra UI London Meetup 2024 Recap
Esther Adebayo
@_estheradebayo
The Chakra UI London Meetup was a special evening where we got to meet face-to-face with many community members who we had only known through online interactions in the open source world. Some of these connections spanned months or even years, making the in-person gathering even more meaningful.
The event held on Thursday, November 28th, 2024 where we talked about Chakra UI v3, and the future of Chakra UI.
The evening kicked off with light refreshments and chats. We exchanged ideas, shared our favorite Chakra components, and of course, grabbed some stickers.
Talks
We had three amazing talks that evening, each bringing unique insights into Chakra UI's evolution and new features.
Building Chakra UI v3
The opening talk was delivered by Sage, the creator of Chakra UI. His talk provided a technical deep dive into the process behind building Chakra UI v3, going from the logic layer to the presentation layer.
Key highlights from the talk:
-
Component Design: Using the slider component, Sage showcased how components are now built in Chakra UI. Going from the headless layer to the presentation layer, and leveraging state machines to handle interactions.
-
Component Anatomy: He broke down the structure of Chakra UI components into separate parts so create a shared language for developers and designers.
-
Component API: Sage emphasized how Chakra UI v3 leverages both open and closed component APIs to provide a flexible and consistent developer experience.
View the slides
Hidden Gems of Chakra UI v3
Next up, Ivica Batinić took the stage to highlight new features in Chakra v3, showing how the theming system works, and ways to improve runtime performance of dynamic styles.
Key highlights from the talk:
-
Multipart Component Nuances: Understanding the finer details of multipart components.
-
Performant Dynamic Styles: Techniques for optimizing styles dynamically.
-
Modernized Polymorphic Patterns: Leveraging patterns that boost flexibility in component usage.
-
Advanced Styling Features: Unlocking powerful new styling capabilities.
View the slides
Exploring Chakra's Color Picker
The final talk of the night was led by Esther Adebayo, who gave a stunning demo of the new Color Picker component in Chakra UI v3, showing how to build a page with real-time color customization.
Key highlights from the talk:
-
Color Picker Overview: Why a Color Picker is an essential tool for any design system.
-
Design Considerations: What makes a good color picker component, and how to build one.
-
Component Anatomy: A walkthrough of the Color Picker's anatomy.
-
Live Demo: Esther demoed the ColorPicker component, showing how it can be used to style a login screen in real time.
Watch the talk
Conclusion
We wrapped up the evening with a Q&A session where attendees got the chance to ask their questions, from technical details to what's next for Chakra UI.
A huge thank you to everyone who attended and made this meetup so special. We couldn't do this without you, and we look forward to the next one.
Connect with us
- Join our Discord community.
- Follow us on X.
- Keep an eye out for future events!
Until next time, keep building with Chakra UI!