Clayton.Berger.ATX.Advanced1.First React App

src/components/App.js

@@ -0,0 +1,33 @@
+import React from "react";
+// import logo from "./logo.svg";
+import "../App.css";
+// import apple from "./apple.svg";
+// import france from "./france.svg";
+import Header from "./Header";
+import SmileyFace from "./Smiley";
+import Main from "./Main";
+import Insert from "./Insert";
+// import users from "./users";
+import Component5 from "./Component5";
+import Component6 from "./Component6";
+import ComponentX from "./Component7";
+
+
+function App() {
+  return (
+    <div className="App">
+      <Header />
+      <Insert message="We got this." />
+      <Main />
+      <SmileyFace />
+      <Component5 />
+      <Component6 />
+      <ComponentX />
+    </div>
+
+  );
+}
+
+
+
+export default App;

src/components/Component5.js

@@ -0,0 +1,12 @@
+import React from "react";
+
+function Component5() {
+  return (
+    <div>
+      <p className="App-intro"> Component5!!</p>
+    </div>
+
+  );
+
+}
+export default Component5;

src/components/Component6.js

@@ -0,0 +1,13 @@
+import React from "react";
+
+function Component6() {
+
+  return (
+    <div>
+      <p className="App-intro"> Component6!!</p>
+    </div>
+  );
+
+}
+
+export default Component6;

src/components/Component7.js

@@ -0,0 +1,12 @@
+import React from "react";
+function Component7() {
+
+  return (
+    <div>
+      <p className="App-intro"> Component7!!</p>
+    </div>
+  );
+
+}
+
+export default Component7;

src/components/Header.js

@@ -0,0 +1,17 @@
+import React from "react";
+import france from "./france.svg";
+
+function Header() {
+  return (
+    <div>
+      <img src={france} className="App-logo" alt="logo" />
+      <h2> Were rockin NOW!!! </h2>
+    </div>
+  );
+
+
+
+}
+
+
+export default Header;

src/components/Insert.js

@@ -0,0 +1,11 @@
+import React from "react";
+
+function Insert(props){
+  return(
+    <div className="App-header">
+      <h2>{props.message}</h2>
+    </div>
+  );
+}
+
+export default Insert;

src/components/Main.js

@@ -0,0 +1,17 @@
+import React from "react";
+function Main() {
+
+  return (
+    <p className="App-intro">
+    Day 1 - Form Learning Teams<br />
+    Day 3 - Team Charters are due<br />
+    Day 5 - Learning Teams submit project proposals<br />
+    Day 9 -  Learning Team Check-ins<br />
+    Day 15 - Learning Team Check-ins<br />
+    Day 20 - Learning Team Project Presentations.
+    </p>
+  );
+
+}
+
+export default Main;

src/components/Smiley.js

@@ -0,0 +1,12 @@
+import React from "react";
+import face from "./nerdSmiley.ico";
+
+function Smiley() {
+  return (
+    <div className="Smiley">
+        <img src={face} className="App-logo" alt="logo" />
+    </div>
+  );
+}
+
+export default Smiley;

src/index.js

@@ -1,8 +1,8 @@
 import React from "react";
 import ReactDOM from "react-dom";
-import App from "./App";
+import App from "./components/App";
 import "./index.css";
-import users from "./users";
+// import users from "./users";
 
 
 function render() {
@@ -11,4 +11,7 @@ function render() {
     document.getElementById("root")
   );
 }
+
+
+
 render();