Getting the skeleton of the api connections in

README.md

@@ -10,7 +10,7 @@ Returns
 { "status": "healthy" }
 ```
 
-`GET` `/vacation/api/status`
+`GET` `/vacation/api/availability`
 Returns
 ```json
 {
@@ -30,7 +30,7 @@ Returns
 }
 ```
 
-`POST` `/vacation/api/status`
+`POST` `/vacation/api/availability`
 Accepts
 ```json
 {

client/src/App.js

@@ -1,24 +1,12 @@
 import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+import { getHealth, getAvailability, setAvailability } from './api';
 
 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>
+      <button onClick={() => getHealth().then(console.log)}>Get Status</button>
+      <button onClick={() => getAvailability().then(console.log)}>Get Avail</button>
+      <button onClick={() => setAvailability({})}>Set Avail</button>
     </div>
   );
 }

client/src/api.js

@@ -0,0 +1,36 @@
+const BASE_URL = "http://localhost:5000"
+
+export const getHealth = async () => {
+  const res = await fetch(BASE_URL + "/");
+  if (!res.ok) {
+    throw new Error(res.statusText);
+  }
+
+  const { status } = await res.json();
+  return status;
+}
+
+export const getAvailability = async () => {
+  const res = await fetch(BASE_URL + "/availability");
+  if (!res.ok) {
+    throw new Error(res.statusText);
+  }
+
+  return await res.json();
+}
+
+export const setAvailability = async (availability) => {
+  const res = await fetch(
+    BASE_URL + "/availability", 
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(availability),
+    }
+  );
+  if (!res.ok) {
+    throw new Error(res.statusText);
+  }
+}

server/.gitignore

@@ -1,3 +1,5 @@
 .venv/
 *.pyc
-__pycache__/
+__pycache__/
+
+*.db

server/app.py

@@ -1,19 +1,26 @@
+#!/usr/bin/env python3
+
 import json
 import atexit
 import datetime
 
 from flask import Flask, jsonify, request
+from flask_cors import CORS
 
 DB_FILE = "vacation.db"
 
 last_update = datetime.datetime.now()
 
 app = Flask(__name__)
+CORS(app)
 app.config["APPLICATION_ROOT"] = "/vacation/api"
 app.url_map.strict_slashes = False
 
-with open(DB_FILE) as infile:
-    db = json.load(infile)
+try:
+    with open(DB_FILE) as infile:
+        db = json.load(infile)
+except FileNotFoundError:
+    db = {}
 
 
 @atexit.register
@@ -31,11 +38,13 @@ def health():
     return jsonify({"status": "healthy"})
 
 
-@app.route("/status", methods=["GET", "POST"])
+@app.route("/availability", methods=["GET", "POST"])
 def status():
+    global last_update
+
     if request.method == "GET":
         return jsonify({
-            "lastUpdated": last_update.iso_format(),
+            "lastUpdated": last_update.isoformat(),
             "availability": [
                 {
                     "name": name,
@@ -52,4 +61,8 @@ def status():
 
     # TODO actually implement updates
     
-    return 204, ""
+    return "", 204
+
+
+if __name__ == "__main__":
+    app.run("0.0.0.0", 5000, debug=True)