diff --git a/README.md b/README.md
deleted file mode 100644
index aa6d0bba..00000000
--- a/README.md
+++ /dev/null
@@ -1,84 +0,0 @@
-# Week 3 In-class projects
-
-## Installing `create-react-app`
-
-The `create-react-app` utility helps you create new React projects easily. It handles generating a project, setting up babel, a dev server, and testing. It is the fastest way to get started developing react apps locally.
-
-You only have to install the utility once using the following commands:
-
-```
-npm install -g npm
-npm install -g create-react-app
-```
-
-> Note: the first command is to make sure you're running the most up to date version of npm.
-
-## The Zip and City search API (ctp-zip-api)
-
-http://ctp-zip-api.herokuapp.com/
-
-For this week's projects we will be developing two simple applications, (1) the first app allows us to search for City names and details for a given zip code, and (2) the second app allows us to find all of Zip codes associated with a given City name.
-
-Below is a description of the relevant API endpoints for the projects:
-
-### `/zip/:zipcode` - find Cities associated with a zipcode
-
-`http://ctp-zip-api.herokuapp.com/zip/:zipcode`
-
-provide the zipcode in the url and you will receive a JSON response with an array containing an object for each city found. For example see:
-
-http://ctp-zip-api.herokuapp.com/zip/10016
-
-### `/city/:cityname` - find Zip Codes associated with a city name
-
-`http://ctp-zip-api.herokuapp.com/city/:cityname`
-
-`:cityname` must be in all caps
-
-provide the city name in the url and you will receive a JSON response with an array containing a list of all zip codes for that city:
-
-http://ctp-zip-api.herokuapp.com/city/SPRINGFIELD
-
-
-## Project 1: Zip Code Search app
-
-In this project you will build a simple Zip Code search app. We will need an input field where the user can enter a zip code, like in the following image:
-
-![Input field for searching Zip codes](zip-search-1.png)
-
-We will use the user input to search the ctp-zip-api. If the zip code is valid the API will respond with an object for each city. Use that response to display each city in a separate div like in the following image: 
-
-![Display City Results](zip-search-2.png)
-
-
-## Project 2: City Search app
-
-In this project we will allow the user to provide us a City name and we will display all of the associated zip codes to the user. 
-
-To get started run the following commands
-
-- `create-react-app city-search`
-- `cd city-search`
-- `npm start`
-
-At this point you should see the React hello world page running on your browser. You should leave it running in the background while you work on this project.
-
-Now open this folder (`city-search`) in your text editor. You will see all of the code the create-react-app setup for us. Since this is the stock project we can begin editing the files as we see fit. You can start at `App.js` and you can also edit `public/index.html` (to add Bootstrap for example).
-
-Using the same API as project 1, we will build a City search app, where given a city name, we will display all returned zip codes.
-
-### Tasks
-
-Using the same ctp-zip-api we used in project 1:
-
-- Implement a City Search field that takes city names
-    + it should allow city names to be entered in upper, lower, or mixed case letters
-- Display all zip codes received from the API
-
-### Extra credit
-
-- Display all states where the city was found in the API
-- Group received zip codes by state
-- Display city details for each Zip code
-
-> Note: these will require additional fetch call to the API. Feel free to use your own CSS styles and to add any additional features you want.
diff --git a/zip-search-1.png b/zip-search-1.png
deleted file mode 100644
index d61903a8..00000000
Binary files a/zip-search-1.png and /dev/null differ
diff --git a/zip-search-2.png b/zip-search-2.png
deleted file mode 100644
index 5fc16aab..00000000
Binary files a/zip-search-2.png and /dev/null differ
diff --git a/zip-search/package-lock.json b/zip-search/package-lock.json
index ee06be0f..0c72d14b 100644
--- a/zip-search/package-lock.json
+++ b/zip-search/package-lock.json
@@ -2009,7 +2009,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -2139,7 +2139,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -2959,9 +2959,9 @@
       "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
     },
     "etag": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
-      "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
     },
     "event-emitter": {
       "version": "0.3.5",
@@ -3060,7 +3060,7 @@
         "depd": "1.1.1",
         "encodeurl": "1.0.1",
         "escape-html": "1.0.3",
-        "etag": "1.8.0",
+        "etag": "1.8.1",
         "finalhandler": "1.0.4",
         "fresh": "0.5.0",
         "merge-descriptors": "1.0.1",
@@ -4019,13 +4019,6 @@
             }
           }
         },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true,
-          "requires": {
-            "safe-buffer": "5.0.1"
-          }
-        },
         "string-width": {
           "version": "1.0.2",
           "bundled": true,
@@ -4035,6 +4028,13 @@
             "strip-ansi": "3.0.1"
           }
         },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true,
+          "requires": {
+            "safe-buffer": "5.0.1"
+          }
+        },
         "stringstream": {
           "version": "0.0.5",
           "bundled": true,
@@ -4590,9 +4590,9 @@
       }
     },
     "http-parser-js": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.5.tgz",
-      "integrity": "sha512-sYaqbMBf8hoS6OZBwMygxdLD3TsWgzheP55nkQ7GiR7gsn8x+2oTMCoJSAQmNm3obzOjJYT6tdTz1XcYjKyUqg=="
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.6.tgz",
+      "integrity": "sha1-GVJz9YcExFLWcQdr4gEyndNB3FU="
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -4769,9 +4769,9 @@
       }
     },
     "interpret": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.4.tgz",
+      "integrity": "sha1-ggzdWIuGj/sZGoCVBtbJyPISsbA="
     },
     "invariant": {
       "version": "2.2.2",
@@ -5414,9 +5414,9 @@
       }
     },
     "js-base64": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.1.tgz",
-      "integrity": "sha512-cEao+Mb0czmVPzywx6+Cd0vmTAZrHJl92xqNlrLj8KpDhi7FfQ6jECH7DeQ27MAPQRSJXpPSMhqisO7N4712Ww=="
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz",
+      "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw=="
     },
     "js-tokens": {
       "version": "3.0.2",
@@ -6587,7 +6587,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6623,7 +6623,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6658,7 +6658,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6692,7 +6692,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6726,7 +6726,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6760,7 +6760,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6794,7 +6794,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6829,7 +6829,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6864,7 +6864,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6948,7 +6948,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6982,7 +6982,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7029,7 +7029,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7070,7 +7070,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7105,7 +7105,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7142,7 +7142,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7179,7 +7179,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7248,7 +7248,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7285,7 +7285,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7320,7 +7320,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7355,7 +7355,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7389,7 +7389,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7425,7 +7425,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7472,7 +7472,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7508,7 +7508,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -7549,7 +7549,7 @@
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.1",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -8447,7 +8447,7 @@
         "destroy": "1.0.4",
         "encodeurl": "1.0.1",
         "escape-html": "1.0.3",
-        "etag": "1.8.0",
+        "etag": "1.8.1",
         "fresh": "0.5.0",
         "http-errors": "1.6.2",
         "mime": "1.3.4",
@@ -8750,14 +8750,6 @@
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
       "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
     },
-    "string_decoder": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
-      "requires": {
-        "safe-buffer": "5.1.1"
-      }
-    },
     "string-length": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/string-length/-/string-length-1.0.1.tgz",
@@ -8790,6 +8782,14 @@
         }
       }
     },
+    "string_decoder": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
+      "requires": {
+        "safe-buffer": "5.1.1"
+      }
+    },
     "stringstream": {
       "version": "0.0.5",
       "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
@@ -9364,7 +9364,7 @@
         "async": "2.5.0",
         "enhanced-resolve": "3.4.1",
         "escope": "3.6.0",
-        "interpret": "1.0.3",
+        "interpret": "1.0.4",
         "json-loader": "0.5.7",
         "json5": "0.5.1",
         "loader-runner": "2.3.0",
@@ -9725,7 +9725,7 @@
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz",
       "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs=",
       "requires": {
-        "http-parser-js": "0.4.5",
+        "http-parser-js": "0.4.6",
         "websocket-extensions": "0.1.2"
       }
     },
diff --git a/zip-search/public/index.html b/zip-search/public/index.html
index aaeacaab..c88d5cd7 100644
--- a/zip-search/public/index.html
+++ b/zip-search/public/index.html
@@ -19,15 +19,7 @@
       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`.
     -->
-    <!-- Latest compiled and minified CSS -->
-    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-
-    <!-- Optional theme -->
-    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
-
-    <!-- Latest compiled and minified JavaScript -->
-    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
-    <title>React App</title>
+    <title>Zip Code Search</title>
   </head>
   <body>
     <noscript>
diff --git a/zip-search/src/App.css b/zip-search/src/App.css
index 6f9daabd..15adfdc7 100644
--- a/zip-search/src/App.css
+++ b/zip-search/src/App.css
@@ -1,3 +1,7 @@
+.App {
+  text-align: center;
+}
+
 .App-logo {
   animation: App-logo-spin infinite 20s linear;
   height: 80px;
@@ -5,9 +9,9 @@
 
 .App-header {
   background-color: #222;
+  height: 150px;
   padding: 20px;
   color: white;
-  text-align: center;
 }
 
 .App-intro {
@@ -18,8 +22,3 @@
   from { transform: rotate(0deg); }
   to { transform: rotate(360deg); }
 }
-
-.row {
-  padding-top: 10px;
-  padding-bottom: 10px;
-}
diff --git a/zip-search/src/App.js b/zip-search/src/App.js
index a505dbef..c11bd8ec 100644
--- a/zip-search/src/App.js
+++ b/zip-search/src/App.js
@@ -2,27 +2,99 @@ import React, { Component } from 'react';
 import logo from './logo.svg';
 import './App.css';
 
-
 function City(props) {
-  return (<div></div>);
+  return (
+    <div className="row">
+      <div className="col-xs-12">
+        <div className="panel panel-default">
+          <div className="panel-heading">
+            <h3 className="panel-title">{props.data.LocationText}</h3>
+          </div>
+          <div className="panel-body">
+            <ul>
+              <li>State: {props.data.State}</li>
+              <li>Location: ({props.data.Lat}, {props.data.Long})</li>
+              <li>Population (estimated): {props.data.EstimatedPopulation}</li>
+              <li>Total Wages: {props.data.TotalWages}</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
 }
 
-function ZipSearchField(props) {
-  return (<div></div>);
+function SearchField(props) {
+  return (
+    <div className="input-area">
+      <label className="box-text">{props.labelText}</label>
+      <input className="box" type="text" onChange={props.handleChange} name={props.value} />
+    </div>);
 }
 
-
 class App extends Component {
+  constructor() {
+    super();
+    this.state = {
+      zipValue: "",
+      cities: [],
+    }
+    this.zipChange = this.zipChange.bind(this);
+  }
+
+  zipChange(event) {
+    const zip = event.target.value;
+
+    this.setState({
+      zipValue: zip,
+    })
+
+    if(zip.length === 5) {
+      fetch('http://ctp-zip-api.herokuapp.com/zip/'+zip)
+        .then((response) => {
+          if(response.ok) {
+            return response.json();
+          } else {
+            return [];
+          }
+        })
+        .then((jsonResponse) => {
+          const cities = jsonResponse.map((city) => {
+            return <City data={city} key={city.RecordNumber} />;
+          });
+
+          this.setState({
+            cities: cities,
+          });
+        })
+        .catch((e) => {
+          this.setState({
+            cities: [],
+          });
+          console.log("In catch: " + e);
+        });
+    } else {
+      this.setState({
+        cities: [],
+      });
+    }
+  }
+
   render() {
     return (
       <div className="App">
         <div className="App-header">
           <h2>Zip Code Search</h2>
         </div>
-        <ZipSearchField />
-        <div>
-          <City />
-          <City />
+        <div className="container-fluid">
+          <div className="row">
+            <div className="col-sm-6 col-sm-offset-3">
+              <ZipSearchField
+                zipValue={this.state.zipValue}
+                handleChange={this.zipChange} />
+              {this.state.cities.length > 0 ? this.state.cities : <div>No Results</div>}
+            </div>
+          </div>
         </div>
       </div>
     );