Ever wanted to host your apps running on localhost straight to the internet?
Be carefulânow you wonât be able to say âit works on my localâ.
Because sometimes
localhost:3000
just isnât spicy enough. đ¶ïž
đ§ââïž What Youâll Need to Channel Your Inner Tech Sorcerer
- A domain â Your digital real estate. Your little castle in the vast internet kingdom.
- A personal computer â Your trusty steed. Doesnât need to be a supercomputer, just something that wonât faint when you open 47 Chrome tabs.
1ïžâŁ Register Your Domain with Cloudflare
(AKA Claim Your Internet Throne)
First things firstâregister your domain with Cloudflare.
You can use Cloudflareâs documentation and follow the instructions.
- You can either buy a domain directly from Cloudflare
- Or transfer an existing one (I got mine from Hostinger)
Once you hook it up, itâll show up in your Cloudflare dashboard.
Congrats đ Step 1 complete!
2ïžâŁ Install Cloudflare Tunnel
(Your Secret Underground Passage)
Now itâs time to install Cloudflare Tunnel.
This acts as a hidden passageway between your computer and the internet.
Check Cloudflareâs docs for setup.
When you run cloudflared
for the first time, it:
- Creates a config file
- Generates credentials
- Adds a certificate (authorizing your system to handle the tunnel)
Youâll use this config file to define ingress rules (where traffic should go). It will look something like this.
ingress:
- hostname: my-awesome-project.myDomain
service: http://localhost:1000
- service: http_status:404
3ïžâŁ Tweak Your DNS Records
(The Secret Handshake of the Internet)
This is where you say:
âWhen someone visits
mycoolapp.mydomain.com
, send them to port 3000 on my computer.â
How? By tweaking your DNS records in Cloudflare.
Steps:
- Open your Cloudflare dashboard â Select your domain â Go to DNS Records.
- Add a CNAME record for your subdomain.
-
Name â your subdomain (e.g.
app
) -
Target â
<YOUR_TUNNEL_ID>.cfargotunnel.com
-
Name â your subdomain (e.g.
- Youâll find the tunnel ID in the credentials file Cloudflare generated.
- Set Proxy Status to Proxied.
Thatâs itânow the world knows where to find your localhost.
4ïžâŁ Fire Up the Tunnel and Watch the Magic Happen
Run cloudflared
on your system and boomâyour tunnel is alive âĄ.
Start your project locally (Node.js app, Flask server, portfolio site⊠whatever).
Cloudflare Tunnel takes care of the rest.
Visitors â Your subdomain â Cloudflare Tunnel â Your local server.
It follows the ingress rules you defined and routes traffic correctly.
5ïžâŁ Go Full Automation Freak đ ïž
If youâre like me, youâll want to automate everything.
Check out Migakuâa simple script I use to:
- Clone all my projects
- Set them up
- Run them in one go
How it works:
- Uses Docker Compose to spin up each project in its own container. đ This means each project needs a Dockerfile that tells Docker how to build it. If you donât know how to write one yet, itâs worth learningâDocker is a super valuable skill to have anyway.
- Assigns each container a specific port
- Matches those ports to Cloudflare Tunnel ingress rules
đ Side Quest: The Rune-Keeper (Environment Variables)
I keep a separate repo for environment variables:
- All
.env
files are stored as encrypted.enc
files - Migaku decrypts them with a secret key when needed
- Docker Compose consumes them seamlessly
Yes, Iâm literally storing my env files on GitHub.
But donât worryâitâs secure: AES-256 encryption with one password stored only in my brain đ§ .
Without the password, the .enc
files are useless.
đ And VoilĂ ! Youâre a Self-Hosting Superstar
With Cloudflare Tunnel, your projects are:
- Live đ
- Secure đ
- Accessible đ
All from your own computerâno cloud bills, no corporate overlords.
So go forth, show off your work, and let the internet bask in your brilliance.
Originally posted on Learn.io.
Top comments (0)
Some comments may only be visible to logged-in visitors. Sign in to view all comments.