Open junjizhi opened 4 years ago
junjizhi
commented
4 years ago Alternatives
They are more or less the same. Goal is to automate deployment, without the need to manage servers.
Less control on the server setup.
junjizhi
commented
4 years ago Edits in mind:
junjizhi
commented
4 years ago Readability
junjizhi
commented
4 years ago Content purpose
junjizhi
commented
4 years ago Found this article about using gmail (to send as ...)
https://zainrizvi.io/blog/how-to-setup-a-free-custom-domain-email-address/
Update: Yeah, mailgun forwarding is not free any more.
I can refer my post to his post.
Verbiage:
Zain wrote about using mailgun forwarding to integrate with Gmail. However, mailgun isn't free any more, so it's not a viable.
TL;DR
I use the below stack to set up a free static site server for my wife who owns a custom domain:
Who is this post for?
If you would like to tinker, you can follow the steps and have a site that you have total control over. From there, you can repurpose the server to host your apps instead of a static site.
This setup is not for everyone. It requires you to be comfortable with managing AWS EC2 servers. For hassle-free options, consider Github Pages or Netlify (See the alternatives section)
What will you achieve with this tutorial?
You can take a peek at a screenshot of her site:
Why did I do this?
My wife taught herself coding and became a front end developer. She needed a personal page to showcase her portfolios and build her own personal brands.
I chose to use this particular stack because:
Also, after going through the steps, I would be able to set up a server that are ready to deploy a built site. In a sense, the server is like a hand-off point from a back-end to a front-end developer.
Steps
Overview
Let's Encryptfor HTTPS / SSLStep 1. Buy domains from Namecheap
Sorry, the title lies. This step costs $$ and I wish they could give domains for free🤷♂️
I choose to use Namecheap because they are usually cheaper than other options (with WhoIs privacy guard) and the purchase process is smooth overall.
Using Namecheap also comes with another benefits: Email forwarding. I'm going to talk about it in the following section.
Step 2. Sign up for AWS and start a free-tier EC2 instance (or AWS Activate)
If you register as a new user for AWS, you are often eligible for the free tier EC2. At least for the first year, you won't need to pay for the EC2 server.
After one year, if you are serious about running the business, you can apply for AWS Activate. It is a program for bootstrapped startups, and most indie makers fall under this category.
My application recently got approved and I received $1,000 credits, which are probably enough for running EC2 for a while:
After you sign up, log in AWS and select
EC2tab in theServicesdropdown.Next is to launch a new instance. Generally, we should select the latest Linux server as I'm mostly familiar with it. In my case, I pick Ubuntu 18.04.
Next is to pick free tier (
t2.micro) instance:From here, you can follow the guide to finish launching the instance.
⚠️ At some point, it would guide you to generate a key pair. Download it and move it to a safe folder., e.g.,
~/.ssh⚠️When you have a running instance, you want to connect (via ssh) to it). Right click > Select
Connect.You would see instructions like:
Step 3. Follow Digital Ocean tutorials to configure the Ubuntu server
I follow this tutorial to configure Apache HTTP server.
BTW, I found Digital Ocean has great tutorials. They are clear and to the point.
Step 4. Configure Cloudflare CDN
Cloudflare offers free plan for site owners. It also comes with additional performance and security features, like load balancing, HTTP/2, and DDoS protection.
After you sign up, you need to configure Namecheap to use Custom DNS and point them to Cloudflare:
In Cloudflare, add a
A recordand set is as the public IP of the AWS EC2 server and add a CNAME record to the EC2 CNAME.My wife's site linghaolin.com is configured like:
Step 5. Follow Digital Ocean tutorials to configure
Let's EncryptThis is another useful tutorial from Digital Ocean. With
Let's Encrypt, you basically get HTTPS for free.6. Set up emails with custom domains
Option No. 1: Zoho mail
Zoho offers free email service for custom domains. Actually, it comes an entire office suite more than an email client.
They also have a tutorial you can follow.
After you set it up, the email client looks like below. And my wife can receive and send emails via
contact@linghaolin.comnow!Option No. 2: Namecheap email forwarding
Namecheap actually provides free email forwarding service.
The setting is simple:
As example, this is my
tonians.comdomain setting. It it will forwardjunji@tonians.comto personal gmail inbox.However, using Namecheap email forwarding comes with two downsides:
Overall, I prefer the Zoho solution as it is more long term.
Step 7. Deploy site files to the server
Option 1: ssh
I use the minimal solution:
scp. My wife is building a React app, when she finishes the build, I simply scp all the build files to the server. It's a command like belowOption 2: Filezilla
You can also use Filezilla, which can transfer files over (S)FTP. When you are done with your build, you can drag and draw the build folder to your server. It also remembers your settings so you only need to set it up once and reuse the same settings later on.
My settings for her site was like this:
Step 8. Set up UptimeRobot for site monitoring
If your site is down, you want to know. It's mainly not to embarrass myself when I open my url to friends or clients but find out it's down.
I like the minimalist solution: Send me an email when the site is down. Then I decide if I should do something about it based on my availability at the time.
I use UptimeRobot for this purpose. They have free plan for a few sites. My setup is like:
It doesn't happen that often, but EC2 server could go down for various reasons.
When I receive downtime emails, most of the time the solution is to restart apache server:
or even restart EC2 instance with the AWS console.
Within the past year, I may have done it only once. So this is rare for static site servers.
Pros & Cons of this approach
Pros
Cons
publicfolder into the serverAlternatives
Github Pages
They are more or less the same. You push code to a repo and they automatically finish the deployment and manage the servers for you.
Their support for hosting static sites is quite good. Actually my blog is hosted as a Github Pages app. All I need to worry about is type down the articles in markdown files and push to the repo once done.
For the email hosting solution, Zain wrote about using mailgun forwarding to integrate with Gmail. However, mailgun isn't free any more.
Closing thoughts
In this article, I talk about how I set up a minimal server for my wife's personal site with custom domain emails. The stack I use is AWS EC2 + Apache + Cloudflare + UptimeRobot + Zoho. Ever since I set it up for the past year, I experienced a down time email once, so the site was running ok.
By going through such a setup, you have full control over your domain and servers without relying on 3rd parties like Github or Gitlab. During the process, you can practice your server configuration skills and also experience using DevOps tools or practices, e.g., UptimeRobot.
Thank you for your read!