DEV Community

Cover image for Console.log Development vs Production
Zain Ahmed
Zain Ahmed

Posted on

1

Console.log Development vs Production

I was working on a project with some local software house developer and what i notice is they use to much console's in application and these console are all in from local/development to production which is really bad for the application , so i decided to work on it and make a solution to this, we can create a custom function which will work for use to console data on some specific environment like on local/development but not on production,

i just create a util folder and in it i create a file name utils.js in which i define a function

Alt Text

in this example you can see i just create a function with name "consoleLog" which console the data with string which comes from parameter pass to this function, ignore the env and if condition , now this console will work on every environment and console dat,
but we want to console data only in development

npm i react-dotenv install this library and create .env file on your root folder, and then see the previous logic.

Alt Text

Alt Text

Alt Text

you can also just do a simple logic in root/app file in componentDidMount/userEfect with
Alt Text

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

Top comments (5)

Collapse
 
lukeocodes profile image
@lukeocodes πŸ•ΉπŸ‘¨β€πŸ’» β€’

You could also disable console.log in production?

console.log = function() {}
Enter fullscreen mode Exit fullscreen mode
Collapse
 
zainbinfurqan profile image
Zain Ahmed β€’

Yes you can also define simple logic in app/root file and make console.log func to empty function, thanks for this suggestion.

Collapse
 
lukeocodes profile image
@lukeocodes πŸ•ΉπŸ‘¨β€πŸ’» β€’

Ideally, you would use eslint to highlight them all. Then, before accepting the changes, go and remove them.

Thread Thread
 
zainbinfurqan profile image
Zain Ahmed β€’

sorry didn't get your point

Thread Thread
 
lukeocodes profile image
@lukeocodes πŸ•ΉπŸ‘¨β€πŸ’» β€’

Don't let console.log make it to production. Edit them out. eslint can read the code and warn you

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay