Welcome to Inshur!

.gitignore

@@ -0,0 +1,26 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# IDEs
+.idea

README.md

@@ -0,0 +1,37 @@
+# Welcome to the Inshur Coding Challenge 💻
+
+## Getting Started 🛠
+Everything you need to get setup is within this repository. If you'd prefer not to use the code provided here that is fine. However, if you do use it we ask that you do **_not_** 'Fork' this repository, and instead you clone it.
+
+### Prefer Typescript?
+We're using Typescript at Inshur, so if you can we'd love to see you using it. Switch over to our other repository [here](https://github.com/Inshur/welcome-to-inshur) if you want to show us what you've got. However, if you'd prefer to continue using Javascript that's fine.
+
+### Setup
+1. `git clone https://github.com/Inshur/welcome-to-inshur.js.git`
+1. `cd welcome-to-inshur`
+1. `yarn install`
+1. `yarn start`
+
+## Your Task 📝
+In order to get to know you we'd like you to create yourself a profile page.
+
+No profile page is complete without the following:
+- Your profile picture (can be of anything)
+- Your name
+- Your job title
+- Your favourite food
+
+## What we'd like to see being used 🕵️‍♂️
+- The API
+- Jest
+- React Hooks
+- CSS
+
+## Duration ⏰
+You may take anywhere up to 2+ hours on your profile if you wish.
+
+## Submitting your code 📬
+Once you're satisfied with your work, please push it up to a public GitHub repository and send us the link. 
+
+If you've chosen to clone this repository, use this command to replace the origin URL with a repository URL you've created:
+1. `git remote set-url origin [YOUR_REMOTE_URL]`

api/.env

@@ -0,0 +1 @@
+DEBUG=welcome-api*

api/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@inshur/welcome-api",
+  "version": "1.0.0",
+  "main": "index.js",
+  "license": "MIT",
+  "scripts": {
+    "start": "node src",
+    "start:dev": "nodemon src"
+  },
+  "dependencies": {
+    "cors": "^2.8.5",
+    "debug": "^4.1.1",
+    "dotenv": "^8.2.0",
+    "express": "^4.17.1"
+  },
+  "devDependencies": {
+    "nodemon": "^2.0.4"
+  },
+  "workspaces": {
+    "nohoist": [
+      "jest",
+      "@jest"
+    ]
+  }
+}

api/src/index.js

@@ -0,0 +1,20 @@
+require('dotenv').config();
+
+const express = require('express');
+const middleware = require('./middleware');
+const routes = require('./routes');
+
+// Setup debug logger
+const debug = require('debug')('welcome-api');
+
+// Create express App
+const app = express();
+
+// Setup routes
+app.use(middleware);
+app.use('/api', routes);
+
+// Listen
+app.listen(4000, () => {
+  debug('Listening at http://localhost:4000')
+});

api/src/middleware/index.js

@@ -0,0 +1,9 @@
+const { Router } = require('express');
+const cors = require('cors');
+
+const middleware = Router();
+
+// Setup cors
+middleware.use(cors());
+
+module.exports = middleware;

api/src/routes/home.js

@@ -0,0 +1,11 @@
+const { Router } = require('express');
+
+const home = Router();
+
+home.get('/', (request, response) => {
+  response.send({
+    success: true
+  })
+});
+
+ module.exports = home;

api/src/routes/index.js

@@ -0,0 +1,8 @@
+const { Router } = require('express');
+const home = require('./home');
+
+const routes = Router();
+
+routes.use('/', home);
+
+module.exports = routes;

package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@inshur/welcome.js",
+  "version": "0.1.0",
+  "proxy": "http://localhost:4000",
+  "private": true,
+  "workspaces": {
+    "packages": [
+      "api"
+    ]
+  },
+  "dependencies": {
+    "@testing-library/jest-dom": "^5.11.9",
+    "@testing-library/react": "^11.2.5",
+    "@testing-library/user-event": "^12.7.3",
+    "concurrently": "^6.0.0",
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1",
+    "react-scripts": "4.0.3"
+  },
+  "scripts": {
+    "start": "concurrently \"react-scripts start\" \"yarn start:api\"",
+    "start:api": "yarn --cwd api start:dev",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

public/index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>React App</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

public/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

src/App.css

@@ -0,0 +1,38 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

src/App.js

@@ -0,0 +1,26 @@
+import React from 'react';
+import logo from './logo.svg';
+import './App.css';
+
+function App() {
+  return (
+    <div className="App">
+      <header className="App-header">
+        <img src={logo} className="App-logo" alt="logo" />
+        <p>
+          Edit <code>src/App.js</code> and save to reload.
+        </p>
+        <a
+          className="App-link"
+          href="https://reactjs.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Learn React
+        </a>
+      </header>
+    </div>
+  );
+}
+
+export default App;

src/App.test.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import App from './App';
+
+test('renders learn react link', () => {
+  const { getByText } = render(<App />);
+  const linkElement = getByText(/learn react/i);
+  expect(linkElement).toBeInTheDocument();
+});

src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

src/index.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.css';
+import App from './App';
+import * as serviceWorker from './serviceWorker';
+
+ReactDOM.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>,
+  document.getElementById('root')
+);
+
+// If you want your app to work offline and load faster, you can change
+// unregister() to register() below. Note this comes with some pitfalls.
+// Learn more about service workers: https://bit.ly/CRA-PWA
+serviceWorker.unregister();