Soluții

React JSX

What is JSX?
  • JSX stands for JavaScript XML.
  • JSX allows us to write HTML in React.
  • JSX makes it easier to write and add HTML in React.
Coding JSX

JSX allows us to write HTML elements in JavaScript and place them in the DOM without any createElement()  and/or appendChild() methods.

  • JSX converts HTML tags into react elements.
  • You are not required to use JSX, but JSX makes it easier to write React applications.
  • Here are two examples. The first uses JSX and the second does not:
Example 1

JSX:

const myelement = <h1>I Love JSX!</h1>;

ReactDOM.render(myelement, document.getElementById('root'));
[mai mult...]

Styling React Using Sass

What is Sass

Sass is a CSS pre-processor.

Sass files are executed on the server and sends CSS to the browser.

Can I use Sass?

If you use the create-react-app in your project, you can easily install and use Sass in your React projects.

Install Sass by running this command in your terminal:

>npm i sass

Now you are ready to include Sass files in your project!

Create a Sass file

Create a Sass file the same way as you create CSS files, but Sass files have the file extension .scss

In Sass files you can use variables and other Sass functions:

my-sass.scss:

Create a variable to define the color of the text:

$myColor: red;

h1 {
  color: $myColor;
}
[mai mult...]