Tamia  Walter

Tamia Walter

1619409354

React Cheatsheet – 9 Common HTML Rendering Cases You Should Know

Whenever I’m starting with a new framework or it’s been a while since I’ve used it, I always end up searching for the same simple things.

I’ll Google how to render raw HTML, how to display a component based on a condition, how to assign a class to an element, and so on.

That’s why I created this cheat sheet with the nine most common tasks you will perform on a regular basis with React and JSX.

I ordered them in the way I typically stumble upon them when building an application. In the examples below, the first code snippet will show the syntax, and the second one will show how to use it with real data.

  • How to Output Data into HTML
  • How to Add a Standard Class Attribute
  • How to Output Data into HTML Attributes
  • How to Output Raw HTML
  • How to Iterate Over Data Sets
  • How to Iterate Over Data Sets with an index
  • How to Render Conditional Markup
  • How to Render Conditional Markup Including else branch
  • How to Pass Data to Child Components

#react #html #web-development

React Cheatsheet – 9 Common HTML Rendering Cases You Should Know