Static Asset Project Solution

[00:00:00]
>> Brian Holt: All right, so I have this static asset project. Yeah, looking good, open this in code. All right, so this shouldn't have been the longest Docker file, but it is definitely a reapplication of some of the things that you've learned. So, I got a fresh copy of the, what I have in the GitHub repo here.

[00:00:27]
And you can see here I got the Astro File, let's just look at our dependencies here. Tailwind, react, Astro, TypeScript. Not that end really much of this matters. You can imagine this being arbitrarily long, right? You could have as big an Astro project as you wanna have.
>> Brian Holt: Cool, so, I'm gonna create a new file here.

[00:00:54]
Surprise, surprise, we are going to call it Docker file, okay? Let's grab a builder, so from node:20 as, by the way, you do not have to make this all caps. I just do out of pure habit. In fact, I see people all the time that don't, I just wanted to disclaim that.

[00:01:22]
As node builder, workdir/app copy.., we want everything, we wanna run npm ci, and then run npm run built. No, build, thank you. Say, so far, so good, right? Copying everything across. You might say, well, why don't you split out your npm, your package part and your. And the reason why I say that is you're gonna run build at the end of this anyway, which is probably the longer step anyway.

[00:02:07]
And also, I'm not really optimizing here for the development experience. So, you could totally separate these steps out again, if you wanted to.
>> Brian Holt: Okay, from, I'm gonna say nginx, let's just say Alpine for fun, I think I have latest in my notes, but either way works. And then we're gonna say copy --from, and we're gonna say -node builder, and app/dist, and that is the dangers of relying on Copilot because it would have been wrong in that particular case.

[00:02:45]
You need to go from dist because that's by default where Astro builds it. Then we're gonna copy that to usershare@nginxhtml. That should be about it, let's give her a build, see what happens. So docker build -t, we'll call this, I don't know, my-static app.
>> Brian Holt: See what happens when we try and do that.

[00:03:23]
>> Brian Holt: Did I exclude the Docker? No, so you probably would wanna do a Docker ignore here. I did not do that, which means I copied my entire node modules across.
>> Brian Holt: But let's see if that works. Docker run-it-p, this is by default runs on port 80. So we're gonna map port 80 to port 8080 and name call my-app cuz I'm uncreative --rm --init and my-static-app.

[00:04:12]
>> Brian Holt: Okay, looks like we are up and running here. Let's see if we go to localhost 8080, I guess I can just refresh the page here. Welcome to Astro.
>> Brian Holt: Pretty cool, right?
>> Brian Holt: Let's see, my-static-app here, 49 Megs, so straight to jail, right? That's what we said it had to be under 40 Megs or you going to jail.

[00:04:39]
Whatever, who cares? [LAUGH] Cool, how'd we do? Were able to get it done? I used to find nginx kind of unapproachable especially with how configuring it can be a bit of a beast. But it's cool that you're just able to do this out of the box right away.

[00:05:03]
>> Speaker 1: Yeah, if we had to do a command, that might have been harder.
>> Brian Holt: Okay, yeah, if you had to do a command, it would be a lot harder because you'd have to figure out where to run it from, which configuration to use, all those kind of things.

[00:05:13]
But the nice thing is they just include all those defaults for you. And what's also kind of interesting and cool about this, depending on how you're gonna end up using nginx, I imagine most of you, if you're in container land and building your projects this way. You're probably gonna end up in Kubernetes at some point, right?

[00:05:33]
That's just kind of the logical conclusion of that pipeline. Not always true, but frequently true. If you identify nginx as the load balancer, and we'll talk about that when we get to Kubernetes. What will actually end up happening is, Azure or something like that, will actually just say, cool, this is a load balancer.

[00:05:51]
You can use nginx and it'll let you do that, but you can also just say, just let Azure's front door, I think it's called Azure front door, handle it for me, and then it'll handle all of your ingressive traffic. So you use nginx locally, get all that stuff kind of done, and then when you go out to these mega deployments, the cloud services will handle a lot of that stuff for you.

[00:06:11]
Or Cloudflare could be plugged in there as well. So, also very cool.