238 comments found.
Hello,
I hope this message finds you well. I recently purchased the Enlite Prime – React Admin Dashboard Template for Full-Stack Developer. However, after making the purchase, I realized that the template may not suit my current needs as I did not carefully review the description beforehand. This was my oversight, and I would like to kindly request a refund for the purchase.
Ok, please request with the refund form to me
request refund sent. Thanks for your time and good luck
Hi.
I am trying to add some environment variables and it does not work. I added .env file and .env.development.local and .env.production.local to root project, i defined REACT_APP_SOME_KEY=value and trying to access it through process.env.REACT_APP_SOME_KEY. It yields ‘undefined’ instead of the value set in the .env files. I’ve tried different approaches, still undefined.
How to set environment variables? Any approach is ok!!
Hi,
I think you need install ‘npm install dotenv—save’
Anyway, this template uses cross-env, please try with cross-env like in package.json "start": "cross-env NODE_ENV=development node server",
Here’s the reference about the .env and cross-env:
https://stackoverflow.com/questions/49579028/adding-an-env-file-to-a-react-project https://github.com/kentcdodds/cross-env/issues/56 https://github.com/TypeStrong/ts-node/discussions/1612Regards.
Hello there, I really love this template, could you please do like a video tutorial for people who only know WordPress and are interested in experimenting with your Creation as a project, it will be really helpful. You can also make it paid on YouTube, just thought to share
Hi, Thanks for the insight. I will consider for do that.
Hello,
We bought your enlite prime template, but we need some flags like in your template, we need English, Turkish and Russian flag for using it in your codes directly. Can you provide us them as vertical like in your template?
Thanks in advance.
Hi,
Here’s the flag css in header-jss.js and images
https://firebasestorage.googleapis.com/v0/b/enlite-3a841.appspot.com/o/images%2FflagSprite42.png?alt=media&token=65884b5b-690d-4a4c-9a29-d0d184dc6921&_gl=1*11t1qgk*_ga*MTE1MjMyMTg4Ny4xNjk4NzUxMzg3*_ga_CW55HF8NVT*MTY5ODc1MTM4Ny4xLjEuMTY5ODc1MTY0OC45LjAuMA..
const flagIcon = {
width: 16,
height: 16,
borderRadius: '50%',
display: 'inline-block',
position: 'relative',
marginRight: 5,
top: 1,
background: `url(${flag}) no-repeat transparent`,
backgroundSize: '18px 7248px',
'&[class="ar"]': {
backgroundPosition: 'center 1.7805%'
},
'&[class="zh"]': {
backgroundPosition: 'left 0.2287%'
},
'&[class="en"]': {
backgroundPosition: 'center 1.5589%'
},
'&[class="de"]': {
backgroundPosition: 'center 0.6721%'
},
'&[class="id"]': {
backgroundPosition: 'center 0.4524%'
},
'&[class="es"]': {
backgroundPosition: 'left 1.1162%'
},
'&[class="ru"]': {
backgroundPosition: 'center 0.8958%'
},
'&[class="tr"]': {
backgroundPosition: 'center 1.3379%'
},
};
You can generate more flags with https://www.freakflagsprite.com/
Regards.
Thank you, it helps too much.
Youre welcome
Hey we have another problem, we want to use specific environment for our website other than using the same url of the frontend files. I mean even if we deploy our project to www.example.com, we want to use www.exampleapi.com as url with build, can you provide me the webpack files for it, i couldnt handle it myself because i have not got that much experience with webpack.
Thanks in advance.
Ok i found the way using process.env.NODE_ENV, thank you 
You’re welcome and happy coding
how to add prettier to project
I solved the problem when adding .prettierrc
Okay, Thanks for purchasing
how to upload template on digital ocean? not working If I upload build folder
Hi,
If you’re using digital ocean droplet please use pm2 and check the docs https://ilhammeidi.github.io/enlite-docs/#deploy Then please setup the nginx for proxy https://www.digitalocean.com/community/tutorials/how-to-configure-nginx-as-a-reverse-proxy-on-ubuntu-22-04
If you’re using digital ocean app-platform, you can upload the build/ folder https://www.digitalocean.com/community/tutorials/how-to-deploy-a-react-application-to-digitalocean-app-platform
If you find any routing issues please try to configure the rewrite rules for routing https://docs.digitalocean.com/products/app-platform/how-to/url-rewrites/
- Route Path: /* - Rewrite path: /index.html
Regards
Hello,
I examined your product and your demo and loved it so much visually and conditionally. We need a template which has clean code structure, using function components with hooks and if possible works with redux toolkit. So i want to ask them, especially about using hooks and clean code inside, like making structures and components using useeffect usestate hooks instead of some random functions rerendering all the time while doing nothing at the page. And lastly i want to learn which form package do you use for forms? With these questions, if you think your product satisfies which i mentioned, we would like to buy it, so i wait for your reply. Thanks in advance.
Hi,
Thanks for visiting my portfolio.
This template uses redux (not redux-toolkit), react hooks functional structure and redux form to handle some forms.
Before buy, You can try the sample project and read the online docs.
https://ilhammeidi.github.io/enlite-docs https://github.com/ilhammeidi/enlite-starterRegards.
Hi,
Thanks for the response and answers, also that example github project is the one which i look for the answers of my other questions, thanks a lot.
Getting error
ERROR in undefined undefined Error: Child compilation failed: Module build failed (from ./node_modules/html-loader/index.js): Error: Cannot find module ’/Users/Khalid/Documents/WebApp/app/node_modules/uglify-js/node_modules/source-map/source-map.js’. Pl ease verify that the package.json has a valid “main” entry at tryPackage (node:internal/modules/cjs/loader:438:19) at Module._findPath (node:internal/modules/cjs/loader:680:18) at Module._resolveFilename (node:internal/modules/cjs/loader:1063:27) at Module._load (node:internal/modules/cjs/loader:922:27) at Module.require (node:internal/modules/cjs/loader:1143:19) at require (node:internal/modules/cjs/helpers:110:18) at Object.<anonymous> (/Users/Khalid/Documents/WebApp/app/node_modules/uglify-js/tools/node.js:26:6) at Module._compile (node:internal/modules/cjs/loader:1256:14) at Module._extensions..js (node:internal/modules/cjs/loader:1310:10) at Module.load (node:internal/modules/cjs/loader:1119:32) ModuleBuildError: Module build failed (from ./node_modules/html-loader/index.js): Error: Cannot find module ’/Users/Khalid/Documents/WebApp/app/node_modules/uglify-js/node_modules/source-map/source-map.js’. Pl ease verify that the package.json has a valid “main” entry at tryPackage (node:internal/modules/cjs/loader:438:19) at Module._findPath (node:internal/modules/cjs/loader:680:18) at Module._resolveFilename (node:internal/modules/cjs/loader:1063:27) at Module._load (node:internal/modules/cjs/loader:922:27) at Module.require (node:internal/modules/cjs/loader:1143:19) at require (node:internal/modules/cjs/helpers:110:18) at Object.<anonymous> (/Users/Khalid/Documents/WebApp/app/node_modules/uglify-js/tools/node.js:26:6) at Module._compile (node:internal/modules/cjs/loader:1256:14) at Module._extensions..js (node:internal/modules/cjs/loader:1310:10) at Module.load (node:internal/modules/cjs/loader:1119:32) at processResult (/Users/Khalid/Documents/WebApp/app/node_modules/webpack/lib/NormalModule.js:753:19) at /Users/Khalid/Documents/WebApp/app/node_modules/webpack/lib/NormalModule.js:855:5 at /Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/LoaderRunner.js:399:11 at /Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/LoaderRunner.js:185:11 at loadLoader (/Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/loadLoader.js:33:11) at iteratePitchingLoaders (/Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/LoaderRunner.js:182:2) at iteratePitchingLoaders (/Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/LoaderRunner.js:178:10) at /Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/LoaderRunner.js:189:18 at handleResult (/Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/loadLoader.js:53:2) at loadLoader (/Users/Khalid/Documents/WebApp/app/node_modules/loader-runner/lib/loadLoader.js:35:10)
Please run npm install before start, here’s the online docs https://ilhammeidi.github.io/enlite-docs/
Dear ilhammeidi,
I hope this message finds you well. I wanted to take a moment to express my gratitude for the incredible template you’ve produced for React. It is truly a remarkable piece of work, and I appreciate the effort and thought you’ve put into it.
However, I do have a question. I’m interested in using Next.js alongside this magnificent template. Would it be possible for you to provide some guidelines or instructions on how to integrate Next.js with your existing template? Having such guidance would greatly simplify the process for us, and I believe it would be immensely beneficial for other developers as well.
Additionally, I wanted to inquire if you have any plans to explore Next.js in the future. Combining the power of Next.js with your exceptional template has the potential to be a game-changer for developers. Thank you once again for your hard work and dedication.
Looking forward to your response.
Best regards,
Hi Seifoufa,
Thanks for visiting my portfolio and also thanks for the appreciation.
I have another templates with next js but they’re for the landing page https://themeforest.net/item/oiron-react-js-landing-page-collection/34577670 and https://themeforest.net/item/luxiren-react-js-landing-page-collection/25087071
All of my react templates are use material-ui (mui) so it should can be integrated by just copying the react components. You can start by trying the sample-project, I shared the public repo via github link in every product description.
Regards.
Good morning my name is Raúl, I have bought ENLITE PRIME
I bought Enlete prime because it was adapted to firebase.
But it is not dated REDUX FORM, UPLOAD, SVG CHART, etc.
I need to integrate REDUX FORM, could you help me please?
Thanks a lot for everything, kind regards
Hi Raúl,
For redux-form and firebase integration you can check in Login Firebase app/components/Forms/LoginFormFirebase.js and for upload in contact app/components/Contact/AddContactForm.js
But for upload contact, I separated the input that using dropzone.
Regards.
Hello while running build:dll I am getting this error
[webpack-cli] TypeError: compiler.plugin is not a function at HappyPlugin.apply (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/happypack/lib/HappyPlugin.js:109:12) at createCompiler (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack/lib/webpack.js:73:12) at create (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack/lib/webpack.js:134:16) at webpack (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack/lib/webpack.js:142:47) at WebpackCLI.f [as webpack] (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack/lib/index.js:64:16) at WebpackCLI.createCompiler (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack-cli/lib/webpack-cli.js:2053:29) at async WebpackCLI.buildCommand (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack-cli/lib/webpack-cli.js:2173:20) at async Command.<anonymous> (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack-cli/lib/webpack-cli.js:850:25) at async Promise.all (index 1) at async Command.<anonymous> (/Users/parthgaikwad/Downloads/pbAdmin-master/node_modules/webpack-cli/lib/webpack-cli.js:1495:13)
and also
ERROR in ./app/app.js Module build failed (from ./node_modules/happypack/loader.js): Error: error:0308010C:digital envelope routines::unsupported at new Hash (node:internal/crypto/hash:71:19) at Object.createHash (node:crypto:133:10) at filename (/Users/parthgaikwad/Documents/parkinbuddy/pb-admin-2-master/node_modules/babel-loader/lib/cache.js:94:23) at /Users/parthgaikwad/Documents/parkinbuddy/pb-admin-2-master/node_modules/babel-loader/lib/cache.js:122:39 at Generator.next (<anonymous>) at asyncGeneratorStep (/Users/parthgaikwad/Documents/parkinbuddy/pb-admin-2-master/node_modules/babel-loader/lib/cache.js:3:103) at _next (/Users/parthgaikwad/Documents/parkinbuddy/pb-admin-2-master/node_modules/babel-loader/lib/cache.js:5:194) at /Users/parthgaikwad/Documents/parkinbuddy/pb-admin-2-master/node_modules/babel-loader/lib/cache.js:5:364 at new Promise (<anonymous>) at /Users/parthgaikwad/Documents/parkinbuddy/pb-admin-2-master/node_modules/babel-loader/lib/cache.js:5:97
Hi,
The happy pack is deprecated for the latest node version. I removed the happypack and use babel loader instead https://github.com/ilhammeidi/dandelion-starter/commit/70f98250a672fcda53a4e35ff2831b432a372d74
Please check the latest version of enlite prime (version 2.0) or use node.js older version.
Regards.
Hi, i really like your product, it’s awesome. But I figure out that in contact page (app / pages / contact) most the browsers its look greet but using Google Chrome the favourite star and edit pencil coming on back of the user image which make it nearly invisible, do you have a plan to fix this matter in future?
Hi, thanks for the appreciation.
I will check the issue and make a patch in next update.
Regards.
When i inspects elements on the browser, it is difficult to find where the element is located on the code. I keep seeing mui… without the name of the line it is located on the code. E.g
Yes because the react is different than static html, the javascript codes is compiled to html in browser. You can use chrome plugin like reacr developer tools. Here’s a reference about that https://www.digitalocean.com/community/tutorials/how-to-debug-react-components-using-react-developer-tools
Hi While I am trying to deploy the app on Vercel the deployment is getting successful but I am getting this when I open the URL. Please help
404: NOT_FOUND Code: NOT_FOUND ID: bom1::sq9s4-1676994515728-9995c879e4a4
link to the deployment : https://enlite-prime-yas2-elxh1c1zl-kwadserve.vercel.app
Link to github: https://github.com/kwadserve/enlite-prime
Hi,
Please check this reference https://medium.com/today-i-solved/deploy-spa-with-react-router-to-vercel-d10a6b2bfde8 and for using rewrites rule https://stackoverflow.com/questions/64815012/why-does-react-router-not-works-at-vercel
And please set the output directory target to build folder. If some images or assets missing, please copy the images/ and favicons/ from public folder to buiild folder.
Regards.
Does the site include a backend or just a frontend? and i can link database
Hi,
Thanks for visiting my portfolio.
This template uses backend with firebase to handle authentications and CRUD function in menu Application > Firebase Apps. Feel free to explore the online docs and sample-project, check the link in item description.
Regards.
Hello Support.
I want to purchase this template but prefer HTML, js, and CSS instead of React flavor.
Thanks
Hi, sorry I only have react version
When i click an icon on the big-sidebar layout, it opens the closed sidebar. When i click on the same icon again, i want the sidebar to be closed. Pls how do i achieve that.
Hi,
That function should already implemented like in demo https://enlite.ux-maestro.com/app. If not work, please check your changes.
For the code you can check them component in app/containers/Templates/Dashboard.js
toggleDrawer={toggleDrawer} And the reducer in app/redux/modules/uiReducer.js case TOGGLE_SIDEBAR:
Regards.
I want the big-sidebar layout to overlay only when on phone screen size. Pls how do i go about that
Hi,
In app/components/SidebarBig/index.js you can change<Hidden lgUp> to <Hidden smUp>
For more info about Hidden component you can check the docs here https://v4.mui.com/components/hidden/#hidden and for breakpoints https://v4.mui.com/customization/breakpoints/
Regards.
Thanks for your last response, it helped. How can i change the default layout from Big Sidebar to Sidebar from the code.
Hi,
You can change in app/redux/modules/uiReducer.js in initialState, also including all ui configs there.
const initialState = {
layout: 'sidebar',
// rest-code
}
Regards.
Thanks
The issue has been resolved. Its was due to my screen size. The area i need your support is on how i can change the background colour of the header and sidebar. Thanks
Hi,
For header you can add background in app/components/Header/header-jss.js in appbarShift:{} and for sidebar app/components/SidebarBig/sidebarBig-jss.js in bigSidebar: {}
Regards.
