From LocalHost to Public Endpoint - Quickly Share Your Work With zrok

TOC

• Use Case
• Install zrok to Your OS
• Create an Account
• See The Initial UI of zrok
• Connect Your Device with Your Account
• The Magical Part - zrok Reserve and Share
  • Later Runs
• Important Advice
• If you Have Any Questions/Suggestions...
• And If I made a mistake

 

Use Case

Suppose you're using a web server framework like uvicorn to run your backend service locally (e.g., on http://localhost:8000)

Ok, but that http://... is a local URL... So how do we share it publically instead of locally?

Use zrok! 🌌

(Side note: Check the first 2 paragraphs here for a more eloquent explanation of when to use zrok :])

 

Install zrok to Your OS

Based on your Operating System (OS), follow the steps in the guide page reached from here.

When you're done, executing zrok -h in a terminal should give you the list of commands that you can run using zrok!

Side note 1: Regarding Windows users, the commands written in their guide page are executed via powershell.

Side note 2: Personally, I just get the zrok.exe file, add it to the repository's root folder, add zrok.exe to .gitignore, then run zrok commands in the terminal instead of adding zrok to windows' PATH variable... however, that solution is a workaround, and should not be standardized :]

 

Create an Account

Create an account by doing the following:

1. Visit zrok's getting started page here.
2. Click on "Get an Account" under "Hosted zroknet".
3. Click on "sign up" at the bottom of the form.
4. Fill in your credentials then click sign up.
5. You'll then be redirected to https://myzrok.io/settings, where you'll fill in the same credentials
   1. (again ಠ_ಠ)
6. Click SAVE, then you'll be presented with this command: zrok enable yOUrPriVaTeToken, store this command carefully in a notepad or something, we'll need it soon.
7. Then login to https://api.zrok.io/ by using your credentials...
   1. (again! (╯°□°）╯︵ ┻━┻ )
8. Done!

 

Side note: You could've also partially done this via terminal, as shown here

 

See The Initial UI of zrok

Upon successfully logging in, you'll see the https://api.zrok.io/ page looking like this:

Now, you can use NetFoundry's public zrok instances to share your web server! Let's see how...

Side note: If you click on the 🔽 icon next to your email, then click on Enable your environment, you'll see the command that I told you to store in a notepad :].

 

Connect Your Device with Your Account

Run the zrok enable yOUrPriVaTeToken command in your terminal to connect your account with your device.

Then, read the entire Enabling Your zrok Environment section from the official docs here, as it explains the above command, and then shows you what the UI of api.zrok.io should now look like.

 

The Magical Part - zrok Reserve and Share

Now for the good part, assuming you are currently running your backend server, e.g., something like this (IDE is VSCode btw):

Then, you'll open another terminal, like so:

Then, execute this command:

zrok reserve public localhost:8000 -n youruniqueinstancename

If you don't change the last argument above (which is called a share token), the final frontend URL will appear like this: https://youruniqueinstancename.share.zrok.io, as can be seen here:

As you noticed from the screenshot above, a connection has been reserved with the token name that you used in the last argument of the aforementioned command,and is now configured to eventually bind with your localhost URL.

To make it actually bind with your localhost, run this final command:

zrok share reserved youruniqueinstancename

Now, if we try to send requests using any online REST client tool, e.g., restninja:

You'll see the terminal returning this output:

Which means we can now share this public URL for quickly testing and/or displaying our work with others!

Side note: To terminate the session, hit ctrl+c (windows) or close the terminal from here (still in VSCode):

Tricky note: the youruniqueinstancename token is globally unique. In other words, if a developer "Bob" currently hosts a zrok public URL with this token, and a developer "Steve" simultaneously tries to create a public URL with that exact token, it won't work (will give you a shareConflict error).

 

Later Runs

In future terminal sessions, it's sufficient to run zrok share reserved youruniqueinstancename to start a new session of binding public zrok URL with localhost :].

 

Important Advice

I highly suggest fully reading zrok's getting started page, then all the sub-pages under concepts, as they greatly explain the when/where/how's of zrok.

 

If you Have Any Questions/Suggestions...

Your participation is most welcome! 🔥🙌

 

And If I made a mistake

Then kindly correct me :] <3