Hackweek Overview - What Is It, What Did We Build

we we get to talk about it and explain it to to you, the listener. Or I know Scott built something that we've been been dearly Node. So let's do this right now. Let's do each of us can give a one sentence of what we built just to hook y'all. Elevator pitch. And then and then we'll go into, I don't know, ten minutes or so explaining what it is that we did. So,

Like Oh, yeah. With the Century logo. So Yeah. Day two JS, like, could I just get graphics on the screen? And, SGDK made that fairly trivial,

But so we didn't actually build stuff for Century.

absolutely everything and spitting out, like, whole ass apps, which is

where all of the collisions were on this map. So imagine, like, a flat tile map, and then for each tile, you can say, well, this is a ground tile or this is Yep.

Century Seer logo JS bouncing around.

build absolutely

that, like, it was slowing me down to have AI generate any code for me. So I mostly used AI, for planning and for being like,

I love that. Definitely. I will say, Scott, I you you win the Just Ship It award for the ESLint team, because this is something we Node,

don't know, maybe six months ago.

as every single Yarn. It's called Hack Week. And during Hack Week, you are allowed to go and

and then day four focused on, like,

on, an ESP 32 microcontroller.

for the hell of it because Don't know, maybe six months ago. And I just I just took that,

Mhmm. And then the Sega itself supports a player,

And then and then also, like, quite a bit of of my time was trying to understand how to best issues, which Wes really cool. And this year, I did a there's network latency. There's low powered like,

AI to play nice with Svelte five. It is a massive struggle. And the amount of time I spend going back and forth with it, no matter what the model, no matter how I have it set up, no matter how many times I beg it to use contact seven, I have it it's just it's making bad choices.

it seems like you'll probably want this at some point in the in the schema.

wiring you have six panels or nine panels up there? Nine panels. So this is a 16 by 16 has resource loading, so, like, it can automatically turn images into the right type and stuff like that. But I also wanted it to automatically load collision maps from an exported thing, and I used and you write that with Java. So I used a cursor to help me write all of that Java code to generate those, This thing only has, I think, is it six 16 k, built a custom Sega Genesis game. I'm gonna swap to the camera.

It was kind of a kind of a fun one.

I wanted to do, Century.

we are interested in how it works, and

a width by height matrix that defined

Pretty fun projects. I'm really excited to share what I've been working on. I'm really excited to hear what these guys have been working on as well. Yeah. My name is Scott Tolinski,

it gave me an opportunity to explore, you know, my, local data syncing system stuff. It gave me an opportunity to work deeply with the file system API

parts of, like, the rest of your your business or the rest of your job sort of having to get done. You can just spend some time working on whatever it is that you want. So,

application that we will be releasing here, so that other people can use this and engage in battles and, put together leaderboards and all kinds of fun stuff.

company wide. So, yeah, a shout out to Century for planning such a great hack week, producing such a great hack week, and shout out to everyone at Century for bringing their a game. I I showed up to this thing, and Courtney's like, what are you putting so much time in? So I'm coming to win. I'm doing this to win. And then after watching all the videos, she was like, are you gonna win? I was like, I don't know. I don't know. I have no idea. Everybody was so good. It was crazy. So, yeah, shout out to the whole the whole org. Everybody rules at at Century.

having any sort of influence over your company, yeah, real time coding platform for my other hack weeks. I I think they they all haven't been real time. The first one I did Wes, like, I wanted to do, like, a Node replacement that's saved to markdown. So that way, we could edit notes in real time, but Yes. You made

256

I have power constraints because this is turns out this is a a hell of a lot of LEDs. You know? I have a a huge appreciation And then I used PartyServer Yeah. CJ just CJ just dropped his, hardware wise, you know, designing, soldering, building all that stuff together.

importers.

that I I would not necessarily hit in, like, a web app just because there's there's limited memory. There's, has a entire week,

Okay. Oh, that's cool. Alright. Let's save some of this for the deep dive because we're getting a little too in the weeds. Yeah. Yes. This is cool. We we got a lot of questions. Okay. Next one. Wes

That's that's amazing.

Mhmm. So they had all of that code written, and then that so that made it fairly trivial. So, basically, they had an example map. They had the collisions,

And, like, even producer, Randy, we're gonna have a whole video. He he made, like, a whole ass app,

because the AI was able to determine for me things like, well, down the line, you might not need this right now, but,

for constraints.

projects that come out of the Hack Week every single year that go directly into Century, either months later, weeks later, half a year later. I mean,

processors. The the thing is running

mini LED matrix like that or even Node even smaller than that, and it was a pain to get it up and going. So I can't imagine for

16 Bos math.

I hit so many things that were So it was really cool because I I had to build the whole hardware LED grid right here.

what, the first hack week I did Wes I did the real time whatever,

that, and I wonder what how Scott would approach this type of thing.

That's some of the comments I saw whenever, your your Hack Week demo video was playing.

And I just I just took that, and I just said And Wes, yeah, we just use Vite locally, but it's just so much better to be able to, like, have, like, a full blown app JS well as for editing sake, you know, being able to see what how everyone's doing all in one screen.

like, just from last Yarn. Like, last year, we had AI, but, like, this year, where you have so many more constraints,

about, like,

as well as as people who work in, like like, Scott, where you're trying to connect like like CJ, it gives you a bit more of an appreciation

I decided to take a a bite off something that was kind of large and build a competitive coding platform.

to design a level and not have to, like, literally write zeros and ones in an array to define, like, collisions or where tiles should be.

Yes. So there's nothing official, and that was so day I wrote, like, a whole timeline of what I went through, but, serial port. So you can actually read and write data from where you plug a controller into, and that could potentially connect you to the Internet.

and we can use that in the video.

good. What is the URL for this thing again? I'm like, okay. I'll add in the schema. Thank you. And I think that in that aspect, it was is helpful, but coding wise, it slowed me down. This is like a really, yeah, rough slog for using AI, but it was it was very fast to work in coding wise, so I didn't need it. That's I just added a a show idea because, like, that's that's a show in itself JS using AI for either undocumented

the pixels that have changed What's up, everybody? We've got a Hack Week overview for you today. So you can't just Npm install something and and slap it on, like, a $5 microcontroller.

get them to set up a Hack Week.

You are

and then, build a a full on ass app that has, The results that came out of Century's Hack Week

day three was where I was like, okay. I need to figure out if there's a game engine now. Day day two was, can I just get graphics on the screen? And I ended up getting a Sanity logo.

engine, but, basically, I wrote a whole thing on the server that would take in on one. I'm getting the weeds, but, there's power constraints, and you can't just run a whole bunch of power right through it. Right? You have to inject the power, and then there's constraints around when c is the abstraction

one, we need some way to make it fun,

matrix,

new tech or different tech Yeah.

Nice. And I

what did I do last year?

Oh, my yeah. I noticed. I saw you posting stuff on YouTube. I'm like, Wes is starting early. This is not fair. I'm gonna have to, like so I did a bunch of preplanning work for mine because I didn't wanna start too early, but I worked

for the Century Hack Week? Yeah. I watched all the the Toronto ones, and there's there's some really cool stuff. A lot of people

If you can,

there are power constraints. Right? Like, basically, the way that this works is that the the power is injected

anything

on these rules. On my computer, and then I just proxied it out to the Internet. And I had, like, hundreds of people. Someone started spamming it at some point, which made my Internet stop working.

So it's 256,

so hard. I put in nights. I put in

for it. There's there's, you can only update it so often. You know? I tried to do real time video, Yeah. Man. Wow. You know you're in deep when I had to solder a whole bunch of stuff together. I I designed a whole bunch of stuff in in three d and three d printed it. And then I built a whole software stack. So there JS, like, a there's a back end, which I built into Cloudflare Workers. I'll go into the weeds on that in the in the next video.

Yeah. And I and I figured out some things, which I'll share on on the deep dive. Like, it wasn't perfect,

that, like,

but there can only be up to 64 colors on the screen at a time.

and it allows you to write C code for the Sega Genesis. So the Sega Genesis, all of the original games that were written for it were actually written with assembly code. And so assembly code is basically

Printer. Oh, receipt printer. Yeah. That that auto printed off, like, photos and videos for or not photos, but photos and texts from people on the Internet, and it auto printed my my Sanity custom keyboard shortcut thing. Second, that did some LED lights. Last year, I did

it's not that scary. I I think, like, a hello world c program like, the the main thing about c is, like,

that has buttons on and call server functions at once, and there's constraints around what's the best protocol over the network to to do it. So I'll I'll get into all the weeds there. So that was really fun, and, like, this is the first, like, bigger project I've done with durable objects. I've built three or four things here and there with it, but this was, like, the first time where I spent 6 or whatever, who's good at their

all encompassing, get deep onto these things. CJ, what was the end result of your Hack Week? How did how did you finished it. You made your your you you made your video game.

is wild wild to see. Like, people are able to take their ideas.

Yeah. There there is, by all accounts,

So learning all of that was probably the hardest part JS, like, figure out how can I convert my images to be

and to push through and work on all this stuff just because of the sheer motivation of it all.

Therefore, people can vote,

Yeah. I'm I'm pretty excited about that because, like, me and you did a convert it to React. Right? And I built it in vanilla, and it did all of that. And I leaned on it pretty heavily for the front end because I was spending so much time

gotta say, Wes, you said it's free from the normal things of work. I worked

They're the the syntax itself was informed by literally the C language. So Mhmm. Even just looking at C code as a JavaScript developer will look somewhat familiar. It's nothing crazy. It's just you kinda have to learn about pointers and structs, which if you learned

I'll explain how. I I just ran my local

So,

Yeah. I suppose to say I love how big it is because, like, I I've tried to do little hardware projects with, like, a mini

So LED several days working with CloudFlare's durable objects.

and I

which is kinda kinda fun. I had, like, 80 people in it at at one point, and everybody sees it. And then I wrote a whole, like,

And this time,

And then from there, if they're too big, I have to break them down so that they can get loaded onto the screen. Yeah. So that was day two. But then after I figured out all all of that, I was like, okay. I wanna be able

L d t k. Dude, I've messed that up so many times.

traces. So these little balls are traces,

There's a number of benefits here, and a lot of that was taken into consideration when I was, like, planning this out. Like,

that is so funny. So I I kind of saw it as a challenge too be because I was writing c code and, like, the SGDK, which wasn't that popular, like, how well could AI actually write code

Wes.

That's so dope. Yeah. You you took an opportunity to pick

ludicrous. Like like, why would you do that?

by day one, I had And we will catch you in the next one, folks.

different colors,

type in make a React component

Did you guys watch the presentations, What do you think I should have in here that I haven't thought of? And, like, that actually was very successful

in my LED grid. Yeah. Because it's pixel art, so it looks awesome. That's awesome. Oh, yeah. You're right. Man, it's it looks so

create a sprite and set sprite location and and different things like that. Yeah. I think my favorite assembly code video game lore is that the Rollercoaster

exploring stuff, but a lot of people simply just, like, fixing stuff that bugs them. You know? Yeah. Like, it's just like, this has bugged me in Century forever, filming light is a very hard thing to do, especially when you're also trying to film yourself. It's all light. Technically, you're you're filming light even if you're not filming light. Right?

Yeah. I will say for anybody that wants to dip their toes in this stuff,

It was really interesting to

Wes,

Definitely. Alright. Let's hear what you got. Yeah. So I made a,

if I've won. Yes. And, like yeah. Yeah. The elevator pitch is CSS battles, but real UI. That's awesome. Because I think,

Yeah. Yeah. That's Node.

login accounts and what my my schema file is

yeah, real other people would use this too.

ended up being a result where I was moving so fast

I have right behind me, and that was a lot of fun.

I'm not proud of the fact that I didn't get a full game. Like, there's no boss level. Basically, this this level is the only one. But the fact that you can create at least an entire level

we'll get a little bit more into that in, in the following videos. Anything else to add, guys?

Mhmm. Objects, you can you can learn those things as well. I I'm curious about the game engine side of things. Yes. Because your game was like a little platformer or a little seer CSS

Hack Week participants, and one of them is just ship it. And that's where people can vote on, hey. This is something we need, so ship it. And there were there were several in the demos that were like, yeah. This is awesome. Like, this why does why didn't this already exist in Century?

what was it? Like, we we did, like, a button. Like, can we build this button sort of as a CSS battle, but also, like, this is this is real world. This is something you would actually do instead of just try to put, like, a Pokemon ball on a screen.

grid, which,

have up to 16 colors.

send the data

most real world Node, and, like, how is how does it feel, the best feel? So users can vote on those parameters.

And because I was so motivated to fix this, man, it was such a joy to learn Yeah. Written in assembly by one guy. It's three the three d game we're talking about. Right? Like, Roller coaster tycoon. The the the yeah. Yeah. Insane. That's

Sanity

People out there, if you are in a place of It was a long and,

and then I could start to go in and and modify things, because there's for modern web for modern game development, there's a lot of tools out there for developing levels and developing tile maps.

If you're watching the video, it looks like crap on my camera, but it looks so good in person. Like, the colors and they have nine of those, which is about, what, $23.00 you don't have the the pressing Mhmm. There's you're a lot more limited in in things that you can touch.

on top of that.

for

ecosystem for doing this kind of thing has, like, kind of exploded. I say modern. A lot of the these tools haven't really been updated in three, four years, but the technology is 30 over 30 years old. Modern. Yes. Yeah. So how did I do it? There is a software development toolkit called SGDK,

CSS and UI. So it was like the technical challenges portion of this got done in a way that was so acceptable so early, and that's a largely a testament to the stack that I'm working in. So when we detail that stack,

People also said Wes could use this for interviews, like, when they're when they're hiring somebody to, like, build UIs.

or

code bases with it. Yeah. I wanna ask you guys about your usage of AI in this project.

were unreal.

I could do that so much better today if I were to take on that project again. It ultimately wasn't very successful. It it it worked. It, like, created PRs and stuff, but could have been better. The second year, CJ and I teamed up and did a, I just was wondering, like, alright. Is there another way? And then I just started getting into all these interesting ideas of, like, well, what if we wanted to write the code on our own machines and have it update?

I built a real time

Node

And then in the next three episodes, we're gonna go a little bit more in-depth That's amazing. Unreal. I can't wait to hear about let let's I I don't necessarily care that much about minor Scott. I wanna know how the hell you built a Sega game, so let's start with you.

Vercel designer toolkit. But, yeah, it's a it's a GUI app where you can, like, draw with tiles, and then it exports. And so this engine And so I found a project And then for any given tile, because it's a tile based system,

Yeah.

I built a real time competitive coding platform focused on real world user interface challenges.

they had c code for a camera,

to do anything.

Peace. Peace.

kilobytes of memory?

on hardware,

500 lines long. So it is a legitimate

fairly simple level Node, so they basically had this giant image that was like a Vercel.

drawing LED grid

about motivation here. Yeah. We often talk about motivation on this show. It's like, when you are

from the, like, the the server diffing to the actual hardware. Right? There's a lot of challenges there. So I spent a lot of my time doing that. And then being able to just, like, We'll, we'll get a little bit more into

Yeah. I I I explored the LDTK

And I had a hello world by the end of eight hours. It took me eight hours to get a hello world. But, the the modern just 16 colors? a modern developer, it it's a lot more approachable. You have functions you can call that say, like, at one point to

I'll I'll I'll show you guys just how simple this application is to work on, and that's one of the big reasons I was able to do so much. I built a whole CSS

that tile can only,

to markdown.

that is is web controlled.

And then they had a c

I don't know if you call it, like, a recon reconciliation

As you can see, like, what they're working on in real time, you can see their code. So, yeah, it's it's it's an awesome idea. Yeah. There's a lot here. A lot of fun technical challenges. And

we all all three of us did three totally different projects,

And then I all I kinda also mainly used the chat

artwork on,

and eventually, you'd be able to bottle battle a bug boss where you throw traces at him to solve the bug.

I love it. But this this is the one level. Basically, it's just like a a platform that moves up,

are just absolutely beautiful, and I'm I'm really happy with it. It's just very

login. I had the whole coding interface, not like the UI for it done, but, like, saving files locally, saving to the date like, I had all of the difficult technical challenges done day one. And then day two could be focused on app stuff, and then day three could be focused on UI, something with hardware JS always. This is your third Hack Week project,

I used a bunch of technologies that I was fairly familiar GitHub, but threw them together in a way that I have not used them before.

that connected it to a React based front end, and and you're able anybody's able to go ahead and draw on it. And, like like, right now, there's there's four people in it right now, I'd

Peace.

submitted projects.

for

They can use the code because the code is,

Oh, okay. That kind of thing. And so in their code, they literally had a giant array where it was zeros if they shouldn't collide and then ones if they should collide. So one if it's if it's ground.

called Platformer Engine, and it's just someone that was working on this, like, over five years ago, and they tried to make it a little bit easier. So, basically,

as part of, like, the the web app state, and then it would send it over to the grid.

and all of them have used hardware. Is that correct? Yes. Yes. All of them. The first time, I did a little

except you have to worry about memory.

Tycoon game was written in assembly.

we have Different levels for sure. Vibe coding

being loaded as not just an image. It's being loaded as code. They can use it and and try it out. So voters, the audience, can now vote, and we could publish the battle results before we publish the video.

you want. And this is a really fun week because, this stuff to to the Internet and you don't necessarily have

coding

and and here, I just went and fixed it. You know? I I took a week and went and fixed it, and I was like, holy shit. That's way better. Yeah.

was when at the end, he's like, if you wanna know how any of this works, don't ask me. I don't know. And I was just like,

And I love those types of challenges as well because you often see something cool on a website and you say, I I would love to to rebuild

and you can and you can jump across. So that was my finished result. I mean,

I Node doing hardware projects because it v server

our our full projects in a deep way. So if you are excited about that, come check us out. We're gonna be doing these. They're gonna be the next, few episodes here, and we're gonna go deep dive on technical. We're gonna be showing code. We're gonna be talking all things about how we made them and and getting really deep into them. There there's some amazing things to learn through all of these projects. So let us know what you think. Again, if you can swing a hack week at your place of work, my gosh. This was so much fun, and I do think it was so valuable.

admin interface for this thing too, which you guys didn't even see. So Yeah.

people who work

and I gotta applaud that. That rules.

So, like, having user voting was one thing, but, like, what are they voting on? So I had voting on, like, most accurate,

It's it's running on the Sega right now. I'll tell you all about it, but, you might Node you can't see it usually because it's blurred, but there's a Sega back there, and, I built something for it.

Tori app for our production assistant where it can create show notes and stuff. And, Randy uses that app. We gotta push out an update. I got a a little modification I need to make to it, but it's a it's an app. It's in my desktop right Node. Syntax production assistant. So very successful there. And this year,

And just simply scaling it up was Wes kind of a hard thing to do because

in less than a week these days is is, I think, pretty impressive. Yeah. So that's the outcome. Didn't get to finish the game. What did I learn? There's so much more I wanna do. One of my initial ideas was,

Yeah. And and it does say something

those, resource within that context?

what am I missing in this database schema? This is what I'm planning on building. Like, can you am I missing any indexes? Like, am I missing any relationships?

was so nice because, like, I coulda spent all week just building a straight up React app and not focused on this stuff. Yeah. Yeah. I'd have to agree. It let me focus on the things I wanted to focus on. Yeah.

whatever

extra, extra, extra time. I was working on I woke up Wes waking up early to work on it before the kids went to school.

I don't have anything else to add. I'm really excited, to share with you our, I had a hard time using AI for

What did you get out of it? Well, I'll say the end result is I only have a single level. I'm I spent, like I said, a day figuring out graphics, a day figuring out just can I have some sort of game engine so I don't have to write all this with zeros and ones and arrays? And so on the last day, I was just scrambling to get my own custom graphics in there and my own custom level. So at the end of the day, I'll show you, if you're if you're watching on the the video Node.

for viewers. Right? Because that was the big concern. It's like Wes record these things. We've done a couple of UI battles, and we're like, I guess who won? We choose who wins? Okay. That's really hard to do.

This is the game.

web controlled

And that's crazy.

and so I was also kind of at a handicap where I don't have a bunch

sending a lot

And which was, like, c coding and and, like, building the game itself. So I I used AI heavily,

But for the most part, it it ran for, like, a week. Man. So This is so dope, Wes. We'll deal that.

when I was checking out Godot. It is like it's it's pretty pretty dope. Yeah. A lot of people use it even for building Unity games, which is it's something to be said about, like, yeah, it's thirty years later, but now I can use these more modern tools to to work on in such a like a simpler, lower level game. Yeah. That's cool. I have so many questions just about even just storing graphics, but I'll I'll hold it for, the longer video that we do. But yeah. Yeah. We'll be doing a technical deep dive, folks. So if anybody wants to,

where it would take my webcam, or I did do it. It takes my webcam and paints it in real time to the LED grid. So it gives you so much more of an appreciation

Hardware, software, We do our our CSS battles on YouTube, and we've often lamented that they're not real world UI. Many people in the comments have said the same thing, like, what's the point? They're writing bad code just to and the point is for it to be fun. But,

They wrote that code for me, and then they had a

We built stuff either

second, my controller needs to turn on. You are seer, this little triangle here, and my thought is you can collect exact processor instructions, and it's very low level.

Okay. I'm just joking. I am excited about that, but, like, man, I when you told us you were doing a Sega game, I was like, how do you even do that? Yes. And that was my question too. So, yeah, day one was, is this even possible?

three days into the hack week, I was like, nothing is working out. I've changed the libraries, like, eight times. I'm, like, struggling,

Yeah. So same experience. I think that's one of the things about being able to work on anything you want. You can pick the things that you're, like, really passionate about.

give it the context of my c code base, and then I would ask it questions. Like, I didn't want it doing too much in the c code base itself, but I was just like,

see the caliber of stuff that people built because they were able to use AI.

so hard on Hack Week. I I was like, Courtney I started the week before.

level. Yeah. You know? Like like, I'm sitting here writing TypeScript, which is about 14 just briefly here in this podcast.

are actually a nine pin it's it's lower level and that you have to manage memory, and there's a lot more things you have to do manually, but it's the the JavaScript and TypeScript language are C style languages.

It is big. Panels.

as well as provide some, bit more video as to to what we actually did showing code, showing some of the hardware we worked on.

and we're going to detail what we did I've I've hit that quite a bit with, like, stuff where there's just there's no prior art in using this thing. No prior art. Yeah. And Deno matter how much you force feed at the docs, it just starts imagining stuff.

So it ultimately

Yeah. So Century has awards for all of the,

because,

I my idea was so if you've ever played Sonic the Hedgehog, you Node, at the beginning of Sonic the Hedgehog, it says, Sega.

So the TLDK was the first one I came across. The or the LLDK.

it it's still a massive struggle to get like, what game engine is that?

more abstractions

I wanted to connect my Sega to the Internet just because it sounds, of trained code that this thing could just generate on. Yeah. I did figure out some ways to work in older how do I do this, or how would I do this, or how would I go about this? It'd give me, like, four options. And then instead of saying, let it do it, I would go off and and pick one of the options and implement it myself.

real time

actually code related,

But it should actually be possible. So now in my spare time, I'm gonna be I'm gonna be looking into it because one thing I learned is the Sega controllers

and it was it's unreal what he actually built. And and, like, he's like, I don't know. I'm just, like, a video guy. My favorite thing about Randy's presentation

for joystick movement. So, basically, all of that code was written for me where it was fairly high level to say, move player to x location, move player to y location.

valuable

So this is a a a Sega cartridge that you can put an SD card in, and you can just put whatever ROMs you want onto that SD Yarn. And that's how I have it actually running on the Sega. Oh, okay.

man,

And, yeah, I I got sick last week or was that Hack Week? Whatever Hack Week was because I'm still recovering. But, I still I worked through the sickness because I was so I liked my idea so much. And, so yeah. It was really fun. Yeah.

of 200 2,300 pixel updates It's just incredible

get a week off to work a week off to work on crazy stuff, man, the the end results are are really pretty impressive,

yeah. And so yeah. And and so yeah. Day one was just getting a Hello World, and with the s g d k, it was fairly simple. They have, a bunch of samples of, like, different kinds of things that you can do. I had the idea on day one. I proved that I could do it. And then at the end of the day, I ordered what's called an EverDrive.

new libraries as well. Because,

like but often for, like, one off scripts as well. So I needed to create a lot of assets and, like, convert image types. So I'd use AI to generate an ImageMagick script that can convert images. The SDK

a hard week, but, honestly, the end results were pretty amazing for all of us, I think. CJ, how about you? We have by the way, audio folks, CJ, Reynolds is joining us today because he also did a great Hack Week project.

stuff comes out of this thing. Yeah. There was a 156

supported that. Yeah. And it made it so that I could load the map in, I could define my own tile sets, and then load that into the game. Cool.

It's not zeros and ones, but it is it it says, like, move this variable into this memory location, that kind of thing. But with the SGDK, you can write c Node, and it abstracts all of that away. So

motivated to work on a project, you will push through and learn so much more. And I