Quick Tip: Format Code Inside Google Chrome Dev Tools

Debugging front end JS and CSS files in Chrome Developer Tools has made the work of an average web developer very easy. You can edit the styles directly and see live changes without even reloading.

But when it comes to minified codes can be really difficult to work with, you first have to format it on a parse, there are hundreds of them online, paste your code there, copy your code back in the source file and debug it.

Format Them All With In-built function

When you are in the Developer Tools, navigate to the file in "Sources" tab and click the "{}" button at the bottom to format the code.

And the code gets beautifully formatted. Now you can edit the files easily without having to copy to and fro the code.