Add environment variables in hostinger shared hosting

Question

I have deployed my react web application in hostinger. I made a build of my react web application and uploaded it in public_html of hostinger and my site works fine. But since I am using firebase I need to hide my firebase configuration data in environment variables.

How does one set up environment variables in hostinger for a react web application?

Edifice

This might help: hostinger.com/tutorials/… – Chosen

Actually this tutorial is for VPS (Virtual Private Server). Whereas mine is Shared Hosting. Hostinger customer support told me this can only be done with VPS. – Edifice

Answer 1

I created a config.js file which has the import of all variables e.g

export const REACT_APP_API_HOST = process.env_REACT_APP_API_HOST ?? "*********";

when I am building the app i put my env variables into the string when before i push i remove the variableleaving an empty string.

You can also an automation that would create the config.js everytime you build,

that way u dont have to worry about making the mistake of pushing your envs to git,

PS: would update this once i can create the automation

Amourpropre

Answer 2

Hostinger doesn't provide any environment variables.

Create one's own by putting the config file, named as you want, into the top level with the public_html folder. Then at runtime path to that file and load it into the site.

Chaffin