diff --git a/client/src/App.js b/client/src/App.js index 8b1b39c..22912d7 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -1,7 +1,5 @@ import React from 'react'; -import HelloWorld from './components/HelloWorld'; -import './style/style.css'; // regular CSS -> className='app' -import styles from './style/App.module.css'; // module CSS -> className={styles.App} (AKA styled components) +import HelloWorld from './components/HelloWorld/HelloWorld'; // import * as api from './api'; // ^ ^ ^ un-comment this to import api endpoints @@ -17,7 +15,7 @@ function App() { // ^ ^ ^ example using the api endpoint return ( -
+
); diff --git a/client/src/components/HelloWorld.jsx b/client/src/components/HelloWorld.jsx deleted file mode 100644 index 81e562c..0000000 --- a/client/src/components/HelloWorld.jsx +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react'; - -function HelloWorld() { - return
Hello World - React.js
; -} - -export default HelloWorld; diff --git a/client/src/components/HelloWorld/HelloWorld.jsx b/client/src/components/HelloWorld/HelloWorld.jsx new file mode 100644 index 0000000..8328f24 --- /dev/null +++ b/client/src/components/HelloWorld/HelloWorld.jsx @@ -0,0 +1,8 @@ +import React from 'react'; +import styles from './style/HelloWorld.module.css'; // CSS module -> className={styles.App} (AKA styled components) + +function HelloWorld() { + return
Hello World - React.js
; +} + +export default HelloWorld; diff --git a/client/src/style/App.module.css b/client/src/components/HelloWorld/style/HelloWorld.module.css similarity index 84% rename from client/src/style/App.module.css rename to client/src/components/HelloWorld/style/HelloWorld.module.css index c3abdf2..f3f4dce 100644 --- a/client/src/style/App.module.css +++ b/client/src/components/HelloWorld/style/HelloWorld.module.css @@ -1,4 +1,4 @@ -.App { +.HelloWorld { width: 100%; min-height: 100vh; display: grid;