Tryit Editor v3.6 - Show React

index.js

index.html

mysass.scss


import React from 'react';
import ReactDOM from 'react-dom';
import './mysass.scss';
class MyHeader extends React.Component {
  render() {
    return (
      <div>
      <h1>Hello Style!</h1>
      <p>Add a little style!.</p>
      </div>
    );
  }
}
ReactDOM.render(<MyHeader />, document.getElementById('root'));
/*
Notice that you now have three files in your project:
'index.js', 'index.html', and 'mysass.scss'.
*/


<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport"
      content="width=device-width, initial-scale=1" />
    <title>React App</title>
  </head>
  <body>
<div id="root"></div>
</body>
</html>


$myColor: red;
h1 {
  color: $myColor;
}