Emmet Is Amazing

Tari Ibaba
Coding Beauty
Published in
5 min readJul 31, 2024

--

I see many developers waste far more time than they should writing JSX and HTML.

Enter Emmet: a powerful shorthand syntax for writing large swaths of HTML and JSX code with as little effort as possible:

Use these 10 solid tips to maximize Emmet to its fullest potential and spend much less time writing repetitive HTML.

The syntax is quite similar to CSS and easy to understand.

1. Nest tags with >

Emmet makes creating a hierarchy of tags easier than ever with the > symbol:

From this:

To this:

2. Create siblings with

--

--