DEV Community

Cover image for ESLint and Prettier

Posted on

ESLint and Prettier

Hello amazing folks!๐Ÿ™‚

Let's discuss something interesting today.

Let's understand what and why about Eslint and Prettier.

Imagine working over a project with more than 10 developers to achieve a vision ๐Ÿง‘โ€๐Ÿ’ป. After 3 months you realize how messy things are now ๐Ÿค’.

Frustrated Face

Funny part is even the person who wrote the code is confused in their own code ๐Ÿ˜‚.

Want to avoid such scenario ? ๐Ÿ˜ถ

Form a structure which everyone will follow while writing their codes to make it easily understandable by everyone โœŒ. Sounds easy right ? But will everyone follow those things that seriously ๐Ÿค”!

Thinking Image

Think about someone getting added to the team. The person is a little freedom lover and mostly forgets to follow those set of rules. ๐Ÿ˜

Hmm... code getting messed slowly right ?

Ya that's what Eslint and Prettier comes into play ๐Ÿ˜ƒ. Eslint and Prettier are used to format the whole codebase into some set of rules.

Like there should not be any console log while pushing any code to production . Mainly done to ensure there is no printing of sensitive data on the logs.

Want to have a peak on how it looks ?

    "semi": true,
    "tabWidth": 2,
    "printWidth": 100,
    "singleQuote": true,
    "trailingComma": "none",
    "jsxBracketSameLine": true
Enter fullscreen mode Exit fullscreen mode

Here's a peak of the configuration of the Prettier . You can see there are rules which can be made true based on your need.

Want to read more ๐Ÿ‘‰

    "rules": {
        "semi": ["error", "always"],
        "quotes": ["error", "double"]
Enter fullscreen mode Exit fullscreen mode

A small peak of Eslint , you can set types as warning or error. Forcing developers to follow a proper structure of coding.

I know ! I know !

Many people will think why force some rules while coding to developers. Let them code freely without any rules and restrictions ๐Ÿค”.


I also used to believe the same !

But when I was working over a project with other developers, I understood how difficult it becomes when you have to read others messy code ๐Ÿ™โ€โ™‚โ€.

I know maybe it's sometimes painful but it's worthed. As clean coding is always tough for developer but when the project becomes large it becomes very easy for new developers and the existing developers to work on it ๐Ÿ˜‰.

Let's rock it

I would say. Just try it , I can give you guarantee you will fall love with it ๐Ÿ‘.

And at last I want to say ๐Ÿ‘‡

Keep coding #๏ธโƒฃ , keep rocking ๐Ÿš€

Top comments (2)

andrewbaisden profile image
Andrew Baisden

These two extensions make programming so much easier for us developers.

suchintan profile image

Of course Andrew ๐Ÿ˜Š. I used to be one of the developer's who used to love freedom while working over a project. But around 2 months earlier I started working over a amazing startup which gave me the opportunity to brainstorm things.

And guess what ๐Ÿ˜ฎ. A freedom loving developer like me understood how much important clean coding means and started to love how this works.

That's how I got the idea of writing this blog. To share the information that how important it is really for developers to have eslint and prettier on their projects ๐Ÿ˜‡.