I am a beginner developer and would like to understand how I can put my authentication token in an environment variable when using React.

I am using the nom package @paddle/paddle-js and followed the example text to export the Checkout function.

The example code employs useState:
const [paddle, setPaddle] = useState<Paddle>();

From my undestanding useState can only used in client rendered components.
However, I cannot only use process.env in server rendered components.

Can someone help me shed light on this?

I tried to use env:

token: process.env.REACT_APP_PADDLE_TOKEN

I expected that the variable would hold the correct value. However debugging showed that it is undefined.