<p>Running pods have some environment variables defined inside, for example:</p>
<pre><code>/ # printenv
REACT_APP_ENV_VARIABLE=Variable from Kube!
REDIS_SERVICE_PORT=6379
KUBERNETES_SERVICE_PORT=443
KUBERNETES_PORT=tcp://10.38.0.1:443
REDIS_PORT=tcp://10.38.61.225:6379
REDIS_PORT_6379_TCP_ADDR=10.38.61.225
HOSTNAME=playground-pod
PLAYGROUND_SERVICE_SERVICE_HOST=10.38.0.53
REDIS_PORT_6379_TCP=tcp://10.38.61.225:6379
PLAYGROUND_SERVICE_SERVICE_PORT=80
PLAYGROUND_SERVICE_PORT=tcp://10.38.0.53:80
PLAYGROUND_SERVICE_PORT_80_TCP_ADDR=10.38.0.53
KUBERNETES_PORT_443_TCP_PROTO=tcp
PLAYGROUND_SERVICE_PORT_80_TCP_PORT=80
PLAYGROUND_SERVICE_PORT_80_TCP_PROTO=tcp
REACT_APP_ENV_VARIABLE_TWO=192.168.1.12
PLAYGROUND_SERVICE_PORT_80_TCP=tcp://10.38.0.53:80
</code></pre>
<p>How should I configure a React app like this one:</p>
<pre class="lang-js prettyprint-override"><code>function App() {
  return (
    &lt;div className=&quot;App&quot;&gt;
      &lt;header className=&quot;App-header&quot;&gt;
        &lt;p&gt;
            &lt;code&gt;ENV. VARIABLE: &lt;/code&gt; {x.REACT_APP_ENV_VARIABLE}
        &lt;/p&gt;
      &lt;/header&gt;
    &lt;/div&gt;
  );
}

export default App;
</code></pre>
<p>to read and inject some of the variables present in the pod?</p>
<p>The main reason I want to know it, is dynamic update of e.g. backend or Redis URLs - they might change when the app is restarted, rescheduled, etc.</p>
<p>My first approach was using a <code>config.json</code> file imported to the app, but this way I can't import dynamic values generated by running pods.</p>

AbreQueVoy
<p>As @Harsh Manvar suggested (thanks a lot!), the <code>react-dotenv</code> library can be used, but just adding it to the project is not enough.</p>
<p>Firstly, you have to follow all steps described in <a href="https://www.npmjs.com/package/react-dotenv" rel="nofollow noreferrer">react-dotenv</a> documentation (adding <code>.env</code> file to your project, editing <code>package.json</code> file).</p>
<p>In my case, <code>.env</code> file looked like this:</p>
<pre><code>REACT_APP_DEPLOY_SETUP='__dps__'
REACT_APP_PORT='__prt__'
REACT_APP_BACKEND_URL='__bur__'
</code></pre>
<p>These are just placeholders for real values that will be added during runtime.</p>
<p>Having the <code>.env</code> file ready, <code>npm</code> scripts prepended with <code>react-dotenv</code> command, and the variables whitelisted (as described in the library documentation), you can build your app image.</p>
<p>When the image is ready, add it to the <code>kubernetes</code> pod config file and replace your variables' placeholders with real values, like this:</p>
<pre class="lang-yaml prettyprint-override"><code>[...]
spec:
  containers:
  - name: plg-frontend
    image: localhost:5000/frontend:1.22
    ports:
    - containerPort: 80
    command:
    - sh
    - -c
    args:
    - sed -i &quot;s/__prt__/$REACT_APP_PORT/g&quot; /usr/share/nginx/html/env.js;
      sed -i &quot;s/__bur__/http:\/\/$BACKEND_SERVICE_HOST/g&quot; /usr/share/nginx/html/env.js;
      sed -i &quot;s/__dps__/$REACT_APP_DEPLOY_SETUP/g&quot; /usr/share/nginx/html/env.js;
      nginx -g 'daemon off;'
    env:
    - name: REACT_APP_DEPLOY_SETUP
      value: &quot;development&quot;
    - name: REACT_APP_PORT
      value: &quot;5089&quot;
</code></pre>
<p>What happened up there, was replacing placeholder values with actual values:</p>
<ul>
<li><code>$BACKEND_SERVICE_HOST</code> is an environment variable that exists in the pod and can be read from the running container,</li>
<li><code>$REACT_APP_DEPLOY_SETUP</code> is a regular string defined by user,</li>
<li><code>$REACT_APP_PORT</code> is an integer value (it has to be in quotes, like strings!).</li>
</ul>
<p>And the replacing happened with <code>sed</code> command (or rather: <code>sh -c &quot;sed -i ...&quot;</code>). All of the commands are chained, so don't forget about semicolons at the end of each argument.</p>
<p>All of the replacements were made in <code>/usr/share/nginx/html/env.js</code> file, which is created by <code>react-dotenv</code> library in project root. The actual location depends on where you mounted your build image (it's defined in <code>Dockerfile</code>).</p>
<p>Lastly, <code>nginx</code> command is called, since this is the final command invoked in image's <code>Dockerfile</code>. Without this explicit call, the command from the <code>Dockerfile</code> would be overwritten with the commands related to the pod container and, in this case, <code>nginx</code> wouldn't start your app.</p>
<p>After the pod is started, you can check whether the variables are present in the container:</p>
<pre><code>kubectl exec &lt;pod-name&gt; -- printenv | grep REACT_APP
</code></pre>
<p>But it doesn't mean they were read by your app during runtime. To see if they were changed to the values from the pod definition, you can either <code>exec</code> running pod container and preview the <code>env.js</code> file or add some console logging in the app code.</p>
