Good work. Just a reminder don't store your API key in your React App, save it in environment file like .env.local or .env.production as REACT_APP_TINYMCE_API_KEY=your-api-key-here
and retrieve it by using process.env.REACT_APP_TINYMCE_API_KEY in your react App.
Have had many hats on in my life: Developer, Team Lead, Scrum Master, Architect and Product Owner. Now back to developer \o/ Interested in product discovery, quality assurance and language design.
Good advice, but please don't believe that they are secured when you store them in env vars. They're still part of the JavaScript code delivered to the browser, and hence can be viewed by anybody, e.g. via DevTools.
Good work. Just a reminder don't store your API key in your React App, save it in environment file like .env.local or .env.production as
REACT_APP_TINYMCE_API_KEY=your-api-key-here
and retrieve it by using
process.env.REACT_APP_TINYMCE_API_KEY
in your react App.Good advice, but please don't believe that they are secured when you store them in env vars. They're still part of the JavaScript code delivered to the browser, and hence can be viewed by anybody, e.g. via DevTools.
Wow ! Real helpful feedback. I'll be sure to do that. Thanks for this 🙏🏽💯
This is something I need to remember to do. I have to refactor my repos on GitHub to remove them
Does it apply for next.js applications as well?I'm using it in a next js project.
Hi,
Not so sure, currently the supported integrations are for Angular.js, Angular4+, Bootstrap, jQuery, Rails, Swing, WordPress, Vue, and React.js,
but you can keep an eye out: tiny.cloud/docs/integrations/
I think as long as those API keys are public keys those are fine.
Also note that you cannot hide API keys on FrontEnd because they will be included anyways in the production build
create-react-app.dev/docs/adding-c...
Just don't store any SECRET_KEYs in frontend