# Emmet in ReactJS JavaScript JSX

Learn how you can enable using Emmet in ReactJS JavaScript.

## Follow the mentioned steps

1. Open Visual Studio Code.
    
2. Open Settings using the following commands,
    
    1. Mac: `Command (⌘) + ,`
        
    2. Windows: `Ctrl + ,`
        
3. The settings page would look like this
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1689433098416/fb8baa7c-0aef-42e8-bd9e-e7d1f0a7189c.png align="center")
    
4. Make sure to head over to the `Workspace` tab,
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1689433253816/289c9473-b7b5-43e8-9474-292b448cac88.png align="center")
    
5. Now search for the "Emmet" option by typing in the emmet in the search field,
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1689433362705/bd4a08c8-af3c-481e-bb7f-656cb964abd2.png align="center")
    
6. Now search for the section: "Emmet: Include Languages" as shown in the picture,
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1689433590344/6449cc80-19c8-4d85-b0ba-0d8a8da37720.png align="center")
    
7. Here you can add a new item to tell emmet what are the areas you want it to work in, now click the `Add Item` button and type the following in and press the OK button
    
    ![](https://cdn.hashnode.com/res/hashnode/image/upload/v1689433776327/20053cb1-7ea4-491d-bf91-c93aecf4c05d.png align="center")
    

Congratulations 🎉 !!! Now you will be able to use emmet in JavaScript in React just like you do it in the HTML files.

### Connect with Me🔗👾

Twitter: [https://hemantsharma.tech/x](https://hemantsharma.tech/x)  
LinkedIn: [https://hemantsharma.tech/linkedin](https://hemantsharma.tech/linkedin)  
GitHub: [https://hemantsharma.tech/github](https://hemantsharma.tech/github)  
Website: [hemantsharma.tech](https://hemantsharma.tech/)