Today we will show you how to render curly braces as plain text in React/JSX. There are multiple ways to do it but here we will show you only two useful methods to achieve it.

Ways to render curly braces in React

1. Using HTML character codes
2. Using string interpolation in ES6

1. Using HTML character codes

To render the curly braces we can use the following codes.

Left Curly Brace { : {
Right Curly Brace } : }

2. Using string interpolation in ES6

We can use string interpolation in ES6. Template literals are string literals allowing embedded expressions. You can use multi-line strings and string interpolation features with them.

Template literals are enclosed by the backtick ( ̀   ̀) (grave accent) character instead of double or single quotes.

That’s it for today.
Hope you like this short article. Happy Coding..!! 🙂