 In today's video we are going to be building a website, but not just any website. In today's video we are going to be building a website that's built on a Mac, designed on a Mac using Apple programs, as well as being hosted on a Mac mini in a server rack within my own home. And this is going to be quite the project, but hopefully it works out okay, and turns out to something that you could probably do on your own as well. So without further ado, let's get into today's video. So how are we going to pull off a project If you didn't know Apple did have a web designer program back in the early 2000s, it was called iWeb and it came with their old iLife package that they released on most iMacs and you could buy it for other devices as time went on. And iLife was supported up until the around 2011-2012 when they kind of discontinued that whole project in favor of individual apps that came on your Mac and with that discontinuation of iLife iWeb went with it. Earlier on in the process, they slowly discontinued it, you could kind of see the phases that Apple was kind of moving away from building their own web designer. First thing that occurred was they shut down the hosting. Of course, this actually came earlier on when they moved on to iCloud for MobileMe because you actually hosted your iWeb site with MobileMe or you could host it with anybody else find FTP server or file server. And we'll learn about that pretty soon. But it was the signs were kind of there. It lasted like maybe 10 years at Macs, but slowly but surely it phased out and it officially stopped working at least the latest version of iWeb stopped working in macOS Al Capitan. And from that point on, Apple hasn't really shown any sign of coming back into the personal website space. iWeb is not currently supported by Apple in any way, but we do have the community that surrounded iLife and iWeb as it was. And there's been two main apps that have been developed around the original scheme of what iWeb was. And those two apps are EverWeb and Sparkle. I've looked into them both. I'm pretty big into EverWeb because it's one that I actually purchased a lifetime license to and actually used for a couple of my website clients that wanted an iWeb looking website. And I checked out Sparkle. It's there if you want to try it out. But in this video, we're going to be focusing mainly on designing it with that EverWeb program. So the best way that we can actually learn about EverWeb is to actually go ahead and open it up on the computer. So that further do let's head over to the computer. Alright, so you'll notice here that I have EverWeb open. And you can see I've done quite a few projects with it in the past. And the main one that I want to take a look at is this all Mac website. If you know what iWeb looks like, this whole scheme looks very similar with your very simple button to create a new website, learning how to use it and then your projects on the side. This is pretty much how iWeb looked for most of the later versions. But if we go ahead and click on all Mac website, it's going to open up that project file for us. It always starts out in a really tiny window. I do have a 4k display, which is probably why it's not used to having a show for all of that. But if we open it up, you get a very basic but kind of cool looking editor. You'll notice you have your pages and stuff on the side. If you click on the website itself, you can open up where it's going to publish to your header and footer code and whatnot there. You can go into your pages here. You can create pages up here based off of the template that you're designing. You can even have different themes and different templates based off of different pages. So an entire website does not have to look the same. You can use multiple themes with it, exactly how iWeb was. And you'll notice the design interface was very similar. You got your fonts, colors, and media up in the top, exactly how iWeb was. And this even opens up in the classic fonts window that's somehow still in macOS from the early days. This has actually existed since Next Step, which is what macOS 10 is built on. So it's really funny that they still use this window that most macOS apps made by Apple don't even use anymore. But you have your inspector and asset stuff on the side. They definitely wanted to modernize it. You can tell that through especially the widgets. This is a quite an abundant source of widgets. A recent update that everweb actually added was you can make payments through Stripe. You can actually make a static page e-commerce store with everweb. Because everweb does not require anything else. When you publish this to a folder, you can just throw it on a web server and host it. You don't need php, you don't need nojs. It just runs because it's a static page editor. That's what makes it pretty nice and simple to learn because there's no other things you need. You just publish it to your server and it's on the internet. And we'll kind of go into why I chose that option because hosting on a mac mini a bit harder than you might think, especially when you're running macOS. We're using a lot of homebrew stuff. So if I kind of take you through the website here, it's very basic. From iWeb to everweb, powering your online presence from the heart of a mac mini. I kind of showed off some of my personal stuff, personal photos, designs. I have a conversation going on there within the testimonials that I made up. And then you kind of go down, you got your footer and whatnot. And it's a very basic website. It's definitely not my best work because honestly, it's been a long time since I have used everweb. And honestly, I'm very much more comfortable with WordPress as a program than I ever was with everweb. Though I did start off learning how to build websites with iWeb, I'm glad I have moved on because this style of editing websites is very classic. To some people, it might be necessary. And especially if you want to host a static page website, stuff like everweb is your best bet because WordPress does require a PHP database on the back end and no JS to run it. So you do need those extra components, but for the most part, something like this should work okay for you. So I mean, here we are, we can edit text, you can go in here, you can edit like say, I don't want to use everweb say from from iWeb to WordPress, but this is made in everweb, so we will keep that as everweb. And we can add in different shapes as we needed. If not, you can add in your text boxes, you can even preview it as you need. You can add in all your assets, a lot of those came with the site. So yeah, this is a very primitive website. But I just wanted to kind of get the point across that this is how we're going to do it. If you want to build your own site and everweb, you can buy their lifetime license. I'm not endorsing them in any way. I do like the program. They're not paying me. But it is a pretty decently nice static page editor made for macOS. It's there if you're moving on from iWeb, it works pretty well. So the next step we're going to want to do is we're going to actually want to head over to that Mac mini now it's in a server as you can see here. But I have an app called screens that comes with set up. And I can actually log right into that Mac mini from here. So I'm going to log in with my super secure password that's actually super secure because I have projects on here. So we're just going to log in here. See that I do have a couple of projects on here. I'm working on a video about MAMP. This is how you can run WordPress locally on a Mac mini. I might do something about that in the future. I monitor a lot of my resources on this machine. But for the most part you'll notice that I run Nginx. That's how I'm hosting this. If you don't know what Nginx is it's a web server. When it comes to hosting websites you have two main options when it comes to well choosing web server. Your two main ones are Apache web server which is arguably the one that's been longer around like Apache web servers have been there since the beginning. And then you have Nginx which is a more streamlined and simple website engine or web engine. They both work very similar and both of them are quite easy to use. Nginx you have one configuration file that you can edit your configurations. You basically tell it where to grab from and what port it's supposed to put that on. And then within your router you can tell it well this machine at this IP address. So for example this machine 192.168.1.170. That is the IP address of the Mac mini on my local network. From there Nginx is saying well in Ethan Ryman's slash sites slash ever web which for example maybe that's where this site is hosted at has a website in there and I want to broadcast that. So Nginx takes that folder and using your configuration file points that folder hosted with its web engine at port 8080. And say it's at port 8080 so now you have that 192.168.1.170 port 8080. And now if you go to that in your local network you will be able to view the site from that server. However that's just within your own home. You need to actually see it on the broader internet. To do that you can go into your router if this is your only thing you can go into your router. And for me that'd be my UDM Pro and I can find that Mac mini's IP address. I can actually just select the Mac mini because the Ubiquiti Unify knows how to detect devices. And I can find that Mac mini. I can tell Unify it's on port 8080. And then from there I can use the regular HTTPS port that you can use to broadcast to the internet. And then I'm going to tell UDM I'm going to tell the UDM taking this Mac mini at port 8080 and open that port up to the broader internet at port 80 on the internet. So from that point my public IP address of our home at port 80 would load up that site. Now you don't really want to do this because sharing your public IP address to the open internet is not a good idea. Even if you're hiding it behind a DNS wall in a domain which you can do with something like Cloudflare GoDaddy domains it's still visible on the back end because you can run a trace route and then people can find your public IP address and then also find your home directly. So there's this other option that you can choose from and it's called Cloudflare Tunneling. Basically what this does is it's a Cloudflare tunnel is a tunnel that you install on the Mac mini itself. It completely bypasses your router. You install that Cloudflare tunnel on the Mac mini. From here it has its own little connection inside of that Mac mini that links back to Cloudflare servers. Once you're in your Cloudflare dashboard you can go ahead and go into your Zero Trust tunnels and remember how we put that site open on port 8080. Well if you go into Cloudflare tunnels like we will do right now into the Zero Trust access we're going to select your account and then we're going to go over to tunnel access and then tunnels. From here you can find your Mac mini. For me I only have one here and I'm going to go up to configure and then we're going to go over to public host names. From here you can see if we look over on this side over here you notice I have local host dash 8070 dash 8080 dash 8090 dash 8888 dash 8060 those are the ports that nginx is running the site from and archived at rhymanlabs.com that 80 that 8888 is actually an Apache web server running WordPress that I'm testing out. Now this nice thing about Cloudflare tunnels is you're not limited to one port in one site like you would be with an IP address that you do through your router. This you can create as many as you want as long as it's coming from that one machine and if you want to have multiple machines in your house running multiple websites you can actually do that with a couple more cloudflare tunnels. You notice there's a lot of space available here. I can just create a new tunnel for every machine I have. At a certain point Cloudflare wants you to pay for this but until you need to worry about that it's not something you really need to worry about. You'll notice going to vid.slashsite.rymanlabs.com will bring up that site built hosted and live from Mac from iWeb to everweb your recent projects. Now I didn't actually show you how we got it here and the way we do that is actually within everweb. If I go back into everweb and I kind of show you this if we go back to our main site up here and we're going to publish it to a folder I just published it to a folder on my Mac mini and I drag that over into the folder that nginx has on that Mac mini using file transfer that pretty much every Mac has. It's a pretty simple process you can do it by an ftp server if you want to be more complicated or if the site if Mac mini you're hosting it with isn't in your house an ftp server might be helpful but for the most part that's all you need to do. Using Cloudflare tunnels you can set it up pretty nicely and if you want a more advanced video in Cloudflare tunnels feel free to let me know in the comments down below because I'd be happy to do something like that. This is something that I feel is quite helpful especially for an old Mac mini rallying round. These are both from 2012 and they're able to handle thousands of users at a time without hitting even 10% CPU usage. So I guess with all that said I'd like to say thank you for watching today's video. I hope that you can use Cloudflare tunnels in a project of your own especially hosting with a Mac mini and potentially using everweb to design your website. It's a pretty cool program to use and I bet you'll find a use for it eventually. So with all that said I'd like to say thank you for watching today's video I really hope you enjoyed it. If you did be sure to give a like on the video and subscribe if you want to see more content from me. Have a great rest of your day. See y'all next time and bye bye.