feat(homepage): add app landing page

- add components for the landing page of the app
- write tests for added components

[Finishes #163051234]

package.json

@@ -5,6 +5,7 @@
   "main": "index.js",
   "scripts": {
     "test": "jest --config=jest.config.json",
+    "test:watch": "npm test -- --watch",
     "coverage": "npm run test -- --coverage",
     "coveralls": "npm run coverage && cat ./coverage/lcov.info | coveralls",
     "build": "webpack --config webpack.config.prod.js",
@@ -23,6 +24,7 @@
   },
   "homepage": "https://github.com/akhilome/kiakiafood#readme",
   "dependencies": {
+    "prop-types": "^15.6.2",
     "react": "^16.7.0",
     "react-dom": "^16.7.0",
     "react-hot-loader": "^4.6.3",

src/components/HomePage.jsx

@@ -1,5 +1,20 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
-const HomePage = () => <div>This is the HomePage!</div>;
+import Nav from './Nav';
+
+const HomePage = () => (
+  <div>
+    <Nav />
+    <section className="hero">
+      <h2>Quell Your Hunger in Minutes</h2>
+      <Link to="/menu">
+        <button type="button" className="btn-primary">
+          Get Food ⟶
+        </button>
+      </Link>
+    </section>
+  </div>
+);
 
 export default HomePage;

src/components/LoginPage.jsx

@@ -3,9 +3,9 @@ import { Link } from 'react-router-dom';
 
 const LoginPage = () => (
   <div>
-    This is the login page See
-    {' '}
-    <Link to="/signup">signup</Link>
+    This is the login page.
+    <br />
+    <Link to="/">Go Home</Link>
   </div>
 );
 

src/components/Nav.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+
+const Nav = () => (
+  <header className="transparent">
+    <div className="site-title">
+      <h2>
+        <Link to="/">Kiakia Food</Link>
+      </h2>
+    </div>
+    <nav>
+      <ul>
+        <li>
+          <Link to="/login">Log In</Link>
+        </li>
+        <li>
+          <Link to="/signup">Sign Up</Link>
+        </li>
+      </ul>
+    </nav>
+  </header>
+);
+
+export default Nav;

src/components/NotFoundPage.jsx

@@ -1,5 +1,12 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
-const NotFoundPage = () => <div>Four-oh-Four</div>;
+const NotFoundPage = () => (
+  <div>
+    Four-oh-Four
+    <br />
+    <Link to="/">Go Home</Link>
+  </div>
+);
 
 export default NotFoundPage;

src/components/SignupPage.jsx

@@ -1,5 +1,12 @@
 import React from 'react';
+import { Link } from 'react-router-dom';
 
-const SignupPage = () => <div>This is the signup page</div>;
+const SignupPage = () => (
+  <div>
+    This is the signup page
+    <br />
+    <Link to="/">Go Home</Link>
+  </div>
+);
 
 export default SignupPage;