ableneo
diff --git a/‎.idea/.gitignore
+2 b/‎.idea/.gitignore
+2
diff --git a/‎.idea/codeStyles/Project.xml
+22 b/‎.idea/codeStyles/Project.xml
+22
diff --git a/‎.idea/misc.xml
+6 b/‎.idea/misc.xml
+6
diff --git a/‎.idea/modules.xml
+8 b/‎.idea/modules.xml
+8
diff --git a/‎.idea/vcs.xml
+6 b/‎.idea/vcs.xml
+6
diff --git a/‎README.md
+3-1 b/‎README.md
+3-1
diff --git a/‎aws-terraform-workshop-frontend.iml
+9 b/‎aws-terraform-workshop-frontend.iml
+9
diff --git a/‎public/index.html
+12 b/‎public/index.html
+12
diff --git a/‎src/App.css
+3 b/‎src/App.css
+3
diff --git a/‎src/App.js
+36 b/‎src/App.js
+36
diff --git a/‎src/App.test.js
+9 b/‎src/App.test.js
+9
diff --git a/‎src/index.js
+8 b/‎src/index.js
+8
@@ -1 +1,3 @@
-# aws-terraform-workshop-frontend
+# Basic Example
+
+A simple [create-react-app](CRA-README.md) setup, showcasing one of the lastest React-Bootstrap components!
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>React-Bootstrap CodeSandbox Starter</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+  </body>
+</html>
@@ -0,0 +1,3 @@
+.header {
+  text-align: center;
+}
@@ -0,0 +1,36 @@
+import React, {useState} from 'react';
+
+import Toast from 'react-bootstrap/Toast';
+import Container from 'react-bootstrap/Container';
+import Button from 'react-bootstrap/Button';
+
+import './App.css';
+
+const ExampleToast = ({children}) => {
+    const [show, toggleShow] = useState(true);
+
+    return (
+        <>
+            {!show && <Button onClick={() => toggleShow(true)}>Show Toast</Button>}
+            <Toast show={show} onClose={() => toggleShow(false)}>
+                <Toast.Header>
+                    <strong className="mr-auto">React-Bootstrap</strong>
+                </Toast.Header>
+                <Toast.Body>{children}</Toast.Body>
+            </Toast>
+        </>
+    );
+};
+
+const App = () => (
+    <Container className="p-3">
+        <Container className="p-5 mb-4 bg-light rounded-3">
+            <h1 className="header">Welcome to AWS Terraform Workshop</h1>
+            <ExampleToast>
+                Message from backend: <span id="backend-response">Hello</span>
+            </ExampleToast>
+        </Container>
+    </Container>
+);
+
+export default App;
@@ -0,0 +1,9 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+it('renders without crashing', () => {
+  const div = document.createElement('div');
+  ReactDOM.render(<App />, div);
+  ReactDOM.unmountComponentAtNode(div);
+});
@@ -0,0 +1,8 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import App from './App';
+
+// Importing the Bootstrap CSS
+import 'bootstrap/dist/css/bootstrap.min.css';
+
+ReactDOM.render(<App />, document.getElementById('root'));
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+.header {`
	`2`	`+ text-align: center;`
	`3`	`+}`