Simplifying Slinkity

Episode Description

Anthony Campolo introduces Slinkity, a tool combining Eleventy and Vite to bring React, Vue, and Svelte interactivity to static sites using islands architecture.

Episode Summary

Anthony Campolo returns to JavaScript Jabber to discuss Slinkity, an alpha-stage project created by Ben Holmes that bolts Vite onto Eleventy, enabling developers to use React, Vue, or Svelte components within otherwise static sites. The conversation traces the lineage from Jekyll to Eleventy as JavaScript's answer to Ruby-based static site generators, then explains how Vite's use of Esbuild for development and Rollup for production builds delivers dramatically faster feedback loops. Anthony draws frequent comparisons to Astro, arguing that Slinkity's advantage lies in leveraging Eleventy's existing ecosystem of plugins, templates, and its new serverless capabilities rather than building a compiler from scratch. The panel spends significant time on the islands architecture concept popularized by Jason Miller, where only the interactive portions of a page receive JavaScript hydration, reducing the uncanny valley between visible content and clickable content. Anthony details Astro-inspired client directives like load, idle, and visible that control exactly when components hydrate, and credits eBay's Marko framework as an early pioneer of partial hydration. The discussion also covers practical deployment on Netlify, Vercel, and Cloudflare Pages, CMS integrations, full-stack possibilities using Eleventy serverless functions, and Slinkity's appeal as a learning tool that lets beginners start with plain HTML and progressively adopt framework complexity only when needed.

Chapters

00:00:00 - Introductions and What Is Slinkity

The panel introduces themselves and welcomes back Anthony Campolo, who now works as a developer advocate for StepZen. Anthony sets the stage by explaining that Slinkity is a project combining Eleventy and Vite to bring dynamic client-side interactions to static Eleventy sites, positioning it within the emerging breed of tools influenced by the islands architecture pattern.

Anthony notes that if listeners have heard of Astro, they already have useful context for understanding Slinkity's goals. He emphasizes his enthusiasm for the project and its place in a broader trend of rethinking how static site generators can incorporate modern JavaScript frameworks without abandoning the simplicity and speed that made them appealing in the first place.

00:03:04 - Eleventy's Origins and the Rise of Vite-Powered Build Tools

Charles draws a connection to similar trends in the Ruby world with Bridgetown and Jekyll, and Anthony explains that Eleventy was created as a JavaScript-native alternative to Jekyll. The panel discusses the speed advantages of running static site builds in Node versus Ruby, and Anthony extends the performance conversation to Go-based tools like Hugo and the trend of rewriting JavaScript build tooling in systems languages like Go and Rust.

Anthony then explains that Eleventy's limitation is its reliance on traditional server-rendered template languages like Nunjucks and Liquid, which don't accommodate component frameworks like React or Vue. This gap is exactly what Slinkity addresses. He introduces Ben Holmes as the creator, shares the lighthearted origin of the name, and explains how Ben was inspired by Astro's multi-framework approach but wanted to build on Eleventy's already stable foundation rather than starting from scratch.

00:08:42 - Islands Architecture and Partial Hydration Explained

Anthony introduces the islands architecture concept, crediting Jason Miller's influential blog post and drawing a parallel to the "sprinkles of JavaScript" philosophy. The core idea is delivering pages as mostly static HTML and only hydrating small interactive components where JavaScript is actually needed, rather than shipping an entire framework runtime for every page.

He uses Ben Holmes' food metaphor of salads versus heavy meat to illustrate the balance between lightweight HTML and heavier JavaScript components. The discussion connects to Astro's client directives—load, idle, visible, and media—that give developers granular control over when and how components hydrate, reducing the uncanny valley between content being visible and actually interactive that Addy Osmani and others have written about extensively.

00:15:02 - Framework Support, Renderer Plugins, and JavaScript Fatigue

Charles asks whether Slinkity dictates a specific front-end framework, and Anthony explains the renderer plugin system modeled after Astro's approach. React support came first due to popularity, with Vue and Svelte renderers actively in development. The conversation touches on how shared syntax between frameworks like React and Solid can reduce implementation effort.

Anthony acknowledges the JavaScript fatigue problem that comes with so many competing tools and frameworks, recalling his own confusion as a newcomer trying to distinguish Gatsby, Next, Nuxt, and others. He argues that the complexity of wiring up multiple frameworks should be the framework author's burden, not the end user's, and that developers should ideally just drop in a configuration and start writing in their preferred tool without deep knowledge of the underlying build plumbing.

00:19:10 - Vite's Build Pipeline and Developer Experience

Anthony explains why building on Vite is so valuable, particularly its embrace of ESM and its ability to handle bundling and stylesheet loading seamlessly. He describes Vite's architecture where Esbuild handles fast file transformations during development while Rollup provides battle-tested production bundling, giving developers the best of both worlds.

The key selling point is the dramatically fast hot module replacement during development, where saving a file produces near-instant feedback. Anthony argues this rapid feedback loop is transformative for productivity and hard to appreciate until experienced firsthand, noting that even small delays compound over time. He highlights that Vite has captured enough ecosystem mindshare to become the first tool since Webpack positioned to work for essentially any JavaScript use case.

00:23:26 - Deployment, Serverless Functions, and Full-Stack Possibilities

Charles asks about deploying Slinkity to platforms like Netlify and Vercel, and Anthony explains that it's straightforward since deployment just requires specifying a build command and publish directory. He notes compatibility with Netlify, Vercel, and Cloudflare Pages, and mentions the Jamstack deployment model where these conventions are well established.

The conversation expands into full-stack territory as Anthony describes Eleventy's new serverless plugin for integrating with Netlify functions. He discusses building GraphQL-powered Slinkity examples that require API key management on the server side, pointing to a larger vision where Slinkity isn't just for static blogs but can support dashboards and applications with persisted data using backend services like Supabase and Railway.

00:31:11 - Deep Dive into Partial Hydration and Performance Trade-offs

Anthony traces the intellectual history of partial hydration back to Jason Miller's 2020 blog post and Google's research comparing different rendering modes—from full server rendering to full client-side rendering. He explains the tension between time to first byte and time to interactivity, and the uncanny valley where users can see content but can't interact with it.

The discussion highlights why Preact features prominently in this space due to its lighter bundle compared to React, and credits eBay's Marko framework as an early pioneer of partial hydration techniques dating back to 2014. Anthony argues that the community is now recognizing years of prior work on shipping less JavaScript and being more intelligent about when and how interactivity is delivered to users.

00:37:32 - React's Role, Developer Habits, and Progressive Complexity

Charles shares his experience at a previous employer debating between Hotwire/Stimulus and React, noting that backend rendering often proved faster and lighter. Anthony admits that much of React's dominance comes from developer familiarity rather than technical necessity, acknowledging that pre-React tools could accomplish similar results.

The panel discusses Slinkity's appeal as a learning tool, with Anthony explaining Ben Holmes' vision of a system where beginners can start with plain HTML and CSS, then progressively layer in React or other frameworks as their skills grow. The portfolio website use case illustrates this well—mostly static content with small interactive elements like contact forms that don't require configuring Webpack from scratch.

00:44:48 - Community Resources, JavaScript Fatigue, and Practical Advice

Anthony directs listeners to community resources including the Slinkity website, GitHub repository, awesome-slinkity collection, and the Eleventy Discord channel dedicated to Slinkity. He invites contributors, particularly those passionate about Vue or Svelte who could help push those renderer plugins to completion.

Steve reflects on the fascinating open-source cycle of tools emerging to bridge the gap between monolithic and fully decoupled architectures. Anthony acknowledges the XKCD "competing standards" problem but encourages developers to simply try Slinkity without pressure, spin up a simple example, and decide for themselves whether it fits their workflow rather than succumbing to fear of missing out on every new tool.

00:50:53 - Picks and Closing

The panel shares their picks: AJ recommends the M1 Max MacBook and Amazon's Wheel of Time adaptation, noting how the show helped him finally understand the book series' plot. Steve picks the Venom: Let There Be Carnage movie and delivers a round of dad jokes. Charles picks the Marvel Legendary card game, Auth0 for authentication, the Metronic admin theme from ThemeForest, and a holiday single by John Rich and Mike Rowe.

Anthony picks two Discord communities—the Lunch Dev Discord (formerly the React Podcast Discord) run by Michael Chan, and the Front End Horse Discord run by Alex Trost—praising them as essential spaces for developer connection during the pandemic. He shares his social handles and directs listeners to slinkity.dev for more information, and Charles closes by sharing his Community text number for staying in touch with listeners.

Transcript

00:00:06 - Charles Max Wood

Hey everybody, and welcome back to another episode of JavaScript Jabber. This week on our panel, we have Steve Edwards.

00:00:13 - Steve Edwards

Hello from a cold and rainy Portland, AJ O'Neill.

00:00:16 - AJ O'Neal

Yo yo yo, coming at you live from pleasant Pleasant Grove.

00:00:19 - Charles Max Wood

I'm Charles Maxwell from Top End Devs, and this week we have a special guest, Anthony Campolo. Anthony, do you want to introduce yourself real quick? Let us know who you are and why you're famous.

00:00:28 - Anthony Campolo

Hello, hello. I'm coming from little overcast Pleasanton, California. Very happy to be back. This will be my second time on the show. I am a web developer, a developer advocate for a company called Steapsin, and I actually didn't have the job at all. Last time I was talking to you all, I was still kind of finding my way in this whole web dev world and originally came up through this project, Redwood JS, which is a full-stack React framework. But that's not what I'm going to be talking about at all today.

I'll be here to talk about Slinkity, which is a project that combines Eleventy and Vite to bring dynamic client-side interactions to static 11 sites. So I'm really excited to talk about this. If you've heard of Astro at all, then you kind of have some context to understand what is going on here, but it's part of this new breed of static site generators, and it's very influenced by the islands architecture. We can get into all these terms and what they mean, but I'm really happy to be here.

00:01:38 - Anthony Campolo

I'm such a huge fan of the show. I've been listening to it for so long. So glad to get to talk about this stuff with you all.

00:01:44 - Charles Max Wood

Tired of explaining your absurdly high big tech cloud bills to your boss? Let me tell you about this cloud infrastructure company that's the talk of the tech world. The name is Voltar. That's vul TR. They pack high-performance cloud compute at a price that AWS and the other big clouds can't compete with.

So reap the benefits of advanced networking features, managed Kubernetes, a developer-friendly API, and 20 global locations offering elastically scalable computing power. Over a million users have deployed on Volta in 60 seconds or less across 12 pre-selected operating systems with their own ISO, with pricing starting as low as $2.50 per month for Volta Cloud Compute. They offer plans for developers and businesses of all sizes. You can try Volta for free today by visiting vulture.com, and you'll receive a $100 credit.

That's very complicated. Yeah, absolutely. It's funny because what was it, two weeks ago, we recorded an episode on Ruby Rogues about Ruby, which is a gem that brings V8 into Ruby apps. We also talked about this kind of hybrid world where you have the static site generator, slash content system, slash whatever you want to call it, right?

00:03:04 - Charles Max Wood

Like Eleventy and then bringing modern build processes and stuff into it. We did an episode on Bridgetown, also on Ruby Rogues, and it's the same idea. It took Jekyll, which was one of the first static site generators that a lot of these other ones are based on. That was written in Ruby, but it had kind of been abandoned, and they brought Webpack into it and stuff like that.

So, like you said, we're seeing this as a trend, right? I think people are much more familiar with some of the stuff going on with Gatsby and Next and some of these others that, again, pull the front end in as a first-class citizen on these otherwise static pages.

00:03:45 - Anthony Campolo

Yeah. And Eleventy was created essentially to be like Jekyll but with Node and JavaScript. Jekyll is a very famous static site generator created by Tom Preston-Werner, and it is written in Ruby. And so if you're a Ruby dev, that's really great. But for JavaScript devs, they would kind of have to learn this extra language to get it to work the way they wanted to, and to really customize it and write plugins and things like that.

So 11 D is, what if we took that same idea and did it in JavaScript? It makes it a little easier for people who want to customize it more and want to dig into the build process and get it to do what they want. And it's really...

00:04:30 - AJ O'Neal

Fast.

00:04:31 - Anthony Campolo

And be fast. Yeah.

00:04:32 - AJ O'Neal

I mean, it's a huge night and day difference between running a static site builder in Ruby versus running a Node.

00:04:38 - Anthony Campolo

Yeah. And that's interesting because even further down that line you would have tools like Hugo, which would give you Go, and that would be even faster. This is where things like Vite are using Esbuild, which is written in Go. So we're also seeing this big trend of writing JavaScript build tools in Go or Rust, like with SWC. This is a big trend to even further speed things up by getting more systems-level languages in.

But the thing with Eleventy is that it has a lot of different template languages that you could use. You use Nunjucks and Liquid and Pug and these more server-rendered type template languages. For someone like me, I came up through more of the React world. When I went to my boot camp, I learned a lot of React, and that was kind of the main thing we did. So for me, writing JSX is really natural, and it's kind of how I think of templating to a certain extent.

00:05:43 - Anthony Campolo

And so with Eleventy, you can't use any of these types of tools. You can't really use React or Vue or Svelte with it. Some people who came up with these tools want to use those with their 11 D sites, and there's not really a good way to do that. This is where Slinkity comes in.

Slinkity is created by Ben Holmes, who is a friend of mine. We got to know each other through developer Discords. We both hang out in the Front End Horse Discord and the React, or now the Lunch Dev Discord, previously the React Podcast Discord. He was building this tool called Slinkity, and the name is specifically so that he could sell Slinkies as merch as the one and only reason behind the name.

00:06:32 - Charles Max Wood

That's awesome.

00:06:33 - Anthony Campolo

Yeah, right. He was a big fan of 11 D and wanted to expand 11 D out into more of this Astro-type tool. If people have ever heard of Astro, it's created by Fred Schott. It's like a multi-framework tool that lets you write either React or Vue or Svelte, and then the build tool essentially handles how to turn that into the HTML.

It's getting to a point now where the tooling is trying to accommodate essentially any type of workflow that a developer could want. It's not super simple to do, but once you kind of get it all set up, it's a really nice workflow. With something like Vite, it was originally created by Evan You for Vue, but people in the community kept expanding it out to do more things. Eventually it got to the point where it works just as well with JSX as Vue. Now it works just as well with Svelte as it does with Vue. Once you figure out the build process, you get to have the best of all worlds and write in whatever tool you want.

00:07:47 - Anthony Campolo

So Ben saw what Astro was doing, and he'd already been building Slinkity at the time. He was talking about this a lot and kind of putting it out into the world. He was talking about and promoting it before it was actually a thing that existed, and people were getting really excited about it. They were like, hey, cool Slinkity, I want Slinkity. I remember going to install it and I was like, Ben, there is no Slinkity package. How do you use Slinkity? And he's like, oh, Slinkity doesn't actually exist yet.

So he eventually put something out in August. It's a very new tool. This is always really important to emphasize when going out and promoting these new tools. This is very much an alpha, not even beta probably type tool where we are experimenting with what can be done with these different tools. So I wouldn't recommend going out and rewriting your entire production app in Slinkity quite yet.

00:08:42 - Anthony Campolo

But I do think it's an interesting new way to think about how to build websites in a more framework-agnostic way because you are able to start with a static HTML templating kind of thing and then bring in the other ones as you feel the need for it. This is where the islands architecture comes into play.

This is a term that Jason Miller has been a big proponent of. He wrote a famous blog post about this. Islands architecture is having little islands of interactivity, which I think you all will probably have thought of as sprinkles of JavaScript. When I think of sprinkles of JavaScript, it's a fairly similar idea to islands of interactivity, which is only bringing JavaScript when you actually need it. Don't just ship an entire JavaScript bundle with this huge renderer and a runtime, unless you really need it, unless you actually need the interactivity and you need the power that these tools give you.

00:09:52 - Anthony Campolo

Ben likes to use this food metaphor. If you have your salads and your beefy meat, like burgers, the HTML is the light salad and that's your base. You don't want to have just all meat all the time. You want to have a little bit, so you bring in the heavy meat stuff when you need it. That's the idea and the philosophy of the framework.

00:10:20 - Steve Edwards

So you've mentioned Astro a few times, and I'm trying to understand the difference between Slinkity and Astro and what's the need. Is it just that Slinkity is built specifically for Eleventy versus Astro, or what's the need for Slinkity? Let's put it that way.

00:10:37 - Anthony Campolo

Yeah, I think that's probably the best way to put it. Eleventy is already a fairly well-known stable tool. It's not quite at 1.0 yet. It's on 1.0 beta right now, but it's been out for, I think, close to three years now. So it is actually very stable and it has a fairly large community behind it. People are really big fans of Eleventy and have already built up a lot of templates and workflows around it.

So the idea is that you can leverage all this work that's already been done with Eleventy versus Astro. They built their own compiler, they have their own build process, and they had to figure out a lot of the stuff from the ground up that Eleventy already had. Astro eventually had to go through a huge rewrite because they were using Snowpack, but then switched to V8, which is really interesting because Astro is created by the same people who created Snowpack. So they eventually decided that V8 was going to give them more of the dev experience that they wanted.

00:11:43 - Anthony Campolo

So it's a question of what is the base you're building on. What are the different pieces you need to actually make a framework like this function in the first place? Because you need to be able to build the HTML and you need to be able to bundle it. You need to be able to do all of that. If we take what Eleventy already has, we can leverage a lot of that work. Then you just have to figure out how do you basically bolt Vite on to handle the interactivity and all of that.

That's the main difference. Whether one will appeal to you more than the other will partly depend on, have you already used Eleventy? Are you already kind of bought into Eleventy, or are you cool learning a whole new tool from scratch? That's the biggest difference between the two. I think eventually they're going to reach fairly close parity, but right now I think Slinkity has a bit of a head start because it's building on Eleventy.

00:12:40 - Charles Max Wood

Yeah, DevChat.tv was on Eleventy for a year or two, and it felt like I was always tweaking it to make it work. The other reason I moved off of it was because I had non-technical people writing my show notes and stuff, and so I had to go find a third-party CRM. That never quite panned out the way I wanted.

Eventually I moved it back to WordPress, and then WordPress turned into a headache. Now I'm actually using a software-as-a-service to host all the shows, and there are trade-offs all the way along. That's the thing that's so interesting to me about all these different stacks and approaches: you have different trade-offs for different things. I also happen to be a fan of the sprinkles of JavaScript, as DHH puts it, and I've been using Stimulus, which is another kind of lightweight framework. It's nice because I just stick a controller on where I want it, tell it what the interactions are, and it just kind of does the right thing.

00:13:38 - Charles Max Wood

Then I can do the rest of it off the server, which is kind of the power you get behind Eleventy. It's a really interesting approach that I think a lot of people will pick up, depending on what their needs are.

00:13:50 - Anthony Campolo

Yeah, definitely. I think it's partly what kind of site do you need to build. This is going to really appeal to more developers who don't necessarily need to have content editing people as well. But you will be able to hook this into a third-party CMS if you want to, because you can put those into the build, and there are lots of integrations already with Eleventy.

If you want to set it up in a way where you're not just writing Markdown files, there are lots of great tools that integrate with it already. Another thing you get is plugins that are already built in for Eleventy, because other people figured out how to plug in things like Sanity or Prismic or any of these kind of CMSs. So if you want to have a build process that takes in content from a CMS, and then you have an editor for that CMS, for the people who just want to edit content, you can do that as well.

00:14:51 - Anthony Campolo

So that's something that's available to you.

00:14:53 - Charles Max Wood

Makes sense. So does Slinkity dictate a front end framework, or is it just Vite and whatever you want to use?

00:15:02 - Anthony Campolo

Yeah. So we're going to be going down a similar path that Astro did where they have renderer plugins. You are going to specify whether you want to use React or Vue or Svelte. So right now the React...

00:15:20 - Charles Max Wood

Angular.

00:15:21 - Anthony Campolo

That's funny, actually. Someone did figure out Angular for Astro by kind of hacking around. Brandon Roberts and I chatted with him. Brandon's awesome. Get this: you want to get this working with Slinkity. And he's like, yeah, maybe.

If there are enough people who ask for it, we may actually have an Angular one at some point, but the React one was the first one that was built out just because it's the most popular. Most people are going to ask for React first. We're currently working on the Vue and the Svelte renderers. Ben spoke at Svelte Summit just a couple of weeks ago, and Svelte especially is going to be an interesting one because it's already set up in a way where you have a compiler that's just building mostly HTML for you anyway. So they've already bought into this idea of, we want to have a nice syntax that can be compiled away into something that's going to be native to the browser.

00:16:22 - Anthony Campolo

So that's something that is still kind of in the process. I know Ben has been talking about the renderer plugins for going on like a month or two now, so those should be coming out fairly soon. By the time people listen to this podcast, we'll hopefully have those going on. There's also other frameworks that are kind of more optimized for Vue. There's one called Aisles, same idea, islands of interactivity. That one started as a Vue-first one.

Everyone wants this kind of setup, and different people want different front end frameworks first. It partly depends on the people building the frameworks, which ones they're more bought into, and those ones will usually get built out first. Then there's a question of can you leverage different frameworks because they have the same syntax, like Solid also uses JSX. So once you get the JSX kind of figured out, then you can get both React and Solid for free.

00:17:20 - Anthony Campolo

So there are different frameworks and different languages. It's a couple different levels here. But for the most part, you can almost always expect to be able to use React with any of these unless they specifically want to use Preact. Then you also have Preact versus React because it's a similar syntax but slightly more lightweight.

This is why, for people who are using these tools, we're kind of getting back into some of the JavaScript fatigue type stuff, I think, with these tools in this conversation. There's so many new frameworks now and people are just like, oh my God, I thought we just settled on React and Vue and Svelte and now we have all these new things. Figuring out how to get these all to work is really the framework author's job. It should just work for the user to say, I want to write with this tool specifically. So I'm just going to drop in a configuration script and then just write the thing and it should work.

00:18:18 - Anthony Campolo

Figuring out how to get that to work is really complicated and requires digging into the low-level implementations of these different tools. But for the end user of these frameworks, they shouldn't really have to think about any of that.

00:18:31 - Charles Max Wood

Makes sense. The other question that I have about this and about systems like this is, and this was another issue that I had with Eleventy, right, was I'd want to pull in some other JavaScript library. You know, that wasn't necessarily a reactive view or whatever specific library, and do things with it. I always had to figure out how to put it in my assets, and then tell the browser to go grab it out of my static assets and all that stuff because I didn't have a solid build process for the JavaScript on the front end.

It sounds like Vite provides that. So do you just do the rest of that stuff the way you would normally do it with Vite?

00:19:10 - Anthony Campolo

Yeah, exactly. This is why building on a tool like Vite is so useful. A lot of the challenges that would come with bringing in other tools also comes with figuring out whether it's ESM or CommonJS and that whole world. Vite is built on this idea that we're eventually going to have just everything in ESM. So you don't have to worry so much about how to finagle the require versus import syntax.

We're still not quite there yet. We're getting very close in the sense that the vast majority of tools now will have an ESM syntax already ready to go. If that's a new library, you can usually just import it and it will work. Vite will handle the bundling and load in style sheets, and as long as that part of the build works, you're always going to be set.

So Vite is just a really incredible tool. It's been awesome because so many different projects are being built on it now. One of the main maintainers of Vite wrote a blog post where he just showed all the different tools that are using it now. By having all these different projects use it and test it out, and they all have their own weird specific dependencies they want to bring in, it's becoming the first tool since Webpack that is capturing enough of the mindshare to hopefully work for essentially any use case you would want.

The one last kind of interesting part about Vite is that it's using Esbuild, which is this kind of new-school build tool that's built with Go, but it's not actually bundling with Esbuild. Esbuild is doing file transformations to basically turn JSX into HTML. But then if you want to actually bundle for production, it's using Rollup. It's using an older bundler that has already been battle tested, so it's not really redoing this whole workflow for production builds. It's using Rollup and saying, okay, we already have a way to do our production build.

00:21:36 - Anthony Campolo

So it's more for development where it's useful because with Esbuild and with Vite it's super fast. It's about getting crazy fast hot module replacement and getting it to where you can just save and then it instantly refreshes and is up on your screen. It's one of these things that's hard to appreciate until you've actually sat down and used it because the feedback loop you can get once you have cut all of that bundling time out is just so nice. It makes such a big difference when you want to test things out.

You want to make a change, save it, and see the change, and you can get that to happen essentially instantly. Then you're in a much better place than you are with some of these other tools where there's constant lag. Even if it's just like a second, that time adds up over time.

So it's the really fast feedback loop that you can get with these tools that's the most useful part. When it comes to bundling and building for production, they're bringing in an older tool that's already been battle tested and there's all these plugins and stuff for it. That's the real value that I see with Vite when you're actually in development and you want to get this next-gen, super fast build experience.

00:23:26 - Charles Max Wood

So one other thing that I'm kind of wondering about is when I was using Eleventy, I was hosting it on Netlify and it pretty much detected, hey, this is Eleventy, so I'm just going to run the Eleventy command, right, and just build. It worked great. That part of it was easy.

But now that you've added this bundling component to the front end with Vite, do Netlify and the other big one, Vercel, detect, oh, this is Slinkity, not Eleventy? Or do you have to go in, because you could go in and say, no, run this command instead of that command to build. Do you just have to go in and modify that in order to deploy it?

00:24:09 - Anthony Campolo

Yeah. For the deploy step, it's almost identical because for any of this stuff you just have a build command and a publish directory. For Netlify, the way you can specify this is with a Netlify TOML file. We have some docs that show, hey, if you want to build this on Netlify, create a Netlify TOML file and copy and paste this little snippet, and it'll give you the build command and the publish directory. Then you push that up and Netlify will know exactly what to do with that.

It's the same with Vercel. One other one that I've tested it out with is Cloudflare Pages. Cloudflare is kind of a Jamstack competitor tool, which is basically exactly like Netlify and Vercel. So yeah, for any of those, it's going to be just as simple. They don't have a Slinkity preset like button yet, but that's because we haven't opened a PR yet into their repos to get those in.

00:25:10 - Anthony Campolo

But if you just take the build and publish commands as is and plug those in, then it's going to build and work just fine. Anywhere that you can host static Jamstack sites, it's going to work great.

This is one of the things that we're very big fans of with the Jamstack. I host a Jamstack podcast for Jam, and the whole idea is everyone agreeing on how to do web dev like this because you just have a build command. If you want to bring in serverless functions, that's something that Eleventy is just recently starting to add. There's now an Eleventy serverless plugin which lets you integrate with Netlify functions, which are basically just lambdas.

So there's also more full-stack type things that are starting to be added to Eleventy. This goes back to what do we get from Eleventy that we won't get from Astro? That would be another good example of something that, because it's built into Eleventy core, we already have a nice serverless function abstraction as well.

00:26:21 - Anthony Campolo

That's going to be useful because I'm starting to build out some full-stack Slinkity examples where we're doing GraphQL calls into a GraphQL API because I also work for a GraphQL API company. I've been experimenting a bit with that. If you're doing that, then you may need to authenticate when you hit that API gateway. To do that you have API keys, and you can't just put those in your client and then deploy that to Netlify because that's an issue.

00:26:56 - Charles Max Wood

A bad idea.

00:26:58 - Anthony Campolo

Yeah. Chuck, you should go check some of your projects, it sounds like.

That's definitely a thing that, if you need to worry about key management, you now have Eleventy serverless where you can place your keys. So I'm very big into taking these Jamstack ideas and expanding them out into more of a full-stack setup. Full-stack Slinkity projects are also something you can do. It's not just a static front end for a blog or something like that. If you want to build a whole dashboard, because if you're adding interactivity, it's like, well, the interactivity needs to go somewhere. If you're putting in interactivity, it's probably because you have a user who's doing something, and whatever that user is doing probably needs to be persisted somewhere.

So there's a larger vision here of not only adding interactivity, but also giving you an ability to have a whole back end that's set up for you as well.

00:27:55 - Anthony Campolo

There's lots of different ways you can do that. There's Supabase now, which is a really nice Postgres hosting service, or Railway. So there are back end tools that are as built out as Netlify or Vercel. That's where I'm adding a lot of stuff to this project as I'm figuring out how to stitch the back end into the Slinkity project as well, while Ben is figuring out the additional rendering plugins and stuff like that.

00:28:26 - Charles Max Wood

That's cool.

00:28:27 - Anthony Campolo

Yeah. I'm curious, have any of you guys tried out Astro or any of these islands of interactivity type things, or have heard about it at all?

00:28:35 - Steve Edwards

Yeah, I've heard about it. We've talked about it, I think, on Views on Vue. We've talked about it. The different islands approach. I haven't had a chance to sit down and play with it yet, but I'm too busy playing with Inertia myself. Yeah, I definitely know about it. It certainly seems to be gaining traction because I hear about it more and more.

00:28:53 - Anthony Campolo

You had the Isles creator on Views on Vue. I've been wanting to reach out to him as well to get him on my podcast because it's cool to see similar ideas play out across different frameworks. It's something I'm always a big fan of, seeing how people approach a similar problem but from slightly different areas.

The fact that there are people in Vue World and React World who are both like, yeah, this seems like a thing that we want, it's like, okay, what is the base layer that is interesting to everyone? I'm always looking at different things that are doing similar things and trying to abstract out what is actually the thing that makes these all similar.

00:29:37 - Charles Max Wood

My base layer is German chocolate.

00:29:39 - Steve Edwards

See, I thought about the meat as the base and not the salad. I thought the salad was more the light fluffy stuff on top, but I guess it still works.

00:29:47 - Charles Max Wood

Yeah. Oh yeah. Going to that analogy. I'll just go for the meat every time anyway. But yeah, I'm...

00:29:53 - AJ O'Neal

Not familiar with the island stuff. I've never heard of it until today.

00:29:56 - Steve Edwards

Yeah, I forgot we talked with Maximo. He was. That was a good interview. He was fun.

00:30:00 - Anthony Campolo

Yeah. So I can talk about that a little bit more.

00:30:03 - Charles Max Wood ad read

Hey, folks, this is Charles Maxwood from Top End Devs, and lately I've been working on actually building out Top End Devs. If you're interested, you can go to Top End Podcast and you can actually hear a little bit more about my story, about why I'm doing what I'm doing with Top End Devs and why I changed it from DevChat.tv to Top End Devs.

But what I really want to get into is that I have decided that I'm going to build the platform that I always wished I had with DevChat.tv. I renamed it to Top End Devs because I want to give you the resources that are going to help you build the career that you want. So whether you want to be an influencer in tech, whether you want to go and just max out your salary and then go live a lifestyle with your family, your friends, or just traveling the world or whatever, I want to give you the resources that are going to help you do that.

We're going to have career and leadership resources in there, and we're going to be giving you content on a regular basis to help you level up and max out your career.

00:30:58 - Charles Max Wood ad read

So go check it out at Top Comm. If you sign up before my birthday, that's December 14th, you can get 50% off the lifetime of your subscription. Once again, that's top end devs dot com.

00:31:11 - Anthony Campolo

This is something that Jason Miller was or is a really big proponent of, and he wrote this blog post in August of 2020. This came from a lot of work that he was doing at Google in terms of different rendering modes. They wrote this very long blog post that compared server rendering to static SSR to SSR with hydration, and then client-side rendering with pre-rendering, and then full client-side rendering. They have this long chart that compares them all to each other.

It's about how do you split the difference between the different types of performance metrics. Dan's not on right now, because Dan would have been perfect for this, because it's about how do you balance time to first byte versus time to interactivity. There's the moment when you first see the content and then the moment when you can interact with the content. There's this idea that there is going to be an uncanny valley between the two because there would be a brief period of time where you'd be able to see the content because they rendered a skeleton screen for you and sent that to you.

00:32:36 - Anthony Campolo

But the JavaScript hasn't kicked in yet, so you're still waiting for the JavaScript to kick in before you can actually do anything on the page. That's the point in time where you may see the page, but then you try and click something and nothing happens. There's this uncanny valley. Addy Osmani is the one who wrote a blog post about this. I can share links to all this stuff. I wrote a blog post kind of talking about the whole history of this, called "What is partial hydration? Why is everyone talking about it?" It felt like going for a little clickbait with that title.

It's basically how do you balance all these different competing ideas. What should you aim for? Giving someone content that they can look at very, very quickly, or should you aim to give them interactivity very, very quickly? With the islands architecture and with partial hydration, it's trying to really limit the JavaScript that you need to send to make it interactive to the absolute smallest amount so that you can send them the content, they can see the content, and then the JavaScript can load in milliseconds and you won't have this uncanny valley.

00:33:50 - Anthony Campolo

This is why you'll also hear Preact come up a lot in this conversation, being from Jason Miller, because Preact is an almost identical API to React, but it's a lot lighter weight and requires a much smaller bundle. So you can render the HTML out and then send that, and then for the JavaScript to kick in with Preact will be a much smaller amount of time than with React because React is kind of heavy and requires building a lot of the... there's like, yeah, you gotta bring React DOM.

This is why people want to figure out a way to shave all this down to the absolute most necessary JavaScript you need to make something happen. That's why they use the term islands, because they're talking about an island of interactivity. So if you have JavaScript in a certain part of the page, maybe it's towards the bottom because you have a button that is going to be for contact or something like that, you can set it up so you wouldn't even load that until you start scrolling down to it.

00:35:03 - Anthony Campolo

If it's not shown on the page in the first place, then you wouldn't need to build it at all. So you need a lot of optimizations and you need your build tools to have a lot of knowledge of your project and how it works.

This is where bringing in tools like Vite enables some of this more complex sort of stuff, because you can start to tell your specific components where and when and how they should render. This is one of the things that we're really taking a lot of influence from Astro. With Astro, they have these different client directives. They have client:load, which will hydrate the component on page load, or they have client:idle, which will hydrate the component as soon as the main thread is free, or they'll have client:visible, which will hydrate the component as soon as the element enters the viewport. Then there's a media query one. As soon as the browser matches the media query. And then there's client:only, which will hydrate at page load, but it'll be skipped at build time.

00:36:12 - Anthony Campolo

These are the types of things that we're adding into Slinkity now. These are the same things you're going to see in projects like Aisle. The first one, actually, that I know of that was doing all of this was this framework called Marco. Almost no one has really heard of Marco, even though it's been around since like 2014. This was a framework that was created by eBay. They pioneered a lot of these partial hydration tools.

Now a lot of people are starting to go back and see, okay, there has been years and years and years of work on this. It just hasn't really been a big part of the conversation. Now that people realize that we're shipping way too much JavaScript, a lot of people have come to realize that we're using React way too much and we're using it where we don't really need it. It's causing this huge load on the client, on the device.

00:37:13 - Anthony Campolo

By being a little more intelligent about when we're actually using JavaScript and how we're using it, we can get to a point where the developers can still write JavaScript and do all the fancy JavaScript things they want to do, but without having a detrimental effect on the actual user experience.

00:37:32 - Charles Max Wood

One other thing just to keep in mind is that, and this is part of the appeal of something like Slinkity, at least for folks that I talk to in the Ruby community and other communities where they have a robust back end system that renders HTML, is that they can do a lot of the things that they need to do just with the back end. This allows them to drop those pieces in only where they want them.

We had a debate actually at my previous employer because a lot of our applications were written with Hotwired Stimulus. There were certain aspects of it that had been built in React. We were having a discussion over whether to unify one way or the other. It was interesting because the conversation kept coming back to, well, React does all these things and Hotwired Stimulus does not.

The argument in favor of Hotwired Stimulus was, yeah, Hotwired and Stimulus don't do that. They just give you these little pockets of JavaScript, and Rails does the thing that you're telling us you want React to do. In a lot of cases, not every case, but in most cases, the back end rendering was faster and less load in the browser than React.

00:38:43 - Anthony Campolo

Yeah, that definitely sounds about right because we have had tools that have allowed us to do all the things we've done with React before React existed. So it makes sense. It's like, well, if you don't really need React to do anything, it's just that people like using React. This is me especially. I learned how to do web dev with React. This is something that, AJ, you're always talking about. You're not the biggest fan of React. I think all the criticisms of React are totally valid.

It's partly because the reason why people use it so much is just because it's the way they know how to do things. For people who learned how to do things before the React days, they don't see the need for it because we can already do all this stuff without it. Whereas for someone like me, I'm like, okay, well, yeah, but now I'm going to have to learn a new way to do these things because I know a way to do it and it works.

00:39:40 - Anthony Campolo

But there's maybe issues with that because you're trying to fit a square peg into a round hole sometimes by shoving React into every single problem. So we were trying to give you a nice Slinkity-shaped hole to shove that React into.

00:39:57 - Charles Max Wood

Yeah. Well, the other thing is that as I've talked to people and as I've used different frameworks, sometimes it's really nice to just do it. It's like, this is the React way. Okay. I don't have to think about it. I can just write it right.

Now, technically there are some trade-offs, but for me to be able to quickly write what I'm going to write, a lot of times it's convenient because the API, the methodology, all of that is well understood. If you do it the way that they tell you to do it, it just kind of flows.

00:40:26 - Steve Edwards

Yeah. I guess you could say that using all that React is a severe overreaction.

00:40:32 - Charles Max Wood

Where's that sound effect.

00:40:33 - Anthony Campolo

Would you say?

00:40:35 - Steve Edwards

There it is. I had to hit the button twice. Little delay there.

00:40:39 - Anthony Campolo

Oh, I haven't heard that yet.

00:40:41 - Steve Edwards

I was also going to ask you. So you were talking about the framework that eBay had. It was called Marco. Did I hear that right? Yeah. Did they ever have a polo? Oh, thank you, thank you.

00:40:52 - Charles Max Wood

Or Campolo. Anyway.

00:40:54 - AJ O'Neal

Yeah.

00:40:55 - Anthony Campolo

What a great addition to the show. Thank God someone gave Steve a soundboard.

00:41:00 - Steve Edwards

Oh, I love it. As soon as I discovered that Riverside had sound effects like that, I was loving life.

00:41:05 - Charles Max Wood

I've overused it on a few shows too.

00:41:07 - Steve Edwards

Anyway, what do you mean, two? I don't overuse it. I use it perfectly. I guess that's up for debate. Oh, well.

00:41:13 - Charles Max Wood

I left my camera on so you could see the doubtful look on my face. Anyway, is there anything else that we need to know about this? One thing that I like about some of these approaches is that in some cases it's somewhat beginner approachable. If I'm trying to figure out JavaScript or figure out React or figure out something else, I can put something together with this and just have a really simple way of getting data to the front end and learning on those systems. Have you seen anybody use it that way?

00:41:41 - Anthony Campolo

Yeah, this is actually one of the things that Ben has talked about. One of his big goals for the project is for it to be useful as a learning tool and for people who don't have a ton of web dev experience. Because if you want, you can just start writing basic HTML and CSS, and it can kind of grow with you as you want to add more complex frameworks and tools on top.

If you just start with your basic HTML, start building out a site. You wouldn't even necessarily notice a difference or that it even does all this React stuff, and it would function just the way you'd expect a regular website to function. Then once you want to start bringing in tools like React, you can do that and it's already set up for you to do that. So you don't have to then figure out, okay, well I built this HTML site that works. But then I'd figure out, okay, how do I install Webpack and how do I configure Webpack, and how do I do all that.

00:42:40 - Anthony Campolo

It will just be there already. So it's like, okay, all you have to do is just start writing React and you don't need to do any configuration whatsoever. Another use case he's talked about is the portfolio website use case where you're going to have mostly content, but you may want to have little interactivity for a contact form or something like that, or you want to do some validation on that, or you want to show off that you know how to do more complicated things on your website.

The portfolio is usually a showcase for your web dev ability, so you can build something that is fairly simple and works the way you'd expect your website to work. Then when you want to bring in this more complex use case stuff, it's already there for you and it's already set up. I think that's a really good way to think about these types of tools, that they give you a lot of power that is under the surface until you really need it. So you can build a site just the way you would a regular site.

00:43:42 - Anthony Campolo

Once you want to bring in these newer tools, I was like, all right, I can do that, and I don't need to get a PhD in Webpack to figure out how to do that.

00:43:51 - Charles Max Wood

Makes sense.

00:43:52 - Anthony Campolo

So yeah, and I would just recommend if people are interested in this and want to check it out, we have a lot of community resources. The main site is Slinkity. From there you can get to the GitHub and all that. We have an awesome Slinkity repo as well that I've been maintaining, and we have a lot of streams that Ben has gone out and done. We have some articles that he's written, and if you're curious about learning more about this stuff, it's pretty much just me and Ben are really the only two people working on this on a continuing basis.

But yeah, we're both really, really passionate about it. We think it's a cool way to expand out into some of these newer tools without necessarily having to entirely buy into them. We were saying, if you want to just build a regular HTML site, you can do that, and then you can kind of dip your toe in where you want.

00:44:48 - Anthony Campolo

And then we have a Discord channel that's been sectioned off for us in the Discord. So you can check that out as well. If this is at all interesting to you, we would love to have contributors. We'd love to have people come in and check it out. We're still working on the Vue and the Svelte support. So if someone is very passionate about Vue or Svelte and wants to help push those across the finish line, now would be a good time to add some contributions.

00:45:16 - Steve Edwards

So are you dogfooding with your site? Are you using Slinkity to build the Slinkity site?

00:45:21 - Anthony Campolo split

That's a good question. I think that the Slinkity site...

00:45:25 - Anthony Campolo

I think it's being built with Eleventy right now, so there's not really any interactivity on it yet, but that's something that we probably will end up doing. I know I'm always a big fan of dogfooding, so I always try and build as much as I can with the tools that I'm using.

I had been working on migrating my own blog over to Eleventy, and then once Slinkity came around, I was like, I should actually use this instead. So I'm definitely using it and building some stuff with it. Ben will actually joke that I use Slinkity way more than he does because he's just kind of building it. But I definitely think that if you want anything to really work well, you need to dogfood it. So I'm working on building some stuff with it right now, and definitely will push to switch the actual site over to it if that's not currently the case.

00:46:14 - Charles Max Wood

Very cool. Any other aspects of this we should dive into, guys, before we go to picks?

00:46:18 - Steve Edwards

No. Like you said, it's pretty early in there, so I'm sure there will be items coming up as they develop it. But yeah, it'll be interesting to watch.

Definitely. You mentioned earlier, Anthony, the JavaScript fatigue. It seems like more and more, I'm just reading an article, you're seeing more and more of these similar frameworks that are trying to address the same thing. How to go from the old monolith of the WordPress type site to the completely decoupled. Everything's decoupled. So now we're sort of back trying to build a combination of the two, monoliths that are made of multiple pieces.

It's always fascinating for me to watch the open source world and watch what happens when people are free to just scratch their own itch, develop a new mousetrap, whatever euphemism you want to use, and to just watch all of the... boy, the words are not coming out of my mouth. You know, the new things that come out of people's brains. They throw it out there and it's like, hey, this is cool. Yeah, I'll use it. Works great. Then things eventually coalesce. The JavaScript frameworks, you've got some major ones and some minor ones. But yeah, it's interesting to watch all the available tools that are out there.

Particularly, you mentioned earlier how you're trying to make it for the newbie to come in and build something similar, a brochure-ware site, which is what a lot of people need, probably. I'd be curious to see what types of sites things are used mostly for. You know, it's going to be, hey, I need a bunch of information about my organization, maybe so somebody can log in, or a contact form or something like that. This is the kind of stuff that's really great for that, combined with something like Netlify forms handling, where you just build an HTML form and point it and they handle all the email notifications and stuff like that.

So I'm rambling, so I'll stop. But anyway, just to say it's great to see more tools like this coming out.

00:48:11 - Anthony Campolo

Yeah, I think that there's always going to be a million different tools that you can use at any given point in time, and for me, I find it to be a useful learning exercise to see these different frameworks. That's why I wrote an article that compared a lot of them to each other, but I definitely recognize that it can be like the JavaScript fatigue thing. It can be very frustrating for people coming in, especially new people.

I remember when I was learning web development just a couple of years ago, I was seeing Gatsby and Next and Nuxt and Grissom and all these different tools. I didn't even have the context to really understand what they were or how they even related to each other. It took a really long time to wrap my head around them and what they actually did. So I'm very sympathetic to that viewpoint, and throwing one more tool into the mix.

00:49:03 - Anthony Campolo

It's like that XKCD thing. It's like, all right, there's too many standards. Now we have one more standard.

00:49:07 - Steve Edwards

Yes, that's a classic one. I know exactly which one you're talking about.

00:49:11 - Anthony Campolo

Yeah, yeah. So it's like, give it a try. See if it works for you. I'm not saying it's the one true way to do this that everyone should be using Slinkity. It's just we have our own kind of take on this new paradigm, and we think it's a nice way to build. I personally really enjoy using it. I think it's just a really fun tool to use and be able to have a static site generator where you drop in React. It's cool. For me it's really fun.

So I would say just give it a try and see what you think. Don't worry so much about the FOMO of, oh, I need to be using all these new tools. Just play around with them. Get a simple example thing spun up and deployed. It should be fairly simple to do that.

00:49:54 - Anthony Campolo

You can get a feel of what it's like using this, and then you can decide whether you want to actually buy into using these tools.

00:50:01 - Charles Max Wood

Makes sense.

00:50:02 - Charles Max Wood ad read

Hi, this is Charles Maxwell from Top End Devs, and lately I've been coaching some people on starting some podcasts and, in some cases, just taking their career to the next level. Whether you're a beginner going to intermediate or intermediate going to advanced, whether you're trying to get noticed in the community or go freelance, I've been helping these folks figure out how to get in front of people, how to build relationships, and how to build their careers and max out and just go to the next level.

So if you're interested in talking to me and having me help you go to the next level, go to top dot com. I will give you a one-hour free session where we can figure out what you're trying to do, where you're trying to go, and figure out what the next steps are. Then from there, we can figure out how to get you to the place you want to go. So once again, that's top dot com.

00:50:53 - Charles Max Wood

All right. Well, I'm going to push us into picks. AJ, do you have some picks for us?

00:50:57 - AJ O'Neal

Oh goodness, I haven't been thinking about it. But off the top of my head, I could pick the M1 Max. I'm full send on the 16-inch M1 Max. Loving it.

Also, The Wheel of Time has come out on Amazon and there are some major story changes. Maybe major, minor, I don't know. It's major story changes. I have not been able to get into The Wheel of Time, the book. But here's the good news. Now I actually know what the plot of the book is after watching a couple of episodes on Amazon Prime. So now when I go listen to the book, I start listening to the book again, and I actually get what's going on because I have like five hours in and I still don't know what their quest is, what they're trying to do, or what is going on.

All I know is there's some Trollocs that are chasing them and some mysterious lady. Moiraine is really ambiguous about things that she says, and I had no idea what are we going towards. Is there going to be an end of this book? Is there some sort of resolution where we'll know that something happened, or do we just listen to some kids complain as they walk through the woods? But now I get it. There's this thing, the Dragon Reborn. It's going to be important. One of these kids has some sort of connection to the Dragon Reborn. So both the Dark Ones and the Whitecoats and the ICD all want to get at these kids, and Moiraine got at them first, and she's hopefully a good ICD, not a bad one.

So for anybody that's wanted to, there you go. But fun fantasy. I don't think it's as good as Brandon Sanderson because the magic system, so far, is not really well worked out. It's not worked out in the Amazon series at all. They just do yoga and then all of a sudden they have powers. But, oh, sorry, it's not yoga, it's tai chi. But anyway, you know what I'm saying. That's all I got for this week.

00:52:59 - Charles Max Wood

Yeah, I have to chime in just because I've been watching it too. But I've read the books multiple times and I really loved the books. I just had to get over all the things they changed. But yeah, the magic system is much more fleshed out in the book.

00:53:13 - AJ O'Neal

Oh, okay. Good. Yeah. So far, so far. Yeah. It's not.

00:53:17 - Charles Max Wood

Yeah. So, and a lot less tai chi. So anyway, Steve, do you have some picks?

00:53:22 - Steve Edwards

Yes, yes I do. One legitimate pick. Before I get into the high point of the episode, the dad jokes. This last weekend I went and took my son and we saw the new Venom movie, Venom: Let There Be Carnage. It's a Marvel movie, and I usually don't get into the whole Marvel Universe and follow all the characters and stuff, but I liked Venom 2 just because I like Tom Hardy, his acting, and the killer sense of humor they have throughout the Venom characters. It's really funny, a lot of real quick humor that I really like. It kept me laughing.

But on to the dad jokes. First question of the day: why did no one laugh when the king farted in front of his court? Anybody know? Because noble gases do not cause reactions. Thank you.

00:54:08 - Charles Max Wood

That once made me smile. Wow.

00:54:10 - Steve Edwards

Got a smile.

00:54:11 - AJ O'Neal

I appreciate a good physics joke now.

00:54:15 - Steve Edwards

Did you hear about the town that legalized marijuana but they banned alcohol? The residents were left high and dry.

For those of you who can't see, Anthony is really laughing. He's just sort of quiet.

And then finally, my wife has always been a real cat person, so always had cats around me. Not so much, but I handle it. One time, not too long ago, she looked at one of her cats and said, you know, I'm going to teach you how to speak English. And the cat looked at her and said, "Me how?"

00:54:48 - Charles Max Wood

We need a groan sound effect.

00:54:51 - AJ O'Neal

No, that was awesome. I really like that one.

00:54:55 - Steve Edwards

Dang it. My laughing sound effect is not working and I was all I had. It all timed and everything. But just imagine people laughing.

00:55:01 - Charles Max Wood

All right, anyway, get in with some picks. I always pick a board game. This week I'm going to be picking Legendary. It's more of a card game than a board game. They do have a game board that you play the cards on. I've been playing the Marvel Legendary. I guess I should specify that since they have DC Legendary. I think I saw a Firefly Legendary, which would be cool.

But anyway, the Marvel Legendary, they've got like two dozen expansions or something you can get, and we really enjoy playing it. I actually wrote a React Native app that helps you randomly select heroes. It's a super fun game and I've really enjoyed it. Basically, you shuffle a deck of five or six heroes. You have a villain, like a master villain, you have villain henchmen, and then you're trying to stop the henchmen as they advance through the city. The villain has different effects on the game, and if they complete their scheme, then they win.

00:56:00 - Charles Max Wood

And if you get to the bottom of the villain deck and you haven't completed the win condition, then you lose. The condition for winning is beating the master villain, the mastermind. It's a fun game. It's super fun. They've got all kinds of mixes that you can get. We've really, really enjoyed it. Spent hours and hours playing that game.

As far as other picks go, one pick that I'm going to throw out there is Auth0. I've just been integrating more stuff with it for Top End Devs and it's awesome. It's really awesome. So I'm going to pick it. The other pick I have is I went on ThemeForest because I needed kind of an admin type theme, and I picked up the Medtronic theme. It has React, Vue, Angular, HTML. I think there's one other in there. But anyway, you can build it for whichever framework you want or just have it do its thing with just HTML and jQuery.

00:57:00 - Charles Max Wood

I've been pulling that into an app that I'm working on, and it's probably also going to be used on the admin for Top End Devs. It's terrific. I've really been happy with it. So I'm going to pick that as well.

My last pick is John Rich from Big and Rich. Before he was with Big and Rich, he was the lead singer for Lonestar, both country bands. He and Mike Rowe from Dirty Jobs got together and released a single, and it's called "Santa Claus Has a Dirty Job" and it's awesome. You can go pick it up as a single off of iTunes or wherever you get your music.

00:57:37 - Steve Edwards

I think it was huge. Wasn't it like top of every chart or something? Yeah, it was some crazy popular song.

00:57:42 - Charles Max Wood

Two weeks. Yeah. So anyway, definitely go check it out because I've been playing it and I've been enjoying it. So yeah, those are my picks. Anthony, do you have some picks for us?

00:57:50 - Anthony Campolo

Sure. I'm going to pick some Discord servers. I mentioned these briefly during the episode, so Discord servers are, for me, really where I've gotten a lot of my connections and kind of camaraderie. As you know, we've been living through this whole pandemic, and it's been such a great way to connect with other devs and share notes and just hang out and have a good time.

So to that, I've really enjoyed the Lunch Dev Discord, which up until about a week ago was the React Podcast Discord, but we've recently rebranded it because it's not really React-based. We talk about all sorts of different things and different frameworks. This was created by Michael Chan, the host of the now defunct, possibly coming back at some point, podcast, React Podcast. If you go to events, you can find a list of our events, and then you can find a link to the Discord from there. We have lots of people who like to hang out and share what they're learning and what they're working on.

00:58:57 - Anthony Campolo

We have a lot of people who are working on frameworks as well, who will pop in and chat. This is actually where I met Ben originally. The other one is the Front End Horse Discord. If you go to Front End Horse, Alex Trost has a whole horse-based aesthetic. He has a stream and he has a Discord and he works for Prismic. There's a lot of more design-heavy, front-end-heavy type stuff there. They do a lot of creative coding, what he calls, and so like generative art and stuff like that.

Both of them are just really awesome communities where lots of really cool people are hanging out and just working on stuff and talking about what they're working on. You can get a lot of feedback and support. It's a great way to share notes or to just hang out and have fun and meet some people. So I've really enjoyed those and I'm a huge fan of Discords in general.

00:59:52 - Anthony Campolo

I think it's really kind of the next big thing in terms of developer communities. We've had Slack, we've had message boards, and we've had stuff like that. But with Discord, you really get everything because you can do screen shares and you can do streaming and we do all sorts of stuff.

01:00:10 - Steve Edwards

Hey, if you go back far enough, you remember IRC.

01:00:12 - Anthony Campolo

Yeah. So yeah, those would be my picks.

01:00:15 - Charles Max Wood

Awesome. All right, Anthony, if people want to follow you or connect with you, what are the best places to do that?

01:00:21 - Anthony Campolo

Yeah, I am a web dev pretty much everywhere on Twitter and GitHub or dev two. That's where you can get ahold of me. If you want to learn more about Slinkity, Slinkity dev will have links to all of our stuff. Thanks so much for having me. Always enjoy getting to chat with you all, and hopefully some people learned some new stuff and have some more cool projects to check out.

01:00:45 - Charles Max Wood

Awesome. All right, folks, we're going to wrap it up here. And until next time, max out.

01:00:50 - Steve Edwards

Adios.

01:00:51 - Charles Max Wood

Oh, hang on, one more thing I got to throw out there. My last pick, I actually set up a phone number through Community. If you want to text me, you can. This number does not take phone calls. The voicemail message literally says that you can't leave me a voicemail because I won't get it. But if you want to text me, I will text you back. This is a way for me to stay in touch with folks, see what you're working on, periodically ask questions, and see where you're at.

The phone number is (801) 877-3287. If you shoot me a text, I will text you back. I'm really looking forward to connecting with people this way. And yeah, until next time, folks. Max out.

01:01:35 - AJ O'Neal

Adios.

01:01:36 - Charles Max Wood

Bandwidth for this segment is provided by Cash Fly. The world's fastest can deliver your content fast with Cash Fly. Visit to learn more.