Astro Community with A Fuzzy Bear

Episode Description

Fuzzy Bear, an Astro core team member, shares his journey from Covid coder to open source contributor and explains what makes Astro unique.

Episode Summary

In this episode, the hosts welcome A Fuzzy Bear (aka Fuzzy), a recently appointed Astro core team member, who shares his unconventional path into web development. After a personal injury during Covid sidelined him from his previous career as a business consultant, Fuzzy taught himself to code through FreeCodeCamp, working his way from HTML and CSS through JavaScript. He recounts his frustrations with tools like Create React App and Webpack, which led him to discover Snowpack and eventually Astro through its creator Fred K. Schott's mission to bring ESM to the web. Fuzzy explains what drew him to Astro's "HTML first, zero JavaScript by default" philosophy, contrasting it with the complexity of frameworks like Next.js for building simple client websites. The conversation covers Astro's technical strengths, including its island architecture, single-file components with scoped styles, HTML streaming, SSR capabilities with adapters for multiple platforms, and its unique ability to let developers from different framework backgrounds (React, Vue, Solid) collaborate on the same project. Host Christopher Burns shares his own experience attempting to convert a Next.js site to Astro, prompting a practical discussion about SSR differences between the two. Throughout, Fuzzy passionately advocates for open source collaboration, community-driven development, and Astro's positioning not as a competitor but as a complementary tool in the modern web ecosystem.

Chapters

00:00:00 - Meet Fuzzy Bear and His Origin Story

The episode opens with the hosts welcoming their guest, A Fuzzy Bear, and asking about his unusual name. Fuzzy explains that the handle evolved from a desire to shed his old Xbox 360 username, blending a personal philosophy he calls "the way of the fuzz" — a stoic mindset centered on growth — with childhood nostalgia for Fozzie Bear from the Muppets. He shares a charming anecdote about his sister reminding him he could never pronounce "Fozzie" as a kid.

Fuzzy also touches on his belief in the fundamental right to online anonymity and maintaining a digital persona separate from one's physical identity. The lighthearted conversation sets a warm tone as the hosts discover they're speaking to a thoughtful person with strong convictions about internet culture, not just a novelty username.

00:02:10 - From Covid Coder to Web Developer

Fuzzy reveals he's a recently appointed Astro core team member and shares the backstory of how he entered web development. A personal injury during Covid prevented him from continuing his previous work, forcing a career pivot. With a background as a biochemistry graduate who lost job opportunities during the recession, Fuzzy turned to self-teaching through FreeCodeCamp, progressing from HTML and CSS into JavaScript.

He describes his early struggles with tools like Create React App and Webpack, particularly trying to integrate Tailwind CSS, which left him frustrated. Discovering Snowpack provided a better entry point into React, but Fuzzy found himself philosophically at odds with the JavaScript-centric approach of frameworks, preferring a mental model where HTML, CSS, and JavaScript each play their distinct, standards-based roles in building web pages.

00:07:27 - Business Background and the Asteroids Game

Fuzzy shares his pre-coding career in business, where he spent years as a consultant advising small and medium businesses before burnout and ethical conflicts — particularly being asked to help lay off staff — drove him away. He then pivoted to web development during Covid and built an Asteroids game as a milestone project, inspired by a FreeCodeCamp YouTube tutorial and his childhood love of the classic handheld game.

This project became a turning point in his confidence as a developer. He rewrote the entire game engine using object-oriented programming and model-view-controller patterns, creating a fully resizable PWA with a canvas engine. Fuzzy reflects on the generosity of free educational content creators online, equating the sharing of knowledge with sharing power, and explains how this project proved to him he could build a career in web development.

00:11:12 - Discovering Open Source and the Astro Community

Fuzzy describes his accidental discovery of open source, expressing genuine amazement that such a collaborative model exists. He traces his path to Astro through Fred K. Schott's work on Snowpack, Skypack, and Pika, drawn to Fred's mission of bringing ESM to the web. A tweet about Astro's "HTML first, zero JavaScript by default" philosophy immediately resonated with Fuzzy, who was tired of navigating opinionated tooling and framework lock-in.

Unable to leave his house due to injury, Fuzzy found a home in the Astro Discord community. He recounts his first interaction — simply asking "what is Astro?" — and being warmly welcomed by the team. Over the following year, he contributed to docs, published NPM packages, participated in RFC discussions, and supported fellow developers, eventually being invited to join the core team as a community advocate.

00:18:38 - Astro's Technical Philosophy and Island Architecture

The discussion shifts to Astro's technical foundations. Fuzzy explains how Astro began as a static site generator with a unique selling point: framework agnosticism, allowing developers to bring React, Vue, Svelte, Solid, or Lit components into the same project. He frames existing frameworks as "churches" with their own opinions on rendering, state, and data loading, while Astro serves as a neutral platform that doesn't discriminate based on developer background.

Fuzzy makes a compelling business case for this approach, describing how a team with developers skilled in different frameworks can collaborate on a single Astro project rather than siloing their work. He walks through Astro's single-file component structure — the code fence for server logic, HTML with JSX templating below, scoped styles, and scoped script tags — emphasizing how this co-location model simplifies development while remaining ESM-first and standards-aligned.

00:21:22 - Converting a Next.js Site to Astro: A Practical Discussion

Host Christopher Burns shares his experience attempting to convert the FSJam website from Next.js to Astro, revealing he gave up when SSR data fetching didn't work as he expected. The conversation becomes a practical comparison of how the two frameworks handle routing, endpoints, and data fetching differently, with Fuzzy explaining Astro's approach using front matter, top-level await, native fetch, and full HTTP method support in endpoint files.

Fuzzy clarifies that Astro's SSR was only about five months old at the time, having launched in April with HTML streaming by default. He describes the adapter system for deploying to Node, Deno, Vercel, and Netlify, and explains how Astro endpoints can function as a lightweight backend with full CRUD capabilities. The exchange highlights how developer familiarity with one framework's patterns can create friction when switching, even when the alternative may be simpler.

00:32:06 - SSR Use Cases, Hackathon Projects, and Community Growth

The conversation broadens to explore Astro's expanding capabilities beyond static sites, including dashboards and offline rendering through service workers. Fuzzy highlights the Astro hackathon held between April and May, shouting out contributors like Pascal who helped advance SSR and HTML streaming. He encourages listeners to explore the hackathon showcase for SSR projects, themes, and integrations, noting that all source code is publicly available.

Fuzzy also promotes Astro's one-click browser-based development environments through CodeSandbox, StackBlitz, and Gitpod, and celebrates the v1 launch and site redesign. He describes Astro's community-driven development model and support culture, where the team actively helps users reproduce and resolve issues. The segment showcases how Astro's community has grown alongside the project rather than forming around it after the fact.

00:36:15 - Collaboration Over Competition and Closing Thoughts

Fuzzy articulates Astro's stance toward other frameworks, insisting the team views projects like Remix and Next.js as collaborators rather than competitors. He praises Remix's nested routing innovations and acknowledges Next.js as the better choice for complex web applications, while positioning Astro as the ideal tool for static sites, design agencies, and content-driven projects with its strong Markdown and MDX support.

The episode wraps with Fuzzy sharing where listeners can find him — primarily in the Astro Discord and on Twitter — and extending an open invitation for anyone to reach out with questions. Anthony closes by expressing his admiration for the Astro team's collaborative mindset and teasing future episodes with other Astro contributors. Fuzzy's parting words capture the community spirit: they'll reach the mountaintop together.

Transcript

00:00:00 - Christopher Burns

Will be coming your way.

00:00:12 - Anthony Campolo

A Fuzzy Bear. Welcome to the show.

00:00:15 - A Fuzzy Bear

Waka Waka Waka. Thank you very much for having me.

00:00:17 - Anthony Campolo

So we're just going to refer to you, I think, as Fuzzy. Why don't we start with that? Where does your name come from?

00:00:23 - A Fuzzy Bear

It was just a bit of fun. I wanted to change my Discord handle. It had carried over my old Xbox 360 username, and I didn't really like that. I had grown away from that particular persona, you know, the old days of Battlefield, student life. So I thought I'd grow up a wee bit.

There are two things. There's something I've always thought of as a philosophy. The way of the fuzz is a stoic mindset you have. You learn from what you've been through, and you constantly look to grow. It's just the fuzzy way of looking at things.

I've kind of grown into it. Everyone knows me as Peter, but Fuzzy is something on the internet. I feel strongly about the rights of anonymity and the ability to express those rights, those fundamental rights of the internet.

[00:01:07] And like I said, if you don't use it, you lose it. Fuzzy is one way of expressing a persona on the internet, something that you want to be other than your physical self. We have a digital image and a digital presence.

So yeah, Fuzzy Bear is pretty much a concept of my favorite animal and Fozzie Bear from the Muppets, which is my favorite Muppet character. When I was growing up, I never used to be able to say Fozzie. It was my little sister that actually reminded me of it. She was like, do you remember? You never used to be able to say Fozzie Bear. I was like, yeah. She used to keep saying fuzzy all the time. And that was it. Fuzzy Bear. There we go. That's the backstory. I never shared that with anybody.

00:01:40 - Christopher Burns

Thank you for sharing that with us. When I was researching this episode, I was like, am I going to be speaking to a Muppet, or am I going to be speaking to a person?

00:01:50 - A Fuzzy Bear

The thing is, I've tried so hard to find the actual Muppet, the actual Fozzie Bear, but I can't get my hands on it. Every Muppet I've seen on eBay is just shocking. If you want to see something horrendous, really Halloween-level scary, look up Fozzie Bear handheld puppets. It is honestly some of the most shocking things you'll ever see in life.

00:02:10 - Christopher Burns

It's really nice to speak to you, and you're actually an Astro core team member by the looks of it.

00:02:15 - A Fuzzy Bear

Yes, that was very recent. I've only been a core team member since June, but I've been around Astro since the very early days. How I got to Astro is pretty much my story. I'm a Covid coder. I've done a lot of things before I got into this web development industry and this career path that I'm now on.

The journey before that was when Covid came around, I picked up a personal injury and it totally sidelined me, so I couldn't do my previous jobs. So you have to have one of those come-to-Jesus moments and really take a hard look and go, right, what am I going to do? My background is that I graduated as a biochemist way back during the recession, and then all the jobs evaporated, especially in the STEM industry, especially in Scotland, and I couldn't really move. This is the thing about Scotland.

[00:03:06] It's like you go everywhere else and nothing really quite cuts it. You don't really want to go anywhere. Moving forward, I've always been interested in the concept of the web. I read a lot of blog posts. I got really taken in with the fact that it was an industry that you could learn. The more I read, the more self-learning individuals that I've found. There's this wealth of knowledge out there, and I figured I'd be doing myself an injustice if I didn't at least explore it. I'm glad that I did. Honestly, it was one of the best bets that I made, and I made a lot of bad bets.

00:03:33 - Christopher Burns

I totally understand where you're coming from. In the UK, we had some very brutal restrictions in terms of periods where we couldn't go outside. There was a lot of time where a lot of people just used that as free time off, but other people used it to reskill and rebuild. It's really cool what you've been able to achieve out of that.

One of my biggest questions is what made you pick Astro as a real learning and growing point instead of going down something like Next.js, where everyone's like, you don't need to know HTML or CSS or anything, just use React and Next.js and go ahead. What made you pick Astro, that very lean version of the modern web?

00:04:12 - A Fuzzy Bear

What made me pick Astro? Great question. My journey was that I went around all the bootcamps around Scotland to see what was on offer. I picked up word about this thing called the Jamstack, and at that time I was learning HTML, CSS, and I was in a gradual progression to JavaScript. That was through FreeCodeCamp, and they were my two pillars in terms of my own development.

I would highly recommend that to anybody that's wanting to get into web development. The resources are what I consider gospel when it comes to web development, and FreeCodeCamp has so many brilliant exercises and development pathways for you to actually get to grips with. It was really good, especially for an absolute novice who never programmed in his life before. I have to stress that.

And then the journey was once you got to JavaScript and you got through the JavaScript part, you got to React, and then you were stuck with this Create React App.

[00:05:06] My problems really started when I got introduced to Create React App and this whole world of Webpack configurability. My first problem was I wanted to use Create React App and Tailwind together. And then I realized that you had to eject Create React App and then integrate Tailwind. And then I'm stuck with this Webpack config and I was lost there for a bit. And then this is the thing, I get grizzly, I get frustrated, and I just go, sack it. And that was it. I didn't look at Webpack for a while again.

And then I realized there was another tool on the block at the time called Snowpack. With Snowpack, they had a React starter template that I could walk through at that point. I had some rudimentary skill set with a terminal, like reading basic documentation, etc. So yeah, the Snowpack docs really got me into React. And then playing around with React, I realized they were doing something that I wasn't quite happy with, and that was having the concept that everything had to be done through JavaScript.

[00:05:58] You were in JavaScript world. In my head, HTML is markup that gets sent down the wire, then the styles get loaded on top of that. That builds a tree, that puts the styles on top, it dresses up the tree, and then you have the tree shaking. It's like the tree interacting, and that's through JavaScript. So that's the mental abstraction that I developed in my learning.

When I'm having to put HTML into my function bodies, I think, this is not how I learned JavaScript, which was as close to standards as possible. I realized I needed to have sources of truth in order for me to learn what this is all about. There's a lot of opinions that I needed to get through and then be able to understand what is really at play, just to help learn, because I felt like I'm coming into this very late in the game.

[00:06:45] So it's like there's all this tooling, all these frameworks. I didn't even understand the difference between a library and a framework. You know what I mean?

00:06:51 - Christopher Burns

Very much so. I think one of the biggest things that I could take away from this moment: you went from a point in time where you were like, how are websites made, to I'm going to make the most complicated website ever for something so simple using React and Create React App, for example. Create React App is notoriously an interesting choice these days, but when you first start, you think, oh, I've been told to get React. I should go with Create React App, not Next or Gatsby or whatever else because it seems like second nature, but it's the worst choice.

00:07:27 - A Fuzzy Bear

Exactly. My life before web development was business. When I left university, I was done with academia, I was done with that world. And when I say I'm done with it, I never look back. I don't have any regrets, if you get what I mean. I don't carry regrets in my life. You carry your decisions.

So I went straight into business and I did well for myself to a point where I was actually a consultant for about six years. I even ran a cafe for the last two years because, like I said, I was done with that particular line of work because my clients were wanting something more than what I was prepared to offer in terms of my services and work. It was sad to see something that I made get to a point where it was something that I completely hated. I hated what it was doing to me as a person and everything.

[00:08:11] Because just to give you a bit of context, I was a business advisor. I was going about dealing with small to medium business owners. And I was the guy on the phone that would be able to help them because I had a good network. I had a really solid network on my phone of other businesses that I could then leverage services and provide facilities to help their business reach their particular objectives. And some of these guys, and this was difficult market trading times, were asking me to lay off staff. And that was not something I was prepared to do. So they were all wanting me to do that, and I was like, no, I'm done. And then I fell, got injured. Covid happened. That was it.

So two years in, I made this epic game. This was a game that really cemented the web for me, like I could do this. This was my end of year project kind of thing, and it was the Asteroids game.

[00:08:56] I'll see if I can share this with you. This was a game that I actually got through watching a YouTube video through FreeCodeCamp, and they had an Asteroids game, and I loved the Asteroids game when we were growing up. I was born in the 80s, so I grew up with Game Boys, really, 2D handheld games, etc., and Asteroids was the only game that literally the battery never died on. From the moment I got it, for about six years, it was the game that I had in the car that I just played. And then I saw this video and I was like, I want to do that. I want to do this.

And the way that the guy made the video is like, I would never say anything bad about the sheer awesomeness of all the people. You got to understand this, the absolute knowledge that is on the internet in terms of even web design, forget the sciences.

[00:09:41] But just in terms of web development, it's all put there by other people who took their time and wanted to freely share their knowledge. I've always equated knowledge with power. So if you're doing that, you're sharing your power with somebody else. That is the most fundamental gift you can give another person without asking for anything in return. That is the implicit trade that has been made with these content creators, with these educationalists that are putting this content out there. And so I'll never say anything bad about it.

I would just say that this particular exercise taught me this lesson at a time when it was a Wild West of JavaScript. It taught me a lot about past JavaScript and a lot of how the old methods were applied. And then it got to a point where I was like, you know what? I'm not happy with what I wrote. So I took it down. I stripped it down after a lot of pontificating.

[00:10:29] I stripped it down, rewrote it. You can check out the source file, or you can check out the JavaScript file as a single file. I rewrote the canvas engine, the game engine. There's no P3, nothing like that. All the logic was basically what the original instructor gave, massively adapted, overly reworked into objects and methods using object-oriented programming. I brought in a bit of model view controller elements in there as well, because there's multiple screens and this all works with a canvas, and it's completely resizable as a PWA as well.

I use this as my leveraging point, as what I can learn in terms of what the purist side of the web could be. That was a great exercise for me because it gave me a lot of confidence that I could do this. Fundamentally, I wanted to do this to make money. Don't get me wrong, guys, I'm in this to make money.

00:11:12 - Anthony Campolo

Same.

00:11:12 - A Fuzzy Bear

I don't like wasting my time if we're not making money. I also know what's enough. Don't get me wrong, I worked in sales. I sold a lot of crazy stuff, and I made a lot of commission off the back of it. But I want to do something worthwhile.

Now, this is the wonderful thing I tripped into: open source. Literally tripped into open source. This should not exist. This model, this whole socioeconomic paradigm should not exist. But yet it does. It's so freaking wonderful. And I'm still in love with the whole concept of open source, ever since I've really seen behind it and understood what it was. I'm just totally immersed in it, and that's the thing. I'm either in or I'm not.

00:11:48 - Anthony Campolo

So how did you first hear about Astro, specifically?

00:11:51 - A Fuzzy Bear

Fred and Snowpack. I come across as a fanboy every time I talk about this. But the truth of the matter is that when I was looking for people to follow and content to learn from, I started looking into Snowpack. I started scratching deeper into Skypack, and then further back into Pika.

Now if you go to Pika.dev, you see that he has five mantras about trying to make the web open. Now Fred's mission in life was to try to bring ESM on board to the web, and he did that through the likes of Skypack and Snowpack. For me, I didn't like the whole CommonJS thing. I was more on the ESM side of things because it made my life as a developer easier. I found that easier than the left-hand side of the argument, just from that, because I'm using Snowpack. And then I saw him tweet on Twitter one day, and I'm very rarely on Twitter, by the way.

[00:12:38] I'm socially agnostic to the platforms. I've grown over time with the social platforms, and I kind of put it aside now. And then I saw him put a tweet out one day about a new project called Astro Build, where it's HTML first and we ship zero JavaScript by default. I liked that because at a point I went from Create React App, and then I was going about all the different tools and libraries, and I spent a lot of time getting lost in this. The more I got lost in it, the more I was playing with people's opinions.

I didn't like that because I just want to play with the language. I don't want to play with your opinion set. I want to play with the language because I can't go wrong with the language. I can go wrong with your opinions because I don't agree with them. I don't understand them. There's so much cognitive processing involved.

[00:13:19] A lot of tools I started to see problems and pitfalls with, just from my own naive point of view. When I was playing with Next, I hated it. I really hate the concept that I'm having to build my website, just a static website. It's not difficult. I just want to make it simple. It's a simple, clear-cut website that my clients will pay money for. They don't care about all this newfangled technology. It's a single page application. It does this, it does that. They really don't.

In fact, I found that in order for me to pitch this platform as part of my product offering to my clients, it would have been a more difficult sell. Immediately, I found resistance in terms of the end delivery. How am I going to give it to my clients? Because don't get me wrong, I have clients, they don't care. They want that product out yesterday, not six months down the line, and they're not wanting what Next can offer.

[00:14:08] And the way I saw Next was like, Next.js is great for building web applications. These guys just want a website. There's a clear difference there. I don't know if I'm seeing it wrong, but that's how I saw it.

00:14:19 - Anthony Campolo

Yeah, I think that's good. And we had Fred on a little over a year ago to talk about Astro. So for people who want a little bit more of the Astro 101, they can go there. But how did you actually get involved with the team, though? Did you start just hanging out in the Discord, or how did that happen?

00:14:36 - A Fuzzy Bear

So I couldn't move out of my house. This is my life right now. I'm holding up a crutch. I've just recently had an operation to fix an injury that basically put me out for three years. Discord basically became a way that I could communicate with others from my little home that I'm sitting in, and the Astro community from the get-go was such a friendly, welcoming place. I wanted to meet other web developers. I wanted to be in a place where I could have the opportunity to learn from other people and the work that they do.

Astro was a new project. I wanted to learn how a new project like Astro got together and got built from a product development point of view, just to be a fly on the wall and observe and watch how a product like Astro got built. So I popped into the community, and Fred keeps shading me with this all the time.

[00:15:20] My first post in Astro was, "What is Astro?" And at that time they were all having a little call in the live chat channel there, and so they asked me to jump on. I jumped on and I spoke to them and they explained Astro to me. They understood where I was at the time of my development. And then they totally welcomed me. I really appreciated that. It's like, here's a guy whose products I've been using for the last year and a half, and all of a sudden I'm having a conversation. Small things like that.

A lot of these projects are online. They're projects, they're made by people, but business is people buying from people. In sales, people don't buy the product, they buy the person. That's what I learned, and I had a decade of that experience to go with. And then I was like, you know what? This is a place that could actually be worth my time and my investment because I see those two very much akin to each other.

[00:16:05] I'm like, all right, sound. The more I got involved in terms of speaking with other people, I got involved with the RFCs. They used to do this thing every Tuesday, more on a regular basis, at 7 p.m. in Discord, just to put a plug in, and it was open for anybody to come in. If you've got the time, just come in and listen to what features are being discussed, what issues are currently present, and get to speak to the core team if you wish to.

Every feature that has been put into Astro has gone through this RFC process where they discuss things in an open and transparent manner. You look for consensus, and there were a number of times where consensus has not been reached. Sometimes the proposal, when put out to the RFC, went through the call and didn't really flesh out, so it gets put on hold. I really like that.

[00:16:50] Just that whole input. And then I started building a couple of projects, started publishing some work on NPM. And then that's when I started contributing to the open source. It's like really getting involved in the support channels, getting to meet so many people, like so many different developers, and getting to know them as well and their backgrounds.

I started to put the people in Astro as the other astronauts. I started to create this garden in my head of what Astro is, what the community is. And from there, I felt like this was a place that I could belong in. So this was like a year. I was in the community just helping, speaking, learning, supporting as many people as possible. If we want to succeed, we only succeed off the back of others. And if we need them to succeed in order for us to succeed, we need to support others, is what I'm trying to say.

[00:17:36] And only by doing that do we get this collaboration because we're moving away from competition. We need to support each other and our work and our endeavors in order for us, as individuals, to get further. So we're coming into a space of collaboration. And that's what open source for me is. This is why I said it shouldn't by rights exist, but it does.

The Astro project has had, I'm sure it's over 400 now, 400 or 500 contributors included. I mean, the docs project. My first contribution was to the Astro docs, the old, old Astro docs, the one that was set up by Laura. She originally took Astro, Azygous. I'm building a doc site, and she'd done that for the project, and there were so many examples of other developers coming in and doing that for Astro to help.

The Astro project has literally grown with the community. It's not like the project came and then dropped and the community came around it.

[00:18:23] The community has grown with the project, and developers can jump off and do their own thing and they always come back. It's always like a welcoming home for them. We never want to feel like you're away. You're away. You're never far from our thoughts, kind of thing. You know, the fuzzy way of looking at it.

00:18:38 - Christopher Burns

It's really cool what the Astro community is doing. When we spoke to Fred, Astro was still quite early. It hadn't had its SSR support yet.

00:18:47 - A Fuzzy Bear

Yes. So Astro started life as a static site generator. And I really wanted to nail that static site generation story on point. And it was simple. We will give you HTML files, CSS files. You can bring any framework you wish to. Now this was also the unique selling point of Astro. You could bring your React projects, your Svelte, Vue, Solid, Lit, you name it, you could bring it.

You've got to understand, it's like all these frameworks are, in essence, churches. The moment you enter these frameworks, there are particular flavors on how you do certain operations: rendering operations, handling state mutations and effects, data loading, and all this stuff. Suspense. They all got their own unique takes on these questions. Rightly so. There can't be one answer to this massive scope.

I see these libraries as flavors of JSX. It's like all of them, including Svelte, are either flavors of JSX or pseudo JavaScript tools that make life easy.

[00:19:42] So they put developer experience over language and specification. That is how I see this particular set of tools. But the fact is that Astro didn't care what your background is. It is not prejudiced in that respect. It will allow you to bring your skillset to the table and allow you to then develop, along with other developers of different skill sets.

Let me just put it this way, Anthony, Chris. Imagine you're a business, right? The two of youse. And you've got a team of five developers. You've got like three of them are amazing React developers, two are amazing Vue developers. But they've all got different projects because they can't work together. You can't mix Vue and React together. It's like oil and water in this situation. What you end up doing, you end up siloing work. You've got two developers good at doing one thing. You've got three developers good at one thing. You would love to get them to work together on the same project because if you've got five people working on the same project, you'll multiply.

[00:20:33] You go up by scale and you'll increase your revenue as a business. So here's a platform that allows you to actually bring both your React developer and your Vue developer together on the same platform and utilize their knowledge and their shared knowledge now on the same project. From a business point of view, that allows you to unlock so much more potential for you to deliver to your client: scalability, product, and just revenue for your business.

Another revenue-related thing is that imagine that you were having to hire another developer, and he's a Solid developer, like a solid Solid developer. You turn around and go, well, do you know Vue? Now, do you know React? Please, mate, I learned Solid for a reason. All right. Okay. Sound. Well, tell you what. I'll still hire you because we build off Astro. And Astro has a solid relationship with Solid as a framework. So I could bring React, Vue, and Solid together.

00:21:22 - Christopher Burns

This is really interesting. You could say the opposite of having anything goes can be quite detrimental to a business. But I think it really depends on the business and what you're building. I have actually recently tried Astro. I'm happy to give my thoughts on it. I had to give up on it.

00:21:40 - A Fuzzy Bear

Why?

00:21:41 - Christopher Burns

Because Next.js just did it for me. So let me give you the example. Let me paint the picture. We've just redone the FSJam website. We used Tailwind UI's template as the default, and I read a tweet a while back from another Astro core contributor. I can't remember who said, I rewrote it out of Next.js into Astro, and it was like so much more performant, so much less JavaScript. So I was like, okay, cool, I think I could give it a go. So I built the website completely in Next. And then I thought to myself, just for a laugh, could I convert it to Astro? Could I take it all the way?

The sour point in this moment was I couldn't get SSR working right in the way Next works SSR for fetching data. So I gave up. But I'm pretty sure if I actually worked out how to fetch the data correctly in Astro, I could have still been carrying on, but it was confusing to a certain extent.

[00:22:39] When you're so used to Next.js getStaticProps and getStaticPaths, you could say all the ways it kind of does. These things are all really hard to understand, but if you understand that way, it makes sense, and Astro is slightly different.

00:22:54 - Anthony Campolo

Chris also doesn't read docs, so he probably didn't just go to docs to do it.

00:22:58 - Christopher Burns

I did read the docs. I did read the docs user manual.

00:23:02 - A Fuzzy Bear

Here's the thing.

00:23:04 - Christopher Burns

The part that confused me was that it would give you TS files for things like fetch, but then you would also have an Astro file, and I didn't quite get how it all connected. Like it just simply connects with Next, if that makes sense. Like Next, you just put the functions in and it's like done. But maybe that was just me not understanding it in that moment. And I should really go look at it again.

But the biggest thing to say out of all this is that the new FSJam website is out, and when you do Lighthouse scores and such, it does rank quite high, but it still says it has a crippling amount of JavaScript in it. For something that you could say, well, the audio player needs JavaScript, but everything else is just standard HTML. I would argue that Next.js is overkill for such a website, but at that moment I found Next.js easier.

00:23:56 - A Fuzzy Bear

I like this particular use case because it speaks of two things. First of all, Astro began life as a static site generator. It wasn't up until, I believe, April that Matthew managed to drop it. Now, Matthew is one of the co-founders and core engineers of Astro. It was a project he was working on since the start of the year.

Astro, you got to understand, positioned itself to be in the middle of the breakfast table, or like I like to say, able to take the best practices of a lot of different people and be able to bring them together and build off best practices and open standards. I like to mention that together. We are now in August. It was like five months old. It's been tested and it has been battle tested by the community a lot, and it's improved a lot. There's a lot more work coming post v1 in terms of SSR improvements and the support and the primitives that will be able to deliver for these guys.

[00:24:47] But when it comes to server-side rendering in Astro, it is actually quite unique how we do it. It allows you to be deployable on many different platforms like Node, Deno, Vercel, Netlify, you know, those deployment targets. We have what are called adapters for them. So you've got to take the concept from Svelte and SvelteKit, the adapters that they have for their different deployments, which is quite a nice way of doing our configuration.

This is just another thing with Astro. We like to make it as minimal configuration as possible. So if you're going to configure Astro, it's just going to be, I need this tiny bit. Nothing more. There are not that many overly bloated config files in Astro projects, which is a lovely thing, but with SSR it has grown a lot. So you can set endpoints utilizing either Astro files.

Now you've got to remember, in Astro, you start your Astro file. An Astro file ends with Astro. And it has what we call the code fence or the front matter.

[00:25:40] And that begins with three dashes, and it literally looks like a fence at the top of your file. And within that contains all your server-side logic, all your business logic. This will be logic that is run every time that page is hit. So every time that page is hit, that logic is going to get rendered.

And then what you put underneath that is a very lovely relationship between HTML and JSX. That's what Astro uses as its templating language, pure HTML. And you could use JSX to give you that additional functionality, like putting in conditional slots is a great example where you could have nested ternary operators and have different flows based on the data that's coming out of the business logic. And you can determine what template is getting put out, all the styles.

You can have your styles encapsulated within the same Astro component file. So it co-locates both the HTML and your styles together, and those styles are scoped directly to that particular component file. Every file is a single page component file.

[00:26:36] So it's like all of these are scoped together. And if you wanted to add JavaScript, you can. Pure JavaScript. All you need to do is just put in a script tag at the bottom of your page, and that gets, again, scoped to that particular component. So single component files bring in four key parts of what we normally write in terms of a web app, which is the server-side logic, the HTML file, the CSS file, and the JavaScript file. It brings them all in the same place and then provides that abstraction layer for you. It makes that co-location so much better for information and data. And so development is a lot easier. There's a lot more refinement in this file, and everything to do with it is there.

It's also ESM first. You can import stuff directly, like import your stylesheets into the front matter and that would apply over your template.

00:27:20 - Christopher Burns

I think the biggest problem here is that I don't quite understand Astro enough to jump into the SSR straight away, and because, as you were just saying, it does it so differently. I was using my React brain thinking, oh, I'll just define static props and bish bash bosh and it will just work. And it works slightly different.

I was like, okay, I'll define a function to fetch the episodes using a path. And then I think the part that really got me confused was I didn't get how to pull the information out of the fetch into the component to then start spreading the props into the child components. But Anthony said earlier, you said Chris doesn't read the docs. I read the docs and I didn't get it.

00:28:03 - Anthony Campolo

Well good job. I'm proud of you, Chris.

00:28:05 - A Fuzzy Bear

I think I see what you're trying to do, and you're right, you tried this very similarly to how we do it in React and Next.js. So with Astro, you can set your endpoints and you could call them within dev. You could fetch data from them. You can make your request and it will fetch that data from that, if it's an SSR.

00:28:24 - Christopher Burns

Fetch it. The part that confused me about the documentation was that you would have a slug parameter. So you go [unclear]. But then you don't define a component, a layout, any HTML in that file. You define a GET that has a response of a status. That's what threw me off. I was like, that doesn't work the same. I expect it to just work the same. Not that it should be, if that makes sense.

00:28:51 - A Fuzzy Bear

So for instance, when you hit this route, you've got basically the square brackets title dot Astro. So you would hit the title, say, recording one, that should then get a response back to you. And that's what that get method is with Astro. It gives you the full HTML methods that you can actually write. So you could actually write a put method, a post method, a delete method, etc. You can actually do that through front matter.

But normally, when you're hitting these Astro files as endpoints, it normally gets the page and passes back the response along with the body. Now all responses are streamed back. Astro does HTML streaming by default when it comes to server-side rendering, which is cool as hell because it means that time to first byte is next to nothing. But I'm just trying to see it. It almost felt like you were close, but something happened, and I'd like to take the time to play about with this.

00:29:41 - Christopher Burns

If you could look at the Next.js source code and the Astro, and if you think you could help me convert it to Astro, I would be very interested to see almost a one by one of how much Astro actually cut down on Next.js because, like I said, on the highest level I understand that 90% of the website is just HTML. It doesn't need to be anything more. But the reason I jumped so fast for Next.js was because I understood how Next.js does fetching data remotely, but I am interested in learning more and hopefully deploying with Astro in the future.

00:30:19 - A Fuzzy Bear

I appreciate that. To be honest, let me just say, pass me over the repo and I'll take a wee look at it. So what you said, right? Let me just break this down. Your original site is majority static, with the real interactivity being the audio player, that being the only real interactivity.

So on Astro we see things in terms of island architecture. This is something that I would like to also just mention briefly, how powerful island architecture is, especially when it comes to atomic component design. A lot of the components that you create, so it's like you do your fetching. With Astro you have top level await and fetch. So fetch is your native mechanism that you use to bring in any data into that component. And you can pass that data back into the HTML using shorthand and variables and props. And also you can pass in children using slots and you have name slots. You could also have conditional slots.

[00:31:06] There's so much you can do with Astro in terms of component design and component creation that you can flow data and the output of the different component files based on what data is coming in. You can direct it based on the props. It can be directed based on the data. You could interact with the styling and all that stuff. It's really granular and it's really cool.

But when it comes to server-side rendering, that is just awesome in my opinion, because you could hit JS endpoints as routes and it allows you to set up full CRUD commands so you can set up your create, read, update, delete in a single endpoint, and then you can interact with a database layer. Because this is just JavaScript. You just import your Mongoose database layer. Then you can interact with that. You create your CRUD command. So in effect it kind of gives you a small little back end because it all deploys as a single server file to Vercel, Netlify, etc. It just works out the box.

[00:31:55] And then you can use that in your actual component file, fetch that data or hit that endpoint and you get the result back. Bob's your uncle. You can have that in your template, and then you deliver that as a response.

00:32:06 - Christopher Burns

So what you're actually saying is that Astro is not only good for static websites, it's also great for dashboards.

00:32:13 - A Fuzzy Bear

Yes, to be honest. Server-side rendering has really unlocked a lot of use cases. Astro did a hackathon between April to May. There were three categories: SSR, themes, and integrations. And I feel like I should give them a shoutout. In SSR, Pascal is a maintainer in Astro. He's off doing his own thing, but we highly value Pascal and the work that he's done.

He helped push the SSR, the HTML streaming effort because he helped sketch out the environment, went out and, like a photographer, came back with a map to tell us how to do it. And then he basically showed it. It was like, this is possible. He also made an Astro service worker, which allows you to render Astro pages offline as well, which is fantastic. Bear in mind, with Astro now, you can actually utilize all of the plugin ecosystems.

[00:32:59] We also have a PWA plugin as well that you could use. There's so much more. I'm going to just ping this over right now. This is Astro Hackathon Showcase, and there's a number of SSR projects in here. I think there was about a dozen or more SSR projects that you could check out, and all their projects, all the source code is there, and some of this stuff is absolutely off the hook, even in the themes.

By all means, do check out the themes. And if you want to share it, please do share this hackathon website because it is great if you want to check out Astro. There are a couple of sites that I'd like to mention towards the end of the stream. Astro allows you to go in and play with Astro. You can spin up Astro in your browser utilizing the amazing projects that are CodeSandbox, StackBlitz, and Gitpod. They're just one-click deployments and you can get them in your browser and you can start playing with your Astro idea.

[00:33:48] And the time to development is next to nothing. It's like you literally one click, and it's fantastic. And what else? Astro Build. The actual homepage for Astro has been given a lovely rebrand and redesign for the v1 launch, and I'm so happy v1 is here because, trust me, I've been with Astro since the early doors. It was a very rocky ride at some points. It was definitely fun. And I have to say, each one of those points where Astro broke on you and you went out and you figured it out yourself just made you that tiny bit stronger.

We have the same in Astro. We'll happily throw you under the bus, but we will be there to pick you back up and dust you off again. So this is the thing with the support squad. We will be there to help our astronauts out whenever they get stuck. We always ask for reproduction just to try and see what they've done.

[00:34:35] If we could replicate the issue and if we can, we'll try and get the issue solved as quick as possible. That's the thing with community driven development. That's what Astro is. It's a community driven project. And without it, we'll be lost.

To come back full circle to what you asked me is, how did I become a core member? People asked me if I would be interested, if I was willing to do this. So my role really is I look after the community as best as I can. I've always advocated the users in Astro as much as possible to the core team, and I'll always continue to do that.

So if there's anybody that ever has an issue with Astro or anything to do with the project, or wants to just reach out and speak to me, my DMs are always open to you guys. And so, yeah, Astro Build for Showcase to check out all the amazing sites that are there, and integrations to check out all the cool things that you can plug into.

[00:35:21] Astro project, all the amazing community made projects. Honestly, by all means, check out some of these amazing plugins. You'll be amazed at what's out there. And this is just over the last year, so there's so many cool things that the other astronauts, and we call them astronauts because it's like the closest you will ever get to space, guys.

00:35:38 - Anthony Campolo

This is really great. We'll have all these links in the show notes for people who want to check it out. The last thing I would say for the kind of SSR/SSG thing is, I find it very telling that Astro is both seen as a competitor to Remix and also to Docusaurus, and that kind of shows the interesting middle space it sits at. Because you have Docusaurus, there's like an SSG doc site. I know those two get compared to Astro docs, and then you have Remix, which is doing more of its SSR thing, and Remix definitely sees Astro as a competitor because they've been talking to them on Twitter like everyone else. So I think that it sits right in between the two.

00:36:15 - A Fuzzy Bear

Speaking to us as a project, let me just be completely honest with you. As a project, and I can say this for the other core maintainers, we don't see these projects as competition. We see them as collaborators. We're in the same journey together. We are all trying to make the web a better place for our developers, to make the web better for our clients. As a cycle, we are all in this boat together.

We wish the Remix team the very best. We really do as a project. What they're doing with their nested routing is fantastic. They've taken Next and some of the problems in React and the Next paradigm on and tackled that head on. And what they've done is fantastic. Sometimes their Twitter could leave something to be desired. But you're free to express yourself whichever way and method that you wish to.

When it comes to the likes of Next, we're not competing with Next.

[00:37:07] We see Next having a very strong use case. We're now at a point in our web development, even as a web developer, not as a core member of Astro, as a web developer, where we have such a selection of tools that we really need to see ourselves as a tradesman who comes onto your site with a bag of tools ready to burst out a brilliant job because he's got the tools there for him. He doesn't need to go back to the van to get what he needs. He comes back and he's got the tools ready.

And with us web developers, we've got such a wide selection of amazing tools to build projects for our clients. This is the time to be in and about making as much money as possible. We've got the tools. Why not make it B&Q? Home Depot, yes. Sorry for our international audience.

00:37:55 - Christopher Burns

Don't worry. I know everything you're saying. Like B&Q. Yeah, I know, B&Q. If you say to someone outside the UK, oh, B&Q, they're like, what the hell is that? The funniest thing. This is a sidetrack for a moment, but the funny thing about B&Q is they couldn't actually get the domain B&Q, so they got DIY.com.

00:38:10 - [unclear speaker]

.com! I remember this. Yeah, yeah. Oh dear.

00:38:15 - A Fuzzy Bear

I know, it's like that was the thing. So when it comes to Next, if I want to build an awesome web app, I'll build it in Next. Don't get me wrong, I'll happily admit that. If I'm going to build a simple static website for my clients, I'll be picking Astro all day long. As a design agency, I'll be picking Astro because Astro is the only one thing that brings developers, content creators, and designers together.

We will get this journey sorted because we've got the best end-to-end Markdown story, in my opinion. And I hate to be biased about this, but I'm strongly in favor of me thinking that we have one of the strongest Markdown stories possible. We allow you to write plain Markdown for those who know, and we even give you MDX. Astro also allows you to write just simple HTML files. You don't even need to write Astro files anymore. You can just plug in your HTML files. Fair enough, you won't have the front matter side.

[00:39:04] There are certain things, this is just plain HTML. Stick to the specs, but you could drop your HTML files in. There is so much even for a new web developer. You could just come and spin up an Astro project and start your learning exercises in Astro.

00:39:17 - Anthony Campolo

Awesome. Well, you had already given all the links to where to find stuff for Astro. But why don't you give some links for yourself? Where can we find Fuzzy on the internet?

00:39:26 - A Fuzzy Bear

You will always find me in the Astro Discord channel. So Astro Chat and you'll always find me there. I'm on Twitter at Fuzzy Br2. I still don't have a website, I must confess, but you can always email me at Fuzzy at Outlook.com as well. If anybody's ever got any questions, queries, or anything that they want to talk about, I'm always here. I'm always willing to help and support anybody in this space as much as possible.

00:39:50 - Anthony Campolo

Well, thank you so much. Definitely recommend listeners check out Astro if they haven't already. We've mentioned it plenty of times throughout the course of this show. We've got some more people coming up in the future. I know we're going to be talking to Ben Holmes again and Dan Jetten as well. I love the Astro team. I think you all are super cool people, and I like the general mindset you have about, you know, this is a collaborative thing. We're all trying to make the web better. So I definitely really love the Astro team. I love the Astro project. And so I'm always telling people to check it out and we'll continue to.

00:40:22 - A Fuzzy Bear

Thank you very much, Anthony. Honestly, we appreciate your backing. The thing is, we'll get there, we'll get to the top of the mountain, but we'll get there together. We will enjoy the vista. But anyways, guys, this has been a blast and a pure pleasure. Thank you very much for having me.

00:40:35 - Anthony Campolo

Thank you.

00:41:05 - Christopher Burns

When we spoke to Scott, Astro was still quite early.

00:41:08 - Anthony Campolo

And Fred.

00:41:11 - Christopher Burns

Fred, when we spoke to Fred, Astro was still quite early.