[0:00]I think it's about time that I just show you how you can self-host a static website of your own using Engine X and Docker. Okay, this is very straightforward, but I'm just going to cover the key points of self-hosting your content, where you put your content, and then how you can go about exposing it, and I'll just talk about a couple options here, and then that's pretty much it. But I just feel like this video was quite important just to understand again how you can host your own website, where you get your domain names from, all of that good stuff. So, let's jump into it. And just quickly as a side note, I'm expecting you to have Docker installed or know how to install Docker on your machine. Um, so make sure you have that covered. I have videos covering that. I have a link somewhere, so make sure to do that first, then come back here if you haven't got it set up already. Right, so we're using Engine X in this. Engine X is a great web server that we can use, and what we're going to do is just scroll down past all the information and we're just going to use this one command here. Now, I will cover this, um, when we go to deploy it and all the steps of this, but a link to this Docker Hub page will be in the description, okay? So we're going to, if you want to come here and have a better idea on how all the commands work, you can come here, but also this command will also be in the description as well. So, what you'll want to do, all right, of course, you're wanting to make sure you actually have a web server somewhere where you're going to host this, okay? I have a dedicated Linux server. If you've got a Raspberry Pi, if you've got a virtual machine, or whatever, just make sure that you can run Docker and you can follow along with this, and you should be good to go. So, yeah, we'll copy this command, right, and now we jump to our server, right? So we're going to jump to my server that I have, and that is Elitron Cloud. So the first thing we want to do, once we've actually connected to our server, right, we want to actually kind of like tidy it up a bit. So if I change under here, if I do, um, an LS, you can see this is just like the home directory, right? We don't really want to dump stuff in the home directory. So what I normally do is I've made a folder here, right? It's called Docker. So if we change into Docker, you can see I have a folder for every sort of like container I have and all the configuration for that container lives in that folder. I would suggest you to do the same, and what we can do, we can make a folder for our website, or the container that we're running, right, which is a website. So what I'm going to do is I'm just going to make a directory, and I'm going to call this just website, nice and easy, right? And if I change into website and I do an LS, there's nothing in this folder, but this is where we're going to use to store our HTML that we use for our web server, okay? So if we paste this command in, this cover the steps here. So what we're going to be doing is that we are running a Docker container, and we're going to give it a name, okay? So this name here, we'll just call it techdox website, right? Give it something descriptive, uh, that you would like. And then we have a volume here, but before we do the volume side of things, there's one thing we need to do, right? We're going to add a hyphen P, and this is publishing a port for from our host machine to the Docker container, right? Engine X is expecting to run on port 80. That's just what it's running on the container itself and that's where it's what port it's exposing. But we can expose any port we want on our server, but in this case, what if that doesn't make sense, I'm going to cover it right now. So I'm going to say, on my local machine, I will access this website, this container on port 80, and then on the server on the Docker container, it'll also be 80. So I am connecting from my host machine on port 80 and that will connect to port 80 on the Docker container, okay? If you wanted to, you can make that 8080, 81, whatever, 90, whatever, okay? Just as long as it's a port that is free that you can use, um, and you're allowed to use, um, go ahead, but for this example, port 80 will do the job just fine. The volume section here is important. So, on the left hand side of the, um, column here, what we can see is this path is the path on your host machine. Again, if this doesn't make a whole lot of sense, it will in a second, so just bear with me. And everything on the right hand side, we don't touch because that is where the files are being mapped to the Engine X container and where Engine X is expecting to host and publish and share your website content, okay? So, what we're going to say is since I'm in the, uh, directory Docker website, we can say dot, which means in this directory, or in this path that I'm in, there will be a folder named content. And anything in content, please map to user share Engine X HTML. That's all that's doing, very straightforward, easy to understand. And then RO stands for read only, so the container is only ever going to read the files in that directory, it's not going to make any changes or edits or anything like that. Hyphen D means the container will run in the background. Um, and it will just continue to run, and then you've got Engine X, which is the image that we are using. Go check out the Docker Hub page if you want to learn more about it, though. And if I hit enter, it's now just deployed a container for us. So, if we do an LS, we can see we now have a content folder. There's nothing in this content folder because we don't have any HTML code in there, but that's fine. And then what we're going to do is also just check out our container, right? So we'll grip it, and what was it called again? Techdox website. Enter. You can see our website's been up for 23 seconds. And it's by the port is binded on port 80 to the Docker container port 80, right? Nice and easy. So this means, if I do an IP ADR and then I'm just going to grab my, uh, I know my IP address starts with 192. So this IP address here, right? Are you ready for this? If I connect to this IP address, we should hit our Docker container, okay? So if I copy this, and now go to my website, oh, very bright. Open up a new tab. Click here. I'm going to type HTTP. Paste that in. All right, so I've got the IP address in the top of the browser right now. HTTP 192.168.68.119, okay? Now, if I hit enter, it's going to try to hit that Engine X web server. Enter. There we go. Now we get 403 forbidden. That is because there's nothing in that content folder. There's nothing to serve, right? So we actually have to add something in there. So, let's go ahead and add some HTML code. So if we change directory into that content folder. Now, in this content folder here, there's nothing in here, but we want to add some content, right? So if I just do a sudo Nano, and then we do just an index.html and hit enter, we can add some sort of code, right? So, um, I haven't wrote in HTML ages, but it's just going to be something really simple. So maybe like H1, um, please subscribe, and then, uh, we can do, I think it's like that. I think that's right. We'll probably get rid of these spaces. Save that. Close on that. Um, I don't know, I can't remember if the container automatically will detect the changes. Let's have a look. So we've come here and hit refresh. There we go. You have a website. It's up and running. Every content you put into this folder, if I do an LS, your container will load and away it goes. And if we do a, um, Docker logs techdox website, and then a hyphen F, which should follow the logs, we can see here, every time we make a connection, it will update. So if I refresh this a bunch of times, bam, look at that. All of those logs. We can see all the traffic hitting the container. It's all been there. It's all been hit and everything is working. It is awesome. So that is how to start off with. You now have a web server. Now you can put anything in there. You know, blogs, whatever, there's so many places you can get static websites, uh, templates from, all of that good stuff. Chuck it in that folder, make your changes, it's all been hosted. Now, one problem here though, this is just local, right? You can't actually access this on the internet. So how do you go about doing that? Well, two ways. And the first way is you need to get a domain, which I'll show you in a second. And once you've got a domain name, you can go ahead and then, um, port forward on your router. Don't worry, I'm going to cover all of this, and then you can map your public IP address to your domain name, and away you go. So, let's go ahead with the port forwarding side of things. Now, the only problem here is that port forwarding on is very different on every router. Where you find it and all of that stuff, but the main thing you'll need to do is look up, uh, in your manual or online for your router on just where the port forwarding option is. Uh, mine is all done on a mobile app, so I'm just going to make the changes there. So this is my app here on my phone that I use to connect to my router. Uh, right. So what I'm going to do, and again, yours is always different, but at least I've, I can kind of show something. If we come to more, right, and then under advanced on my one, you can see there's a thing called NAT forwarding. So if I click on that, I've got the port forwarding option, so I come here and click port forwarding, and then I want to add a new port forward. So under here, it's just going to be, um, you see how you've got kind of like a few options here that you can choose. Uh, mine's going to be HTTP. You can if you're using a custom port, something different rather than like port 80, you can custom in my example. And it's asking for the internal IP address, right? And so this is the server, so I need to find that. So we can say here, we can use a client IP address. So if I select from clients, I can actually select my Elitron cloud. So that's the IP address if you remember, and if I hit done and save. Wait for that to save. There we go. Now I should be able to go from my actual public IP address, I should be able to connect to this. So let's try. Rightio. So, we've I've just shown you, uh, port forwarding on my router. Now it's probably different for yours, like I said before, if you don't have the same sort of router as mine, but what we can do now, since we've technically port forwarded, I can, well, not technically, we have, I can go, what is my IP address? If I can spell IP address. Enter. And we can see that this is my IP address, okay? So that that's that's my IP. So what we can do from this point here is we can copy this and paste it in our domain at the very top, right? So and we can paste this in our browser, and just by pasting this, I should now hit my home router. It's then been told to port forward that to port 80 on my web server. So if I hit enter, there we go. On that public IP address, we have now hit the exact same thing as the local IP address. It's the exact same, right? And just to confirm to you, let's jump back to here. Sudo Nano index.html. We'll add a, we'll add a paragraph, right? Just I'm just confirming that this is the same thing. It works. We'll close it off. Save that. And so, start here. This is the local one. Hit refresh. It works. Come back here. Same thing, hit refresh. It's all loaded in the same content. So, we're another step ahead, okay? We now have our web server set up, and it's now rather than the local IP address, anyone can reach this now. It's on our public IP address, that's what we're using. So, what do we do from here? This is where the domain name comes in, okay? So when it comes to domain names, there's so many providers out there, right? You can go to somewhere like namecheap, um, once this loads, and you can find some cheap domain names, right? So you can be like myfirstwebsitehahaha. Hit enter. And then what you can find is the results and how much it's going to cost to get your preferred domain name, right? Once this loads, all right, for whatever reason, namecheap isn't loading for me, so let's jump to the provider that I actually use, and that is CloudFlare. Now, CloudFlare is awesome, and I this will lead into the other way you can go about self-hosting, um, your website and exposing it to the internet. So this is my CloudFlare. This is actually the second way that you can go about, um, publishing your website and your Docker containers without having to port forward or anything like that.
[13:26]So in CloudFlare, once you're signed up, if you want to use CloudFlare, you can go domain registration, right? And register domains, and you can search for any sort of domain you want. So let's try webs, uh, my first website, right? Hit search. Now, of course, you this is probably used a lot by other people, but anyway. So you can see here, if you want, you can purchase the domain name my website.io for $36. Or my first websites.com for $9.77, right? Whatever, you can register whatever domain you want. So once you've actually registered your domain name, uh, again, most providers have their own way and they own your way of doing this, but the concept is the same. You want to go into the domain name that you've purchased, so mine I'm going to use in this case is mcnugget.xyz and click on that, and then they'll have a DNS tab on somewhere, right? You want to edit the DNS settings. So if we click DNS, you can see here, we can set the DNS for our domain name. And what this is going to do is we're going to give it the public IP address, this one here, my public IP address, to the domain name. So if anyone hits that domain name that we just bought, it will convert to the IP address, and that's how everything's accessed, but you don't have to remember an IP address, you just remember the domain name. So if we hit add record, we leave it as an A record, the name. Now since we're sitting the domain name for the McNugget and we're not going to use any like subdomains, so I could have like, um, I don't know, what something like website. And you see if I hit like website here, the URL would actually be website.mcnugget.xyz. That's how you add subdomains. So you can use, you know, your domain for a lot of things like email, or whatever, um, but in this case, if you just want to use the root domain name, which is just it stock standard, nothing extra. You just put the at symbol. You can see here it's saying here, McNugget.xyz will point to the public IP address. And we know that that public IP address points to our local Docker container running our website.
[15:50]So, if I hit save, it's now set up. Now, DNS can be a funny thing. It might not always work. It takes time to let all the domain name servers, all the name servers around the world know of your change. You you're saying that your domain name maps to here. It has to go around the world, right? So, uh, if I actually copy this, and we try access it, it may or may not work, depending on how quick things went around. So if I hit that enter, look at that. What do we see? Our website on mcnugget.xyz. We have now the local IP address, right? We have the public IP address, we found a domain name. Now we have the domain name. And since we're we're hosting this via CloudFlare, you can see it's actually going via HTTP and it's got a certificate and all of that good stuff. And that's another good reason for going via CloudFlare. Um, you get all of that stuff out of the box. Now, you might be asking, what happens? I don't have a static IP address. This I, this, this public IP address may change. Now, two ways I'm going to get two solutions, pretty much I'm going to give you, right? You can, actually, maybe three. One, you can go to your, uh, ISP, your internet service provider and ask for a static IP address, okay? Easiest solution, uh, kind of cost money on that one though, so I actually it's not the easiest solution. Um, you can use something like, uh, no DNS. So if I come to this, um, and it's a way that it kind of tracks when your IP changes and it will make those changes for you. Now, I haven't actually used these too much because I just use CloudFlare instead. And the way CloudFlare works is it just has a tunnel, uh, container, it's a whole another CloudFlare tunnel, running on a container, and that's just my way of exposing my Docker containers without having to port forward or anything like that. So if you don't have a static IP address, either use something like no IP, or just use CloudFlare. That's really that easy. So that is how to host a static website, basic website. Um, how you get the domain name, uh, if you know, IP address changes, other ways to go about it using CloudFlare, port forwarding, all of that good stuff. Um, but yeah, I hope you enjoyed the video. Make sure to subscribe if you haven't, and if you're keen to become a member, that would be really appreciated and you get one-on-one support with me in the Discord as well. Have a great one, and I will see you in the next one. Bye-bye.
