DEV Community

Sreeharsh K
Sreeharsh K

Posted on

3 1

Code Reactjs Faster by Enabling Emmet for JavaScript and TypeScript in VS Code

If you have watched various tutorials on YouTube about Reactjs and wondered how these guys code so quickly?

Well, if you are an intermediate coder like me or beginner you might not have the idea how does they do it. I have found a way how they are all using various plugins in their Code Editor or the IDE(integrated development environment). Some of these plugins include ES7 React/Redux/GraphQL/React-Native snippets, Auto Close Tag, Auto Complete Tag.

But, today I discovered something new for Reactjs developers, its called Emmet support.

The Emmets are actually inspired by the CSS Selectors, it allows you to type shortcuts that are then expanded into full pieces of code. Emmet abbreviation and snippet expansions are enabled by default in js, jsx, tsx, ts among other files.

How to Enable Emmet Support for JSX

You can enable it by adding the following code inside Settings.json of your Visual Studio Code Editor.

"emmet.includeLanguages":{
        "javascript": "javascriptreact",
        "typescript": "typescriptreact"
}
Enter fullscreen mode Exit fullscreen mode

References

Brian Design

Image of Datadog

The Future of AI, LLMs, and Observability on Google Cloud

Datadog sat down with Google’s Director of AI to discuss the current and future states of AI, ML, and LLMs on Google Cloud. Discover 7 key insights for technical leaders, covering everything from upskilling teams to observability best practices

Learn More

Top comments (0)

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more