diff --git a/client/src/App.js b/client/src/App.js
index 75ac588..924df55 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import HelloWorld from './components/HelloWorld';
 import './style/style.css';
 // import * as api from './api';
 // un-comment this ^ ^ ^ to import api endpoints
@@ -13,7 +14,11 @@ function App() {
   //
   // example ^ ^ ^ using the api endpoint
 
-  return <div>Hello World - React.js</div>;
+  return (
+    <div className='App'>
+      <HelloWorld />
+    </div>
+  );
 }
 
 export default App;
diff --git a/client/src/components/HelloWorld.jsx b/client/src/components/HelloWorld.jsx
new file mode 100644
index 0000000..81e562c
--- /dev/null
+++ b/client/src/components/HelloWorld.jsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+function HelloWorld() {
+  return <div>Hello World - React.js</div>;
+}
+
+export default HelloWorld;
diff --git a/client/src/style/style.css b/client/src/style/style.css
index 031a039..9f03099 100644
--- a/client/src/style/style.css
+++ b/client/src/style/style.css
@@ -8,3 +8,10 @@ body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
+
+.App {
+  width: 100%;
+  min-height: 100vh;
+  display: grid;
+  place-items: center;
+}