diff --git a/documentation/build/.doctrees/app.doctree b/documentation/build/.doctrees/app.doctree
new file mode 100644
index 00000000..84732ab4
Binary files /dev/null and b/documentation/build/.doctrees/app.doctree differ
diff --git a/documentation/build/.doctrees/environment.pickle b/documentation/build/.doctrees/environment.pickle
index d3040a00..16ba3696 100644
Binary files a/documentation/build/.doctrees/environment.pickle and b/documentation/build/.doctrees/environment.pickle differ
diff --git a/documentation/build/.doctrees/index.doctree b/documentation/build/.doctrees/index.doctree
index eccab88f..766ddff6 100644
Binary files a/documentation/build/.doctrees/index.doctree and b/documentation/build/.doctrees/index.doctree differ
diff --git a/documentation/build/_images/react_app_example.png b/documentation/build/_images/react_app_example.png
new file mode 100644
index 00000000..5c16aa07
Binary files /dev/null and b/documentation/build/_images/react_app_example.png differ
diff --git a/documentation/build/_sources/app.rst.txt b/documentation/build/_sources/app.rst.txt
new file mode 100644
index 00000000..8126d6c8
--- /dev/null
+++ b/documentation/build/_sources/app.rst.txt
@@ -0,0 +1,28 @@
+=========
+React App
+=========
+
+In order to use the scraped data a *react app* was developed. 
+The main thing this app does is show a map, with icons for each house, while also showing the distance and travel time:
+
+.. figure:: react_app_example.png
+
+
+Usage
+=====
+Copy the generated *out.json* file that was generated in the *usse scrape* project to ``src/locations.json``, next you can run the app:
+
+.. code-block:: bash
+
+    npm run start
+
+This should start a server running the app.
+
+Docker
+======
+A dockerfile was created in order to serve the application on ``Wintergreen``. 
+To use the dockerfile you can simply use the bash script: ``use_docker.sh`` and run it to run the docker container:
+
+.. code-block:: bash
+
+    ./use_docker.sh 
\ No newline at end of file
diff --git a/documentation/build/_sources/index.rst.txt b/documentation/build/_sources/index.rst.txt
index 7b112e32..e8f93382 100644
--- a/documentation/build/_sources/index.rst.txt
+++ b/documentation/build/_sources/index.rst.txt
@@ -21,6 +21,12 @@ Project Usse
    osm.rst
 
 
+.. toctree:: 
+   :maxdepth: 2
+   :caption: App:
+
+   app.rst
+
 .. toctree:: 
    :maxdepth: 2
    :caption: Hypotheek:
diff --git a/documentation/build/app.html b/documentation/build/app.html
new file mode 100644
index 00000000..6e93ab7c
--- /dev/null
+++ b/documentation/build/app.html
@@ -0,0 +1,138 @@
+<!DOCTYPE html>
+<html class="writer-html5" lang="en" >
+<head>
+  <meta charset="utf-8" /><meta name="generator" content="Docutils 0.18.1: http://docutils.sourceforge.net/" />
+
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>React App &mdash; Usse 1 documentation</title>
+      <link rel="stylesheet" href="_static/pygments.css" type="text/css" />
+      <link rel="stylesheet" href="_static/css/theme.css" type="text/css" />
+  <!--[if lt IE 9]>
+    <script src="_static/js/html5shiv.min.js"></script>
+  <![endif]-->
+  
+        <script data-url_root="./" id="documentation_options" src="_static/documentation_options.js"></script>
+        <script src="_static/doctools.js"></script>
+        <script src="_static/sphinx_highlight.js"></script>
+    <script src="_static/js/theme.js"></script>
+    <link rel="index" title="Index" href="genindex.html" />
+    <link rel="search" title="Search" href="search.html" />
+    <link rel="next" title="Hypotheek" href="hypotheek.html" />
+    <link rel="prev" title="Open Street Maps" href="osm.html" /> 
+</head>
+
+<body class="wy-body-for-nav"> 
+  <div class="wy-grid-for-nav">
+    <nav data-toggle="wy-nav-shift" class="wy-nav-side">
+      <div class="wy-side-scroll">
+        <div class="wy-side-nav-search" >
+            <a href="index.html" class="icon icon-home"> Usse
+          </a>
+<div role="search">
+  <form id="rtd-search-form" class="wy-form" action="search.html" method="get">
+    <input type="text" name="q" placeholder="Search docs" />
+    <input type="hidden" name="check_keywords" value="yes" />
+    <input type="hidden" name="area" value="default" />
+  </form>
+</div>
+        </div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
+              <p class="caption" role="heading"><span class="caption-text">Scraping:</span></p>
+<ul>
+<li class="toctree-l1"><a class="reference internal" href="funda.html">Scraping Funda</a></li>
+<li class="toctree-l1"><a class="reference internal" href="googlemaps.html">Google Maps API</a></li>
+<li class="toctree-l1"><a class="reference internal" href="osm.html">Open Street Maps</a></li>
+</ul>
+<p class="caption" role="heading"><span class="caption-text">App:</span></p>
+<ul class="current">
+<li class="toctree-l1 current"><a class="current reference internal" href="#">React App</a><ul>
+<li class="toctree-l2"><a class="reference internal" href="#usage">Usage</a></li>
+<li class="toctree-l2"><a class="reference internal" href="#docker">Docker</a></li>
+</ul>
+</li>
+</ul>
+<p class="caption" role="heading"><span class="caption-text">Hypotheek:</span></p>
+<ul>
+<li class="toctree-l1"><a class="reference internal" href="hypotheek.html">Hypotheek</a></li>
+</ul>
+
+        </div>
+      </div>
+    </nav>
+
+    <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
+          <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
+          <a href="index.html">Usse</a>
+      </nav>
+
+      <div class="wy-nav-content">
+        <div class="rst-content">
+          <div role="navigation" aria-label="Page navigation">
+  <ul class="wy-breadcrumbs">
+      <li><a href="index.html" class="icon icon-home"></a></li>
+      <li class="breadcrumb-item active">React App</li>
+      <li class="wy-breadcrumbs-aside">
+            <a href="_sources/app.rst.txt" rel="nofollow"> View page source</a>
+      </li>
+  </ul>
+  <hr/>
+</div>
+          <div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
+           <div itemprop="articleBody">
+             
+  <section id="react-app">
+<h1>React App<a class="headerlink" href="#react-app" title="Permalink to this heading"></a></h1>
+<p>In order to use the scraped data a <em>react app</em> was developed.
+The main thing this app does is show a map, with icons for each house, while also showing the distance and travel time:</p>
+<figure class="align-default">
+<img alt="_images/react_app_example.png" src="_images/react_app_example.png" />
+</figure>
+<section id="usage">
+<h2>Usage<a class="headerlink" href="#usage" title="Permalink to this heading"></a></h2>
+<p>Copy the generated <em>out.json</em> file that was generated in the <em>usse scrape</em> project to <code class="docutils literal notranslate"><span class="pre">src/locations.json</span></code>, next you can run the app:</p>
+<div class="highlight-bash notranslate"><div class="highlight"><pre><span></span>npm run start
+</pre></div>
+</div>
+<p>This should start a server running the app.</p>
+</section>
+<section id="docker">
+<h2>Docker<a class="headerlink" href="#docker" title="Permalink to this heading"></a></h2>
+<p>A dockerfile was created in order to serve the application on <code class="docutils literal notranslate"><span class="pre">Wintergreen</span></code>.
+To use the dockerfile you can simply use the bash script: <code class="docutils literal notranslate"><span class="pre">use_docker.sh</span></code> and run it to run the docker container:</p>
+<div class="highlight-bash notranslate"><div class="highlight"><pre><span></span>./use_docker.sh
+</pre></div>
+</div>
+</section>
+</section>
+
+
+           </div>
+          </div>
+          <footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
+        <a href="osm.html" class="btn btn-neutral float-left" title="Open Street Maps" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
+        <a href="hypotheek.html" class="btn btn-neutral float-right" title="Hypotheek" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
+    </div>
+
+  <hr/>
+
+  <div role="contentinfo">
+    <p>&#169; Copyright 2023, Eljakim.</p>
+  </div>
+
+  Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
+    <a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
+    provided by <a href="https://readthedocs.org">Read the Docs</a>.
+   
+
+</footer>
+        </div>
+      </div>
+    </section>
+  </div>
+  <script>
+      jQuery(function () {
+          SphinxRtdTheme.Navigation.enable(true);
+      });
+  </script> 
+
+</body>
+</html>
\ No newline at end of file
diff --git a/documentation/build/genindex.html b/documentation/build/genindex.html
index b93e8a05..31d85407 100644
--- a/documentation/build/genindex.html
+++ b/documentation/build/genindex.html
@@ -39,6 +39,10 @@
 <li class="toctree-l1"><a class="reference internal" href="googlemaps.html">Google Maps API</a></li>
 <li class="toctree-l1"><a class="reference internal" href="osm.html">Open Street Maps</a></li>
 </ul>
+<p class="caption" role="heading"><span class="caption-text">App:</span></p>
+<ul>
+<li class="toctree-l1"><a class="reference internal" href="app.html">React App</a></li>
+</ul>
 <p class="caption" role="heading"><span class="caption-text">Hypotheek:</span></p>
 <ul>
 <li class="toctree-l1"><a class="reference internal" href="hypotheek.html">Hypotheek</a></li>
diff --git a/documentation/build/index.html b/documentation/build/index.html
index a400df76..9f2b3120 100644
--- a/documentation/build/index.html
+++ b/documentation/build/index.html
@@ -41,6 +41,10 @@
 <li class="toctree-l1"><a class="reference internal" href="googlemaps.html">Google Maps API</a></li>
 <li class="toctree-l1"><a class="reference internal" href="osm.html">Open Street Maps</a></li>
 </ul>
+<p class="caption" role="heading"><span class="caption-text">App:</span></p>
+<ul>
+<li class="toctree-l1"><a class="reference internal" href="app.html">React App</a></li>
+</ul>
 <p class="caption" role="heading"><span class="caption-text">Hypotheek:</span></p>
 <ul>
 <li class="toctree-l1"><a class="reference internal" href="hypotheek.html">Hypotheek</a></li>
@@ -96,6 +100,16 @@
 </ul>
 </div>
 <div class="toctree-wrapper compound">
+<p class="caption" role="heading"><span class="caption-text">App:</span></p>
+<ul>
+<li class="toctree-l1"><a class="reference internal" href="app.html">React App</a><ul>
+<li class="toctree-l2"><a class="reference internal" href="app.html#usage">Usage</a></li>
+<li class="toctree-l2"><a class="reference internal" href="app.html#docker">Docker</a></li>
+</ul>
+</li>
+</ul>
+</div>
+<div class="toctree-wrapper compound">
 <p class="caption" role="heading"><span class="caption-text">Hypotheek:</span></p>
 <ul>
 <li class="toctree-l1"><a class="reference internal" href="hypotheek.html">Hypotheek</a><ul>
diff --git a/documentation/build/objects.inv b/documentation/build/objects.inv
index 7d1d7cf3..2684f790 100644
Binary files a/documentation/build/objects.inv and b/documentation/build/objects.inv differ
diff --git a/documentation/build/search.html b/documentation/build/search.html
index 264fee25..231920c9 100644
--- a/documentation/build/search.html
+++ b/documentation/build/search.html
@@ -42,6 +42,10 @@
 <li class="toctree-l1"><a class="reference internal" href="googlemaps.html">Google Maps API</a></li>
 <li class="toctree-l1"><a class="reference internal" href="osm.html">Open Street Maps</a></li>
 </ul>
+<p class="caption" role="heading"><span class="caption-text">App:</span></p>
+<ul>
+<li class="toctree-l1"><a class="reference internal" href="app.html">React App</a></li>
+</ul>
 <p class="caption" role="heading"><span class="caption-text">Hypotheek:</span></p>
 <ul>
 <li class="toctree-l1"><a class="reference internal" href="hypotheek.html">Hypotheek</a></li>
diff --git a/documentation/build/searchindex.js b/documentation/build/searchindex.js
index d0045e88..b3b05b91 100644
--- a/documentation/build/searchindex.js
+++ b/documentation/build/searchindex.js
@@ -1 +1 @@
-Search.setIndex({"docnames": ["funda", "googlemaps", "hypotheek", "index", "osm"], "filenames": ["funda.rst", "googlemaps.rst", "hypotheek.rst", "index.rst", "osm.rst"], "titles": ["Scraping Funda", "Google Maps API", "Hypotheek", "Project Usse", "Open Street Maps"], "terms": {"i": [0, 1, 3, 4], "real": [0, 3], "estat": [0, 3], "hous": [0, 1, 3], "market": 0, "tri": 0, "keep": 0, "track": 0, "all": [0, 4], "ar": [0, 1, 4], "current": [0, 3], "sale": 0, "allow": [0, 1, 4], "github": 0, "sever": [0, 1, 3, 4], "project": [0, 1, 4], "still": 0, "try": 0, "do": [0, 1, 4], "thi": [0, 1, 3, 4], "A": 0, "quick": [0, 1], "test": [0, 1], "from": [0, 1, 4], "land": 0, "u": 0, "work": [0, 1], "veri": [0, 4], "limit": 0, "filter": [0, 3], "method": [0, 1], "few": [0, 1], "patch": 0, "code": [0, 4], "inject": 0, "url": 0, "us": [0, 3, 4], "other": 0, "appli": 0, "next": [0, 3], "we": [0, 1, 3, 4], "can": [0, 1, 4], "setup": 0, "basic": 0, "browser": 0, "copi": 0, "order": [0, 1, 4], "self": [0, 4], "http": [0, 4], "www": [0, 4], "nl": [0, 4], "koop": 0, "gemeent": 0, "huizen": 0, "0": [0, 1, 4], "350000": 0, "tuin": 0, "10km": 0, "return": 0, "close": 0, "f": 0, "base_url": 0, "verkocht": 0, "open": [0, 3], "def": [0, 1], "get_funda_data": 0, "scraper": 0, "fundascrap": 0, "nijkerk": 0, "beschikbaar": 0, "100000": 0, "400000": 0, "woonhui": 0, "eengezinswon": 0, "landhui": 0, "30km": 0, "find_past": 0, "fals": 0, "n_page": 0, "81": 0, "df": 0, "run": [0, 4], "ha": 1, "free": [1, 4], "calcul": [1, 4], "distanc": [1, 3, 4], "matrix": 1, "well": 1, "show": 1, "point": 1, "In": [1, 4], "you": [1, 4], "need": [1, 4], "request": [1, 4], "an": 1, "kei": 1, "cloud": 1, "consol": 1, "cost": 1, "each": 1, "give": 1, "200": 1, "dollar": 1, "worth": 1, "start": [1, 4], "everi": 1, "month": 1, "For": [1, 4], "see": [1, 4], "wa": [1, 4], "possibl": 1, "geoloc": [1, 4], "simpl": 1, "python": 1, "script": 1, "origin_loc": 1, "nfi_loc": 1, "52": 1, "044867266861466": 1, "4": [1, 4], "3585175985355225": 1, "hoogstraat_loc": 1, "08725689123654": 1, "5": 1, "147180442716177": 1, "bakkersdijk_loc": 1, "51": 1, "85802695253161": 1, "482033956202426": 1, "korhoen_loc": 1, "5219455005375": 1, "732514040876346": 1, "harde_loc": 1, "41650138296019": 1, "870995170999243": 1, "get_dist": 1, "out_dict": 1, "destination_loc": 1, "gmap": 1, "distance_matrix": 1, "mode": 1, "drive": 1, "row": 1, "element": 1, "about": [1, 4], "40": [1, 2], "000": 1, "With": 1, "1200": 1, "6": [1, 4], "per": 1, "would": 1, "mean": 1, "up": [1, 4], "7000": 1, "That": 1, "enough": 1, "build": 1, "poc": 1, "lot": 1, "shown": [1, 4], "marker": 1, "anoth": 1, "result": [1, 4], "action": 1, "The": [1, 3, 4], "reason": 1, "did": 1, "read": 1, "term": 1, "40k": 1, "just": 1, "thousand": 1, "minut": 1, "oop": 1, "becaus": 1, "want": [1, 4], "more": [1, 4], "than": 1, "dont": 1, "pai": 1, "switch": 1, "o": [1, 4], "pen": [1, 4], "": [1, 4], "treet": 1, "m": [1, 4], "ap": 1, "osm": [1, 4], "state": 3, "frozen": 3, "until": 3, "least": 3, "june": 3, "scrape": [], "funda": 3, "googl": [3, 4], "map": 3, "api": 3, "ban": 3, "street": 3, "osrm": 3, "nominatim": 3, "ip": 3, "firewal": 3, "tile": 3, "server": 3, "automat": 3, "websit": [3, 4], "some": 3, "specif": [3, 4], "garden": 3, "non": 3, "apart": 3, "must": 3, "abl": 3, "view": 3, "them": 3, "base": 3, "locat": 3, "nfi": 3, "hooghstraat": 3, "etc": [2, 3], "much": 4, "like": 4, "openstreetmap": 4, "navig": 4, "world": 4, "main": 4, "differ": 4, "being": 4, "host": 4, "howev": 4, "plug": 4, "plai": 4, "solut": 4, "your": 4, "own": 4, "It": 4, "turn": 4, "out": 4, "includ": 4, "quit": 4, "big": 4, "task": 4, "especi": 4, "suppor": 4, "whole": 4, "ourc": 4, "r": 4, "achin": 4, "here": 4, "set": 4, "straightforward": 4, "requir": 4, "same": 4, "docker": 4, "contain": 4, "time": 4, "short": 4, "command": 4, "netherland": 4, "follow": 4, "download": 4, "mkdir": 4, "p": 4, "data": 4, "cd": 4, "wget": 4, "geofabrik": 4, "de": 4, "europ": 4, "latest": 4, "pbf": 4, "name": 4, "backend": 4, "t": 4, "v": 4, "pwd": 4, "extract": 4, "opt": 4, "car": 4, "lua": 4, "process": 4, "contract": 4, "partit": 4, "custom": 4, "finali": 4, "rout": 4, "engin": 4, "5998": 4, "5000": 4, "algorithm": 4, "mld": 4, "now": 4, "curl": 4, "port": 4, "when": 4, "coordin": 4, "send": 4, "make": 4, "sure": 4, "longitud": 4, "latitud": 4, "swap": 4, "As": 4, "good": 4, "To": 4, "solv": 4, "resolv": 4, "postal": 4, "cat": 4, "run_nominatim": 4, "sh": 4, "bin": 4, "bash": 4, "e": [2, 4], "pbf_path": 4, "replication_url": 4, "updat": 4, "5999": 4, "8080": 4, "mediagi": 4, "2": [2, 4], "access": 4, "which": 4, "queri": 4, "proces": 4, "hard": 4, "prevent": 4, "bot": 4, "misus": 4, "interfac": 4, "rule": 4, "ad": 4, "onli": 4, "incom": 4, "traffic": 4, "address": 4, "sudo": 4, "ufw": 4, "ip_addr": 4, "ani": 4, "also": 4, "serv": 4, "fulli": 4, "independ": 4, "tileserv": 4, "previous": 4, "donwload": 4, "file": 4, "import": 4, "postgresql": 4, "databas": 4, "hopefulli": 4, "speed": 4, "perform": 4, "first": 4, "var": 4, "lib": 4, "12": 4, "overv": 4, "1": 4, "3": 4, "10": 4, "5997": 4, "80": [2, 4], "d": [2, 4], "herreweb": 4, "png": 4, "step": 4, "took": 4, "over": 4, "hour": 4, "core": 4, "slow": 4, "intel": 4, "xeon": 4, "e5": 4, "2620": 4, "v2": 4, "fast": 4, "either": 4, "faster": 4, "after": 4, "load": 4, "maandlasten": 3, "wat": 2, "prij": 2, "opmerk": 2, "water": 2, "ga": 2, "licht": 2, "boodschappen": 2, "450": 2, "vervoer": 3, "60": 2, "verzek": 2, "350": [], "benzin": 2, "53": 2, "wegenbelast": 2, "500": 2, "jaar": 2, "onderhoud": 2, "voor": 2, "nieuw": 2, "totaal": 2, "463": [], "mazda": 2, "auto": [], "merced": 2, "250": 2, "300": 2, "413": 2, "363": 2, "2x": 2, "170": 2, "x": 2, "325": [], "abonnementen": 2, "goed": 2, "doelen": 2, "8": 2, "17": 2, "50": 2, "internet": 2, "hobbi": 2, "muziek": 2, "comput": 2, "20": 2, "contabo": 2, "150": 2, "maar": 2, "gaat": 2, "weg": 2, "todo": 2, "zorgerzek": 2, "130": 2, "uit": 2, "en": 2, "leuk": 2, "dingen": 2, "verjaardagen": 2, "30": [], "leven": 2, "klede": 2, "glazen": 2, "125": 2, "levensverzek": 2, "gemeentelijk": 2, "kosten": 2}, "objects": {}, "objtypes": {}, "objnames": {}, "titleterms": {"scrape": [0, 3], "funda": 0, "googl": 1, "map": [1, 4], "api": 1, "us": 1, "ban": 1, "project": 3, "uss": 3, "content": [], "goal": 3, "open": 4, "street": 4, "osrm": 4, "setup": 4, "nominatim": 4, "ip": 4, "firewal": 4, "tile": 4, "server": 4, "hypotheek": [2, 3], "maandlasten": 2, "vervoer": 2, "auto": [], "merced": []}, "envversion": {"sphinx.domains.c": 2, "sphinx.domains.changeset": 1, "sphinx.domains.citation": 1, "sphinx.domains.cpp": 8, "sphinx.domains.index": 1, "sphinx.domains.javascript": 2, "sphinx.domains.math": 2, "sphinx.domains.python": 3, "sphinx.domains.rst": 2, "sphinx.domains.std": 2, "sphinx": 57}, "alltitles": {"Scraping Funda": [[0, "scraping-funda"]], "Google Maps API": [[1, "google-maps-api"]], "Using the Google API": [[1, "using-the-google-api"]], "Google Ban": [[1, "google-ban"]], "Open Street Maps": [[4, "open-street-maps"]], "OSRM": [[4, "osrm"]], "Setup": [[4, "setup"]], "Nominatim": [[4, "nominatim"]], "IP Firewall": [[4, "ip-firewall"]], "Tile Server": [[4, "tile-server"]], "Project Usse": [[3, "project-usse"]], "Scraping:": [[3, null]], "Hypotheek:": [[3, null]], "Goal": [[3, "goal"]], "Hypotheek": [[2, "hypotheek"]], "Maandlasten": [[2, "maandlasten"]], "Vervoer": [[2, "vervoer"]]}, "indexentries": {}})
\ No newline at end of file
+Search.setIndex({"docnames": ["app", "funda", "googlemaps", "hypotheek", "index", "osm"], "filenames": ["app.rst", "funda.rst", "googlemaps.rst", "hypotheek.rst", "index.rst", "osm.rst"], "titles": ["React App", "Scraping Funda", "Google Maps API", "Hypotheek", "Project Usse", "Open Street Maps"], "terms": {"i": [0, 1, 2, 4, 5], "real": [1, 4], "estat": [1, 4], "hous": [0, 1, 2, 4], "market": 1, "tri": 1, "keep": 1, "track": 1, "all": [1, 5], "ar": [1, 2, 5], "current": [1, 4], "sale": 1, "allow": [1, 2, 5], "github": 1, "sever": [1, 2, 4, 5], "project": [0, 1, 2, 5], "still": 1, "try": 1, "do": [1, 2, 5], "thi": [0, 1, 2, 4, 5], "A": [0, 1], "quick": [1, 2], "test": [1, 2], "from": [1, 2, 5], "land": 1, "u": 1, "work": [1, 2], "veri": [1, 5], "limit": 1, "filter": [1, 4], "method": [1, 2], "few": [1, 2], "patch": 1, "code": [1, 5], "inject": 1, "url": 1, "us": [0, 1, 4, 5], "other": 1, "appli": 1, "next": [0, 1, 4], "we": [1, 2, 4, 5], "can": [0, 1, 2, 5], "setup": 1, "basic": 1, "browser": 1, "copi": [0, 1], "order": [0, 1, 2, 5], "self": [1, 5], "http": [1, 5], "www": [1, 5], "nl": [1, 5], "koop": 1, "gemeent": 1, "huizen": 1, "0": [1, 2, 5], "350000": 1, "tuin": 1, "10km": 1, "return": 1, "close": 1, "f": 1, "base_url": 1, "verkocht": 1, "open": [1, 4], "def": [1, 2], "get_funda_data": 1, "scraper": 1, "fundascrap": 1, "nijkerk": 1, "beschikbaar": 1, "100000": 1, "400000": 1, "woonhui": 1, "eengezinswon": 1, "landhui": 1, "30km": 1, "find_past": 1, "fals": 1, "n_page": 1, "81": 1, "df": 1, "run": [0, 1, 5], "ha": 2, "free": [2, 5], "calcul": [2, 5], "distanc": [0, 2, 4, 5], "matrix": 2, "well": 2, "show": [0, 2], "point": 2, "In": [0, 2, 5], "you": [0, 2, 5], "need": [2, 5], "request": [2, 5], "an": 2, "kei": 2, "cloud": 2, "consol": 2, "cost": 2, "each": [0, 2], "give": 2, "200": 2, "dollar": 2, "worth": 2, "start": [0, 2, 5], "everi": 2, "month": 2, "For": [2, 5], "see": [2, 5], "wa": [0, 2, 5], "possibl": 2, "geoloc": [2, 5], "simpl": 2, "python": 2, "script": [0, 2], "origin_loc": 2, "nfi_loc": 2, "52": 2, "044867266861466": 2, "4": [2, 5], "3585175985355225": 2, "hoogstraat_loc": 2, "08725689123654": 2, "5": 2, "147180442716177": 2, "bakkersdijk_loc": 2, "51": 2, "85802695253161": 2, "482033956202426": 2, "korhoen_loc": 2, "5219455005375": 2, "732514040876346": 2, "harde_loc": 2, "41650138296019": 2, "870995170999243": 2, "get_dist": 2, "out_dict": 2, "destination_loc": 2, "gmap": 2, "distance_matrix": 2, "mode": 2, "drive": 2, "row": 2, "element": 2, "about": [2, 5], "40": [2, 3], "000": 2, "With": 2, "1200": 2, "6": [2, 5], "per": 2, "would": 2, "mean": 2, "up": [2, 5], "7000": 2, "That": 2, "enough": 2, "build": 2, "poc": 2, "lot": 2, "shown": [2, 5], "marker": 2, "anoth": 2, "result": [2, 5], "action": 2, "The": [0, 2, 4, 5], "reason": 2, "did": 2, "read": 2, "term": 2, "40k": 2, "just": 2, "thousand": 2, "minut": 2, "oop": 2, "becaus": 2, "want": [2, 5], "more": [2, 5], "than": 2, "dont": 2, "pai": 2, "switch": 2, "o": [2, 5], "pen": [2, 5], "": [2, 5], "treet": 2, "m": [2, 5], "ap": 2, "osm": [2, 5], "state": 4, "frozen": 4, "until": 4, "least": 4, "june": 4, "scrape": 0, "funda": 4, "googl": [4, 5], "map": [0, 4], "api": 4, "ban": 4, "street": 4, "osrm": 4, "nominatim": 4, "ip": 4, "firewal": 4, "tile": 4, "server": [0, 4], "automat": 4, "websit": [4, 5], "some": 4, "specif": [4, 5], "garden": 4, "non": 4, "apart": 4, "must": 4, "abl": 4, "view": 4, "them": 4, "base": 4, "locat": [0, 4], "nfi": 4, "hooghstraat": 4, "etc": [3, 4], "much": 5, "like": 5, "openstreetmap": 5, "navig": 5, "world": 5, "main": [0, 5], "differ": 5, "being": 5, "host": 5, "howev": 5, "plug": 5, "plai": 5, "solut": 5, "your": 5, "own": 5, "It": 5, "turn": 5, "out": [0, 5], "includ": 5, "quit": 5, "big": 5, "task": 5, "especi": 5, "suppor": 5, "whole": 5, "ourc": 5, "r": 5, "achin": 5, "here": 5, "set": 5, "straightforward": 5, "requir": 5, "same": 5, "docker": [4, 5], "contain": [0, 5], "time": [0, 5], "short": 5, "command": 5, "netherland": 5, "follow": 5, "download": 5, "mkdir": 5, "p": 5, "data": [0, 5], "cd": 5, "wget": 5, "geofabrik": 5, "de": 5, "europ": 5, "latest": 5, "pbf": 5, "name": 5, "backend": 5, "t": 5, "v": 5, "pwd": 5, "extract": 5, "opt": 5, "car": 5, "lua": 5, "process": 5, "contract": 5, "partit": 5, "custom": 5, "finali": 5, "rout": 5, "engin": 5, "5998": 5, "5000": 5, "algorithm": 5, "mld": 5, "now": 5, "curl": 5, "port": 5, "when": 5, "coordin": 5, "send": 5, "make": 5, "sure": 5, "longitud": 5, "latitud": 5, "swap": 5, "As": 5, "good": 5, "To": [0, 5], "solv": 5, "resolv": 5, "postal": 5, "cat": 5, "run_nominatim": 5, "sh": [0, 5], "bin": 5, "bash": [0, 5], "e": [3, 5], "pbf_path": 5, "replication_url": 5, "updat": 5, "5999": 5, "8080": 5, "mediagi": 5, "2": [3, 5], "access": 5, "which": 5, "queri": 5, "proces": 5, "hard": 5, "prevent": 5, "bot": 5, "misus": 5, "interfac": 5, "rule": 5, "ad": 5, "onli": 5, "incom": 5, "traffic": 5, "address": 5, "sudo": 5, "ufw": 5, "ip_addr": 5, "ani": 5, "also": [0, 5], "serv": [0, 5], "fulli": 5, "independ": 5, "tileserv": 5, "previous": 5, "donwload": 5, "file": [0, 5], "import": 5, "postgresql": 5, "databas": 5, "hopefulli": 5, "speed": 5, "perform": 5, "first": 5, "var": 5, "lib": 5, "12": 5, "overv": 5, "1": 5, "3": 5, "10": 5, "5997": 5, "80": [3, 5], "d": [3, 5], "herreweb": 5, "png": 5, "step": 5, "took": 5, "over": 5, "hour": 5, "core": 5, "slow": 5, "intel": 5, "xeon": 5, "e5": 5, "2620": 5, "v2": 5, "fast": 5, "either": 5, "faster": 5, "after": 5, "load": 5, "maandlasten": 4, "wat": 3, "prij": 3, "opmerk": 3, "water": 3, "ga": 3, "licht": 3, "boodschappen": 3, "450": 3, "vervoer": 4, "60": 3, "verzek": 3, "350": [], "benzin": 3, "53": 3, "wegenbelast": 3, "500": 3, "jaar": 3, "onderhoud": 3, "voor": 3, "nieuw": 3, "totaal": 3, "463": [], "mazda": 3, "auto": [], "merced": 3, "250": 3, "300": 3, "413": 3, "363": 3, "2x": 3, "170": 3, "x": 3, "325": [], "abonnementen": 3, "goed": 3, "doelen": 3, "8": 3, "17": 3, "50": 3, "internet": 3, "hobbi": 3, "muziek": 3, "comput": 3, "20": 3, "contabo": 3, "150": 3, "maar": 3, "gaat": 3, "weg": 3, "todo": 3, "zorgerzek": 3, "130": 3, "uit": 3, "en": 3, "leuk": 3, "dingen": 3, "verjaardagen": 3, "30": [], "leven": 3, "klede": 3, "glazen": 3, "125": 3, "levensverzek": 3, "gemeentelijk": 3, "kosten": 3, "react": 4, "app": [], "develop": 0, "thing": 0, "doe": 0, "icon": 0, "where": [], "while": 0, "travel": 0, "dockerfil": 0, "creat": 0, "applic": 0, "wintergreen": 0, "simpli": 0, "use_dock": 0, "gener": 0, "usag": 4, "json": 0, "uss": 0, "src": 0, "npm": 0, "should": 0}, "objects": {}, "objtypes": {}, "objnames": {}, "titleterms": {"scrape": [1, 4], "funda": 1, "googl": 2, "map": [2, 5], "api": 2, "us": 2, "ban": 2, "project": 4, "uss": 4, "content": [], "goal": 4, "open": 5, "street": 5, "osrm": 5, "setup": 5, "nominatim": 5, "ip": 5, "firewal": 5, "tile": 5, "server": 5, "hypotheek": [3, 4], "maandlasten": 3, "vervoer": 3, "auto": [], "merced": [], "react": 0, "app": [0, 4], "docker": 0, "usag": 0}, "envversion": {"sphinx.domains.c": 2, "sphinx.domains.changeset": 1, "sphinx.domains.citation": 1, "sphinx.domains.cpp": 8, "sphinx.domains.index": 1, "sphinx.domains.javascript": 2, "sphinx.domains.math": 2, "sphinx.domains.python": 3, "sphinx.domains.rst": 2, "sphinx.domains.std": 2, "sphinx": 57}, "alltitles": {"Scraping Funda": [[1, "scraping-funda"]], "Google Maps API": [[2, "google-maps-api"]], "Using the Google API": [[2, "using-the-google-api"]], "Google Ban": [[2, "google-ban"]], "Open Street Maps": [[5, "open-street-maps"]], "OSRM": [[5, "osrm"]], "Setup": [[5, "setup"]], "Nominatim": [[5, "nominatim"]], "IP Firewall": [[5, "ip-firewall"]], "Tile Server": [[5, "tile-server"]], "Hypotheek": [[3, "hypotheek"]], "Maandlasten": [[3, "maandlasten"]], "Vervoer": [[3, "vervoer"]], "Project Usse": [[4, "project-usse"]], "Scraping:": [[4, null]], "App:": [[4, null]], "Hypotheek:": [[4, null]], "Goal": [[4, "goal"]], "React App": [[0, "react-app"]], "Usage": [[0, "usage"]], "Docker": [[0, "docker"]]}, "indexentries": {}})
\ No newline at end of file
diff --git a/documentation/source/app.rst b/documentation/source/app.rst
new file mode 100644
index 00000000..8126d6c8
--- /dev/null
+++ b/documentation/source/app.rst
@@ -0,0 +1,28 @@
+=========
+React App
+=========
+
+In order to use the scraped data a *react app* was developed. 
+The main thing this app does is show a map, with icons for each house, while also showing the distance and travel time:
+
+.. figure:: react_app_example.png
+
+
+Usage
+=====
+Copy the generated *out.json* file that was generated in the *usse scrape* project to ``src/locations.json``, next you can run the app:
+
+.. code-block:: bash
+
+    npm run start
+
+This should start a server running the app.
+
+Docker
+======
+A dockerfile was created in order to serve the application on ``Wintergreen``. 
+To use the dockerfile you can simply use the bash script: ``use_docker.sh`` and run it to run the docker container:
+
+.. code-block:: bash
+
+    ./use_docker.sh 
\ No newline at end of file
diff --git a/documentation/source/index.rst b/documentation/source/index.rst
index 7b112e32..e8f93382 100644
--- a/documentation/source/index.rst
+++ b/documentation/source/index.rst
@@ -21,6 +21,12 @@ Project Usse
    osm.rst
 
 
+.. toctree:: 
+   :maxdepth: 2
+   :caption: App:
+
+   app.rst
+
 .. toctree:: 
    :maxdepth: 2
    :caption: Hypotheek:
diff --git a/documentation/source/react_app_example.png b/documentation/source/react_app_example.png
new file mode 100644
index 00000000..5c16aa07
Binary files /dev/null and b/documentation/source/react_app_example.png differ
diff --git a/scrape/requirements.txt b/scrape/requirements.txt
index f7cb9a64..42ba9fe6 100644
--- a/scrape/requirements.txt
+++ b/scrape/requirements.txt
@@ -9,3 +9,4 @@ setuptools~=61.3.1
 python-dateutil~=2.8.2
 geopy
 osrm-py
+lxml
