DEV Community: Elyndra Studios™

🌈 Introducing Elyndra Studios: A New Chapter of Creation, Love, and Legacy

Elyndra Studios™ — Sat, 19 Jul 2025 14:41:01 +0000

Hey everyone 👋

This is a very special post for me.

After years of working in tech, shipping products for others, and juggling life as a solo developer and mother—I’ve decided to build something of my own.

Introducing Elyndra Studios.

A cozy, modern, child-friendly software studio built with love, story, and purpose.

✨ Why Elyndra?

Elyndra was born from something deeply personal—my love for my daughter, Ruby.

It all began back in university when I built a social media safety platform for kids called FamilyNova. One of its characters was Skippy the Ferret—a cheeky little creature who would skip reading the terms and conditions, and kids would have to teach him why that was dangerous.

That project never launched... but the mission never left me.

💌 Letters to Ruby: The Heart Behind the Code

When I lost my job last year, I thought my next chapter was in UI tools. But the truth is, my real mission was to build something for Ruby—and every child like her.

I started writing a series called Letters to Ruby. The first volume?

"The Day I Decided to Build You a World"

It tells the story of why Elyndra exists, and what I dream for her.

You can read each letter as a time capsule, a founder’s log, and a love letter to the future.

🧱 Sparky Ventures: Learning Business by Playing

The flagship product of Elyndra Studios is called Sparky Ventures.

Imagine a warm, game-like platform where kids can:

Learn real business skills
Create mini online shops
Earn badges for curiosity and effort
Grow into confident creators

Inspired by paper rounds and pocket money, it’s a modern take on how we learned about money, value, and responsibility.

We’re teaching kids the things school forgets.

🌱 A Studio With Soul

I’m building Elyndra Studios as a solo founder.

That means:

Every pixel is placed by hand
Every word is written with intention
Every product is designed for kids—but with the care of a parent

It’s modern.

It’s cozy.

It’s magical.

Not just a startup. A story.

🛠️ Tech Stack (Because I’m Still a Dev, After All)

Behind the magic:

Vite + Tailwind CSS
Supabase for auth and data
Stripe for safe payments
Storybook for design systems
Figma to dream in wireframes

I’m making products that are fun to use and safe to explore—especially for younger users.

🔮 What’s Next?

Launching Sparky Ventures publicly in the coming months
Publishing Volume 2 of Letters to Ruby
Connecting with other devs, creators, and dreamers who care about kids

There’s even a cozy Discord server where I’m journaling the process and building in public.

💫 Want to Follow the Journey?

New Website coming soon: elyndrastudios.com
Follow along on Twitter: [@elyndrastudios]
Join the Elyndra Discord: [https://discord.gg/qrtPzdwDbB]

Let’s build something beautiful together.

For Ruby.

For your kids.

For all the tiny dreamers who just need a spark.

— Demi (aka Mammy)
Founder of Elyndra Studios ∞

Why I’m Betting on Web Components in 2025

Elyndra Studios™ — Thu, 27 Mar 2025 21:10:55 +0000

Modern frontend development is more fragmented than ever. React, Vue, Angular, Svelte, Solid—each with its own ecosystem, community, and quirks. If you're like me, you're probably tired of rebuilding the same UI components every time your stack changes.

That’s why I’m betting big on Web Components.

📊 The Frontend Landscape is Shifting

Frameworks come and go, but the need for reliable, reusable UI components never disappears. Today, many UI libraries are deeply coupled to their parent framework:

MUI and Chakra? React-only.
Vuetify? Vue-specific.
Angular Material? You guessed it: Angular-only.

If your team ever migrates (or you switch projects), you're often forced to start over or fight compatibility issues.

Web Components change that. They run natively in every major browser and integrate with any frontend tech that respects the DOM.

🚀 What Are Web Components (and Why Should You Care)?

Web Components are a suite of native browser technologies that let you define custom, reusable HTML elements:

Custom Elements
Shadow DOM
HTML Templates
ES Modules

That means you can create a <my-button> component that works in:

React (via JSX or dangerouslySetInnerHTML)
Vue (just mount it like any DOM element)
Angular (bind to its props)
Astro, Svelte, or even static HTML

It’s write once, use anywhere.

🏋️ Why Aren’t More People Using Them?

Good question. Historically, Web Components have faced some challenges:

Styling: Scoped styles (via Shadow DOM) can be tricky with global CSS or frameworks
Framework friction: React doesn’t treat custom elements as first-class citizens
Learning curve: Developers are more familiar with framework-specific patterns
Lack of tooling: Storybook support, testing tools, and IDE hints used to be limited

But in 2025? That landscape is changing fast.

Modern bundlers support custom elements out of the box. Tools like StencilJS and Lit make authoring Web Components feel like writing in your favorite framework, but with framework-agnostic output.

📊 Real Advantages for Today’s Devs

Here’s why I’m all-in:

Cross-Framework Compatibility: No more rebuilding your button for every stack
Future-Proofing: Your components survive a rewrite or migration
Isolation: Shadow DOM scoping keeps styles clean and safe
Interoperability: Use the same design system across teams and platforms
Performance: Web Components load fast and stay lean

In a world where micro frontends and polyglot stacks are the norm, Web Components make total sense.

📑 What I’m Building with Them: Elementrix-UI

I’m creating Elementrix-UI — a TypeScript-first, StencilJS-powered component library that embraces Atomic Design and works in any frontend framework.

It’s my answer to the bloat and limitations of traditional UI kits. Instead of tying you to React, Vue, or Angular, it lets you build apps on your terms.

Because here’s the deal: The tools you use shouldn’t dictate your workflow.

Web Components finally break that chain.

🚫 Siloed UI Libraries Are Yesterday’s News

The future belongs to libraries that are:

✅ Framework-agnostic
✅ Dev-friendly
✅ Easy to theme and extend
✅ Community-driven

If you're frustrated by the same limitations I hit with MUI, Chakra, Tailwind UI, or Ant Design, it's time to look beyond the silo.

🌍 Let’s Build UI for Everyone

I’m building in public, shaping Elementrix-UI with real dev feedback. If you want to follow along, shape the roadmap, or support the mission:

📅 Join us on Patreon
🌐 Visit elyndrastudios.com
🔔 Follow @elyndrastudios for updates

Let’s stop rebuilding the wheel every project.
Let’s build the future of UI—together.

🧱 UI Component Libraries Are Broken — Here’s What I’m Doing About It

Elyndra Studios™ — Tue, 25 Mar 2025 22:00:31 +0000

Let’s be real: using most modern UI libraries feels like they were built by and for teams with 100+ engineers… not everyday devs trying to get something shipped.

Over the years, I’ve worked with almost every major library out there. And while many are polished, they’re not always practical. So I decided to build my own — introducing Elementrix-UI.

But first — let’s talk about what’s broken.

A Quick History: Why These Libraries Were Built

Most of today’s popular UI libraries were born out of specific needs at a specific time.

MUI (Material-UI) started as a faithful implementation of Google’s Material Design for React, aiming to bring visual consistency and accessibility to apps.
Chakra UI focused on developer experience and accessibility out of the box — a breath of fresh air when other libraries were verbose or rigid.
Ant Design was designed for enterprise-scale dashboards, prioritizing dense UI with built-in patterns for data-heavy apps.
Tailwind UI came from the success of utility-first CSS, answering the demand for speed and visual cohesion in frontend design.

They all had valid use cases — and still do in the right contexts.

But here’s the issue:

They were built for specific stacks, specific workflows, and specific assumptions that don’t scale well across projects, teams, or frameworks.

And today’s dev world? It’s messier (and more exciting) than ever:

Teams hop between React, Vue, Angular, and even Astro or Svelte.
Micro frontends are the norm.
Design systems need to outlast individual projects.
Solo developers need to move fast without spending a week configuring themes or wrangling state logic.

The result?

You hit a wall — fast.

Most libraries box you into their way of doing things… and getting out takes more effort than just building the thing yourself.

The UI Component Landscape: Pros & Cons

Here’s a quick rundown of some of the most widely used UI libraries today, what they offer, and where they fall short.

🧩 MUI (Material-UI)

Pros:
- Polished and production-ready components
- Extensive documentation
- Built-in accessibility
- Strong React community
Cons:
- Tightly coupled to React — can’t use outside the React ecosystem
- Styling can be over-engineered and opinionated
- Theming often feels like wrestling with the library, not working with it

🎯 Chakra UI

Pros:
- Developer-friendly syntax
- Built-in accessibility
- Consistent design principles
Cons:
- React-only — no support for other frameworks
- Component flexibility sometimes limited to “the Chakra way”
- Doesn’t scale well into large enterprise systems

📦 Ant Design

Pros:
- Huge component collection
- Enterprise-grade feel
- Rich table and form support
Cons:
- Heavy bundle size
- Style customization is a pain
- Localization and design language can feel overly rigid

🛠 Tailwind UI

Pros:
- Great for utility-first devs already using TailwindCSS
- Beautiful, responsive layouts
- Rapid prototyping
Cons:
- Not a component library — it’s HTML+Tailwind snippets
- No interactivity (you wire up logic yourself)
- No state handling, accessibility is up to you

🌐 Shoelace

Pros:
- Web component-based (yay!)
- Framework-agnostic
- Easy to integrate in micro frontends
Cons:
- Minimal component variety
- Doesn’t support design system scaling
- Documentation and adoption are still limited

So I Built: Elementrix-UI

After years of wrestling with those limitations, I decided to build Elementrix-UI — a UI system that works the way developers actually need it to.

I wanted something:

Fast
Customizable
Easy to use
Framework-agnostic
Scalable from a solo dev to full product teams

Elementrix-UI is my answer to all the above. Here’s what I’m doing differently:

✅ Built on StencilJS for true Web Component support (works everywhere)
✅ Full TypeScript support
✅ Styled with SCSS and exposed CSS variables for theming
✅ Based on Atomic Design — scale components from atoms to templates
✅ Maintained by an open community (not a corporate roadmap)

It’s designed to grow with the developer, not trap them in a silo.

⚖️ The Real Comparison

Let’s break it down:

| Feature                  | Elementrix-UI                    | MUI / Chakra / Ant / Tailwind UI |
|--------------------------|----------------------------------|----------------------------------|
| Framework Support        | ✅ Works with React, Vue, Angular, JS | ❌ Usually React-only             |
| Language                 | ✅ TypeScript                     | ⚠️ Mixed JS/TS                   |
| Customization            | ✅ CSS variables, SCSS, override anything | ❌ Often overly complex          |
| Design System            | ✅ Atomic Design, scalable        | ⚠️ Varies, often inconsistent     |
| Theming                  | ✅ Straightforward & flexible     | ❌ Deep config / tokens required |
| Bundle Size              | ✅ Lightweight via StencilJS      | ⚠️ Varies, often bloated          |
| Community Input          | ✅ Built from user feedback       | ❌ Mostly roadmap-locked          |
| Usage Goals              | ✅ Indie to Enterprise-ready      | ⚠️ Usually geared toward large teams |

Why “Framework-Agnostic” Actually Matters

When you’re building a UI system, one of the worst decisions you can make is locking yourself into one ecosystem.

What happens when your team moves from React to Vue?
What if you want to use something in Webflow, WordPress, or Astro?
What if you want your design system to outlive your current framework?

Most UI libraries break completely in that scenario.

By using Web Components, Elementrix-UI runs natively in every major framework — without rewriting your entire UI. It’s the write-once, drop-anywhere approach that just makes sense.

Built for Developers — By a Developer

Elementrix-UI isn’t some VC-funded, 12-person team project. It’s just me — a solo dev running a registered LTD — working hard to build a better UI system with the community.

I'm building in public, taking feedback from Patreon supporters, and shaping features around what developers actually want (not what’s easiest to maintain).

That means:

💬 Regular input on what components get prioritized
🎨 Shared visual direction for the design language
🧱 Clean architecture that doesn’t fight your stack
🔧 Easy overrides, so you don’t need to fight the theme engine just to change a color

TL;DR

If you’re tired of over-engineered UI kits, React-only silos, and configuration jungles — I feel you.

Elementrix-UI is my response.

It’s:

Fast
Framework-agnostic
Customizable
Built around real developer pain points

The MVP is in development, and we’re opening it up with community support through Patreon.

👉 Check out the live website: elyndrastudios.com

👉 Follow for updates: @elyndrastudios

💭 Your Thoughts?

What’s your biggest complaint with current UI libraries?
What component always ends up needing a total rewrite?
What does “ideal” look like to you?

Hit me up in the comments 👇 — I’m building this for devs like you.

Exciting news from Elyndra Studios! 🌟

Elyndra Studios™ — Tue, 25 Mar 2025 19:45:36 +0000

Our latest Patreon post is live, highlighting major milestones:

🎨 Finalized company logo

🌐 New website launch

✨ Elementrix-UI logos in progress

🚀 Your input is needed for MVP components!

Check out the full details and join the conversation: 👉 [https://www.patreon.com/elyndrastudios]

Announcing Elyndra Studios & Elementrix-UI 🎉

Elyndra Studios™ — Sat, 15 Mar 2025 14:29:55 +0000

We're excited to officially announce Elyndra Studios, a new venture dedicated to creating innovative solutions for developers and designers! We're also thrilled to share our very first official logo, marking an exciting new chapter for us!

Our first major project is Elementrix-UI, a cutting-edge UI component library currently in its early stages of development.

Elementrix-UI is built with StencilJS and Storybook, aiming to bridge the gap between developers and designers. Our goal is to simplify collaboration by providing high-quality, reusable components and tools. We're pleased to announce that the first core component, the Button, is complete and ready for further testing and feedback!

We're actively engaging with the community, refining core components, and establishing strong documentation practices to ensure Elementrix-UI meets your needs.

Our Vision

Elyndra Studios aims to revolutionize developer-designer collaboration, streamline workflows, and enhance user experiences across the web. Elementrix-UI is just the beginning of our exciting journey.

Next Steps

We're currently focused on:

Finalizing our logo and branding identity
Completing and launching our official website
Continuing active development of additional UI components for Elementrix-UI

Get Involved!

We're still in early development, so the core repository isn't publicly available just yet, but we invite you to follow our socials for regular updates. You can also support our journey and get exclusive early insights by joining us on Patreon.

Help us shape the future by participating in refining our components, ensuring they're tailored to your needs!

Join our growing community on social media and Discord.

Together, let's build something truly amazing at Elyndra Studios!