Skip to content

Frontend JS stack with Vite + WindiCSS + HeadlessUI; Intro to Svelte

Photo of Jeremy Zerr
Hosted By
Jeremy Z. and Andrew C.
Frontend JS stack with Vite + WindiCSS + HeadlessUI; Intro to Svelte

Details

Hello everyone! It's been a while but excited to get the meetup back up and going. Meetup will be hosted at space in the basement of the Bacon building hosted by Cognitics, Inc. Enter through the door that faces Idaho street, downstairs, go to the left of the big bank vault doors and we'll be right there on the left.

Meetup Schedule:

6:00 - 6:15: Pizza and drinks hosted by Zerrtech.

6:15 - 6:45: Frontend JS stack with Vite + WindiCSS + HeadlessUI - Brendan Tierney @ Reddit

Here is some cool OSS tooling I've been using and loving recently around Web Dev stuff for my personal projects:

  • Vite + Vitest (https://vitejs.dev/ https://vitest.dev/): Webpack alternative that uses ESBuild and other tooling under the hood to build web apps wicked fast. Also has solid out of the box configurations and is cross-framework compatible. Vitest is a Vite version of Jest that is even faster than Jest.
  • PNPM (https://vitest.dev/): Yes -- another Node.js package manager. However this one is built using really solid foundations and is super fast. Has built-in monorepo support (fantastic since Lerna is no longer a maintained project) and doesn't have the "drama" of the Yarn 2 vs Yarn 1 / 3 ecosystem issues. Also includes really nice default configuration for things like peer dependency checks.
  • WindiCSS (https://windicss.org/): A Tailwind-like CSS library. This did just-in-time builds before Tailwind 3. Has fantastic support for Vite and faster build times than Tailwind. Also have had much better development experience with HMR reloads.
  • HeadlessUI: https://headlessui.dev/ Components that do not have opinions on the rendering or styling, but contain just the JavaScript and Accessibility goodies. Pair this up with WindiCSS / Tailwind and you can have the advantages of a library like MUI / Bootstrap, without battling against the styling opinions of those and other web UI libraries.

6:45 - 7:15: Intro to Svelte and Friends - Sean Timm

Svelte is a UX compiler that converts declarative components into imperative code that surgically updates your DOM. After coming off a 5 year tour of duty with React, I spent the last year with Svelte and loved it. I’ll take you on a brief tour of Svelte, the supporting project SvelteKit, and several other rabbit trails as we explore this new framework together!

7:15 - 7:30: Lightning Talks & Wrap Up

7:30 - ?: Post-meetup at Taphouse

Lightning Talks:

We will have Lightning talks where anybody can come up and share what kind of Front-end programming frameworks, work projects, side projects, things you have learned or have been working with over the last month. These presentations do not need slides, or code examples, but they never hurt.
Presentations are timed and should be less than five minutes. Think of it like an open mic night. This will allow us to see what kind of cool stuff people are working on, know who might have expertise in a particular area, and will allow us to determine what kind of topics might be interesting for others in the future. We've also found that it helps to encourage those who don't normally present to make their way to the front of the room.

Wrap Up:

This is where you, yes you, get to propose topics for presenters to choose for the next meetup. We're also open to taking feedback about what we can do to improve the meetup during this time. Remember, this is your meetup, you can make it what you want it to be!

Photo of Boise Front-end Development group
Boise Front-end Development
See more events
121 N 9th St
121 N 9th St · Boise, ID