Test Meta tags locally

Usually, to test metatags, we need to deploy. We can save time by testing locally like this:

First

We need to have our application running on some port from our terminal.

-> npm start

> portfolio@3.0.0 start
> astro developer
> Local http://localhost:3000

Second

We need to have npm installed and execute the command:

npx localtunnel --port 3000

If it’s the first time you use localtunnel, you will see a question in the terminal. Press Y and you will get a URL similar to this:

-> npx localtunnel --port

> your url is: https://strong-meals-prove-181-142-210-248.loca.lt

Third

We go to metatags.io and in the top of the page we add the URL generated by localtunnel.

With this tool, you can validate and edit each metatag.

On the left side, there are options that allow you to preview how it would look on Facebook, Google, or Twitter, among others.

Finally

You can copy the configuration using the Generate button and bring it to your website.