I want to hide some menu from left navigation in production mode.
I've tried NODE_ENV, process.env, NODE_ENV etc. When I'm trying NODE_ENV, it returns production in development and production mode both. Any way to get config in admin ui? I can get environment name in controller using proces.env but I don't know how to send data from controller to admin ui.
I can get it in controller using process.env.NODE_MODULE or strapi.config but it's not accessible in react admin ui.
This is possible with webpack and can be done using following blog: https://medium.com/#justintulk/passing-environment-variables-into-your-code-with-webpack-cab09d8974b0
In webpack file you can fetch the env variables using the following link:
https://webpack.js.org/guides/environment-variables/
Related
I am trying to get started with Fly.io. I know Vue well and wanted to try Nuxt and Node.js. I cannot seem to figure out how to add server-side components and classes for handling AJAX requests.
I followed the official tutorial https://fly.io/docs/languages-and-frameworks/nuxtjs/
npm init nuxt-app#latest spec-land
create-nuxt-app v5.0.0
✨ Generating Nuxt.js project in spec-land
? Project name: spec-land
? Programming language: JavaScript
? Package manager: Npm
? UI framework: Element
? Template engine: HTML
? Nuxt.js modules: Axios - Promise based HTTP client
? Linting tools: (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Testing framework: None
? Rendering mode: Single Page App
? Deployment target: Server (Node.js hosting)
? Development tools: jsconfig.json (Recommended for VS Code if you're not using typescript)
? What is your GitHub username? --
? Version control system: Git
🎉 Successfully created project spec-land
$ touch pages/index.js
$ npm run dev
After adding some front-end code, is this generated project equipped to run JavaScript on the server in the same fly.io deploy?
For a Nuxt2 app, you need to have Rendering Mode as Universal (SSR/SSG) or ssr: true in your nuxt.config.js file, otherwise, you will not have an isomorphic app.
Nuxt will run some code on the server side + client side (isomorphic), while some will be run only on the client side only.
The setup to have a serverMiddleware for Nuxt2 is as follows. Quite tricky and not working so well.
Nuxt3 handles that pretty well on the opposite side.
Overall, Nuxt2 does have some capabilities regarding server-side code but is not as flexible as Nuxt3. Tbh, if you want to use Nuxt2, I would recommend not trying to set up an actual database linked to it, but rather accessing it remotely via axios or like.
I am trying to complete a Redux project and got everything to work fine in development on my own machine but when deployed, the browser is failing to recognise my hidden environment variables so not passing client keys to Api calls and thus making unauthorised requests. I have a '.env' file with the keys in them and then refer thus...
const API_URL = https://api.openweathermap.org/data/2.5/weather?appid=${process.env.REACT_APP_OPEN_WEATHER_MAP_API_KEY}&units=metric;
I have looked up the problem on here and think I understand what's going wrong but don't know how to put it right. I am deploying site via Netlify from my Github repo and my build settings appear to be correct. I thought 'npm run build' took care of all that for me?
99% finished a project and now scratching my head furiously...
Try defining variables in .env file starting with REACT_APP like:
REACT_APP_CLIENT_ID=4
REACT_APP_API_URL=/api
Try using it anywhere like:
const apiUrl: process.env.REACT_APP_API_URL;
Set the environment variables specifically within the Netlify UI. So 'Deploy Settings > Environment > Environment Variables' then variable -'REACT_APP....' value - '*****' for each variable you want defined.
I am trying to publish Gatsbyjs by Azure Static web app.
I have a plugin (gatsby-source-contentful).
I need to pass variables like:
{
resolve: `gatsby-source-contentful`,
options: {
spaceId: process.env.CONTENTFUL_SPACE_ID,
accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
},
},
Error:
Running 'npm run build'...
> gatsby-starter-default#0.1.0 build /github/workspace
> gatsby build
success open and validate gatsby-configs - 0.021s
error Invalid plugin options for "gatsby-source-contentful":
- "accessToken" is required
- "spaceId" is required
not finished load plugins - 0.905s
Where can I pass this?
Thanks.
For Azure Static Web Apps there is two ways to set environment variables one for front-end and one for back-end scenarios.
Since you are using Gatsby, I guess its safe to assume you are building your front-end. For that you will need to add the environment variables on your build configuration (azure-static-web-apps-.yml).
Like so:
env: # Add environment variables here
CONTENTFUL_SPACE_ID: <your-id>
Here is the link for that in documenation.
Not to be confused with this one which is used for defining backend environment variables.
They are called environment variables. They are intended to store sensitive data such as tokens, identifiers, etc, and they shouldn't be pushed in your repository, so you should ignore them (in your .gitignore file).
By default, Gatsby creates 2 environments without noticing you, one for each compilation method:
gatsby develop: uses .env.development
gatsby build: uses .env.production
Note: you can change this behavior if needed to add your own environments using NODE_ENV custom commands.
So, to pass your data to your gatsby-config.js you just need to create two files (.env.development and .env.production) at the root of your project. Then, add the following snippet at the top of your gatsby-config.js:
require("dotenv").config({
path: `.env.${process.env.NODE_ENV}`,
})
Note: dotenv is already a dependency of Gatsby so you don't need to install it again
This will tell Gatsby where to take the environment variables.
You just remain to populate both environment files. Look for the credentials in Contentful and add them in the files using the sane naming than you've set in your gatsby-config.js:
CONTENTFUL_SPACE_ID=123456789
CONTENTFUL_ACCESS_TOKEN=123456789
Keep also in mind that when dealing with Azure, Netlify, AWS, or similar CI/CD tools, you'll need to provide to the server the same environment files to avoid a code-breaking when pushing the changes.
hi im trying to make forgot password/reset password service.
let me show you the logic of this service.
(simply, send email in react(localhost:3000/forgotPassword) -> click link in email -> route to localhost:3000/resetPassword)
1.send email in frontend
The content is to write down the email of the account you joined.
2.email
비밀번호 리셋하기 <- this is direct to http://localhost:3000/resetPassword
3.forgotPassword.js in node.js
Here, I want to change resetURL(http://localhost:3000/resetPassword) to dynamic URL. Because I will distribute this soon.
3.package.json in react
I was able to do api communication from react to node by specifying proxy here, but /api/resetPassword does not work in node.
To sum up, I want to use the code used by React on the node as well. Like this.
You are looking to environmentalise your configuration.
You could do it through an environment variable, like this:
const baseURL = process.env.BASE_URL || 'http://localhost:3000'
const resetURL =`${baseURL}/resetPassword`
If you use the dotenv package, you can support configuration through environment variables or from a .env file.
If I understand correctly, your interested in setting up a dynamic variable for the url in your react app. Try just setting an environment config file, either a file for each environment you are developing in (i.e., Dev, QA, PROD) or a single file with multiple shared Env variables. You can even add an env variable to your package.json file for example.
NOTE the approach below would work for linux and mac, but not windows
please use the resources below for more information. This approach has been made available for react-scripts#0.9.0 and higher.
{
"scripts": "APP_URL=http://localhost:300 npm start"
}
Resources:
https://medium.com/#trekinbami/using-environment-variables-in-react-6b0a99d83cf5
https://create-react-app.dev/docs/adding-custom-environment-variables/
So I'm using cPanel with Setup Node.js App plugin for a Next.js app. (don't asky why cPanel)
Everything is working as expected in development, except for environment variables in production, I set up them manually from the cPanel interface, I restarted/stopped the app, logging the process.env on the server and I don't see the env variables there (not to say when trying to call them they are undefined).
When doing
res.json(JSON.stringify(process.env)); i get a bunch of variables except for the one I manually wrote in cPanel variables interface.
It is important for me to store these variables as secret key because they are API credentials.
Anyone know what I might have misconfigured or had this problem?
Never mind, found the answer, apparenlty was a Next.js misconfiguration. I had to add the following lines of code inside next.config.js in order to read env variables on build version.
require('dotenv').config();
module.exports = {
env: {
EMAIL_NAME: process.env.EMAIL_NAME,
EMAIL_PASSWORD: process.env.EMAIL_PASSWORD,
GETRESPONSE_API_KEY: process.env.GETRESPONSE_API_KEY
}
};
Where EMAIL_NAME, EMAIL_PASSWORD, GETRESPONSE_API_KEY were the variables defined by me on cPanel interface