fmo91/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Dumber Gist</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
</head>
<!--
Dumber Gist uses dumber bundler, the default bundle file
is /dist/entry-bundle.js.
The starting module is pointed to "index" (data-main attribute on script)
which is your src/index.jsx.
-->
<body>
  <div id="root"></div>
  <script src="/dist/entry-bundle.js" data-main="index"></script>
</body>
</html>

## package.json
{
  "dependencies": {
    "react": "^16.0.0",
    "react-dom": "^16.0.0"
  }
}

## run-tests.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/jasmine.min.css">
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/jasmine.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/jasmine-html.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jasmine-core@3/lib/jasmine-core/boot.min.js"></script>
<script src="/dist/entry-bundle.js"></script>
<script>
requirejs([
  // Load test/setup if exists.
  // or tests/setup, __test__/setup, __tests__/setup
  // also matches files in any src/**/__test__
  /\/(tests?|__tests?__)\/setup$/,
  // Load test/**/*.spec.js if exists.
  // or tests/**/*.test.js, __test__/**/*.spec.js
  // also matches files in any src/**/__test__
  /\.(spec|test)$/
]);
</script>
</body>
</html>

## src\App.jsx
import React from "react";
// Try to create a css/scss/sass/less file then import it here

export default function App() {
  return (
    <div>
      <h1>Hello Reaaaact!</h1>
    </div>
  );
}

## src\index.jsx
import React from "react";
import ReactDOM from "react-dom";

import App from "./App";

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

## test\app.spec.jsx
import React from 'react';
import ShallowRenderer from 'react-test-renderer/shallow';
import App from '../src/App';

describe('Component App', () => {
  it('should render message', () => {
    const renderer = new ShallowRenderer();
    renderer.render(<App />);
    let result = renderer.getRenderOutput();
    expect(result.type).toBe('div');
    expect(result.props.children).toEqual(
      <h1>Hello React!</h1>
    );
  });
});
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Dumber Gist</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
	</head>
	<!--
	Dumber Gist uses dumber bundler, the default bundle file
	is /dist/entry-bundle.js.
	The starting module is pointed to "index" (data-main attribute on script)
	which is your src/index.jsx.
	-->
	<body>
	<div id="root"></div>
	<script src="/dist/entry-bundle.js" data-main="index"></script>
	</body>
	</html>
	{
	"dependencies": {
	"react": "^16.0.0",
	"react-dom": "^16.0.0"
	}
	}
	import React from "react";
	// Try to create a css/scss/sass/less file then import it here

	export default function App() {
	return (
	<div>
	<h1>Hello Reaaaact!</h1>
	</div>
	);
	}
	import React from "react";
	import ReactDOM from "react-dom";

	import App from "./App";

	const rootElement = document.getElementById("root");
	ReactDOM.render(<App />, rootElement);
	import React from 'react';
	import ShallowRenderer from 'react-test-renderer/shallow';
	import App from '../src/App';

	describe('Component App', () => {
	it('should render message', () => {
	const renderer = new ShallowRenderer();
	renderer.render(<App />);
	let result = renderer.getRenderOutput();
	expect(result.type).toBe('div');
	expect(result.props.children).toEqual(
	<h1>Hello React!</h1>
	);
	});
	});