From 0efdaff4ed904c8b25a51694fc81a37f0d9ec63e Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Tue, 8 Sep 2015 20:00:27 +0200 Subject: [PATCH 01/19] Fix https requests being broken by http rewrite --- data/js/services/request.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/data/js/services/request.js b/data/js/services/request.js index 626373f..6049d18 100644 --- a/data/js/services/request.js +++ b/data/js/services/request.js @@ -7,7 +7,7 @@ angular.module('RestedApp') * Prepend http:// if missing from url */ var prependHttp = function(url) { - if(!(/^http:\/\//.test(url))) { + if(!(/^https?:\/\//.test(url))) { url = 'http://' + url; } return url; From be0b2bc188721663dab311cf7da885a44c819214 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Tue, 8 Sep 2015 20:55:49 +0200 Subject: [PATCH 02/19] Replace $http with xhr --- data/js/app.js | 2 +- data/js/directives/request.js | 33 +++++++++++++++--------------- data/js/services/request.js | 22 +++++++++++++++++--- data/views/directives/request.html | 4 ++-- 4 files changed, 39 insertions(+), 22 deletions(-) diff --git a/data/js/app.js b/data/js/app.js index 6054627..017be00 100644 --- a/data/js/app.js +++ b/data/js/app.js @@ -1,4 +1,4 @@ 'use strict'; -var app = angular.module('RestedApp', []); +angular.module('RestedApp', []); diff --git a/data/js/directives/request.js b/data/js/directives/request.js index b524018..7e9a4ab 100644 --- a/data/js/directives/request.js +++ b/data/js/directives/request.js @@ -18,9 +18,16 @@ angular.module('RestedApp') scope.headers = []; scope.slidden = {}; - var processReturnData = function(response) { - scope.response = response; - scope.response.headers = response.headers(); + var processReturnData = function() { + var request = this; + console.log(request); + + // Manually start $digest because angular does not know + // about the async XMLHttpRequest + scope.$apply(function() { + scope.response = request; + scope.response.headers = request.getAllResponseHeaders(); + }); }; scope.sendRequest = function() { @@ -38,22 +45,19 @@ angular.module('RestedApp') }); } - // Strip empty headers and re-map headers to - // something we can use in $http. - if (scope.headers) { - request.headers = RequestUtils.reMapHeaders(scope.headers, true); - } + request.headers = scope.headers; // Add basic auth header var basicAuth = scope.request.basicAuth; if (basicAuth && basicAuth.username) { var password = basicAuth.password ? basicAuth.password : ''; - console.log('auth', basicAuth.username, basicAuth.password); - request.headers.Authorization = 'Basic ' + Base64.encode(basicAuth.username + ':' + password); + request.headers.push({ + name: 'Authorization', + value: 'Basic ' + Base64.encode(basicAuth.username + ':' + password) + }); } - Request.run(request, RequestUtils.reMapHeaders(scope.$root.urlVariables, true)) - .then(processReturnData, processReturnData); + Request.run(request, RequestUtils.reMapHeaders(scope.$root.urlVariables, true), processReturnData); }; scope.addHeader = function() { @@ -88,7 +92,6 @@ angular.module('RestedApp') return; } - request.headers = RequestUtils.reMapHeaders(scope.headers, true); scope.addToCollection(request); }; @@ -156,9 +159,7 @@ angular.module('RestedApp') // Map headers from {name: value} => [{name: xxx, value: xxx}] // This is so we can mutate them from the template. - if (scope.request.headers) { - scope.headers = RequestUtils.reMapHeaders(scope.request.headers); - } else { + if (!scope.request.headers) { scope.headers = []; } } diff --git a/data/js/services/request.js b/data/js/services/request.js index 6049d18..b77c738 100644 --- a/data/js/services/request.js +++ b/data/js/services/request.js @@ -1,10 +1,11 @@ 'use strict'; angular.module('RestedApp') -.factory('Request', function($http) { +.factory('Request', function() { /** * Prepend http:// if missing from url + * Make sure to allow https */ var prependHttp = function(url) { if(!(/^https?:\/\//.test(url))) { @@ -29,14 +30,29 @@ angular.module('RestedApp') }).replace(/([^:]\/)\/+/g, '$1'); }; + var createXMLHttpRequest = function(req) { + var request = new XMLHttpRequest(true, true); + console.log(req.url, req.method); + request.open(req.method, req.url); + + req.headers.forEach(function(header) { + request.setRequestHeader(header.name, header.value); + }); + + return request; + }; + return { - run: function(request, parameters) { + run: function(request, parameters, fn) { var requestCopy = angular.copy(request); var url = prependHttp(requestCopy.url); url = mapParameters(url, parameters); requestCopy.url = url; - return $http(requestCopy); + var req = createXMLHttpRequest(requestCopy); + req.onload = fn.bind(req); + + req.send(); } }; }); diff --git a/data/views/directives/request.html b/data/views/directives/request.html index 1e4abf6..be6d367 100644 --- a/data/views/directives/request.html +++ b/data/views/directives/request.html @@ -71,7 +71,7 @@
- Response - {{response.config.url}} + Response - {{response.responseURL}}

@@ -86,7 +86,7 @@

+ content="response.response">

From 63b65e1c1fd11c6e87836a3764d223550df02cbd Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Wed, 9 Sep 2015 21:41:22 +0200 Subject: [PATCH 03/19] Send request data and prettify json in response --- data/js/controllers/root.js | 1 + data/js/directives/request.js | 26 ++++++++++++++++++-------- data/js/services/request.js | 5 +++-- data/views/directives/request.html | 2 +- 4 files changed, 23 insertions(+), 11 deletions(-) diff --git a/data/js/controllers/root.js b/data/js/controllers/root.js index 472224f..7b862ec 100644 --- a/data/js/controllers/root.js +++ b/data/js/controllers/root.js @@ -117,3 +117,4 @@ angular.module('RestedApp') }); }; }); + diff --git a/data/js/directives/request.js b/data/js/directives/request.js index 7e9a4ab..9866ff0 100644 --- a/data/js/directives/request.js +++ b/data/js/directives/request.js @@ -19,14 +19,20 @@ angular.module('RestedApp') scope.slidden = {}; var processReturnData = function() { - var request = this; - console.log(request); + var response = this; // Manually start $digest because angular does not know - // about the async XMLHttpRequest + // about the async XMLHttpresponse scope.$apply(function() { - scope.response = request; - scope.response.headers = request.getAllResponseHeaders(); + scope.response = response; + scope.response.headers = response.getAllResponseHeaders(); + + // Format json pretty-like + if (response.getResponseHeader('Content-Type') && response.getResponseHeader('Content-Type').toLowerCase().indexOf('json') > -1) { + scope.response.formattedResponse = JSON.parse(response.responseText); + } else { + scope.response.formattedResponse = response.responseText; + } }); }; @@ -103,14 +109,18 @@ angular.module('RestedApp') scope.toggleCollections = function() { // Logic handled in css and ngHide scope.$root.collectionsMinimized = !scope.$root.collectionsMinimized; - }; - scope.$watch('$root.collectionsMinimized', function(isMinimized) { + var isMinimized = scope.$root.collectionsMinimized; scope.toggleCollectionsConfig = { title: (isMinimized ? 'Show' : 'Hide') + ' collections', classes: ['fa', (isMinimized ? 'fa-compress' : 'fa-expand')] }; - }); + }; + + scope.toggleCollectionsConfig = { + title: 'Hide collections', + classes: ['fa', 'fa-expand'] + }; scope.addRequestConfig = { title: 'Add request to collection', diff --git a/data/js/services/request.js b/data/js/services/request.js index b77c738..4980c01 100644 --- a/data/js/services/request.js +++ b/data/js/services/request.js @@ -50,9 +50,10 @@ angular.module('RestedApp') requestCopy.url = url; var req = createXMLHttpRequest(requestCopy); - req.onload = fn.bind(req); + req.onprogress = fn.bind(req); - req.send(); + req.send(request.data); } }; }); + diff --git a/data/views/directives/request.html b/data/views/directives/request.html index be6d367..178767a 100644 --- a/data/views/directives/request.html +++ b/data/views/directives/request.html @@ -86,7 +86,7 @@

+ content="response.formattedResponse"> From 0ccdb41a345f871e8ec673766246ff81bc8785f8 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Wed, 9 Sep 2015 22:51:02 +0200 Subject: [PATCH 04/19] Use loadend event for running request callback --- data/js/services/request.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/data/js/services/request.js b/data/js/services/request.js index 4980c01..58ca574 100644 --- a/data/js/services/request.js +++ b/data/js/services/request.js @@ -50,7 +50,7 @@ angular.module('RestedApp') requestCopy.url = url; var req = createXMLHttpRequest(requestCopy); - req.onprogress = fn.bind(req); + req.onloadend = fn.bind(req); req.send(request.data); } From 7c44c3eca52e54d8babcba488cf85f25efac5de6 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Wed, 9 Sep 2015 23:25:07 +0200 Subject: [PATCH 05/19] Isolate request.headers from being mutated --- data/js/directives/request.js | 32 ++++++------------- data/js/services/request.js | 5 +-- data/js/services/requestUtils.js | 1 + data/views/directives/request.html | 10 +++--- .../fragments/request/headerDropdown.html | 2 +- 5 files changed, 20 insertions(+), 30 deletions(-) diff --git a/data/js/directives/request.js b/data/js/directives/request.js index 9866ff0..5b1da91 100644 --- a/data/js/directives/request.js +++ b/data/js/directives/request.js @@ -14,9 +14,9 @@ angular.module('RestedApp') methods: ['GET', 'POST', 'PUT', 'DELETE', 'PATCH', 'HEAD', 'JSONP'] }; + scope.slidden = {}; scope.urlVariables = []; scope.headers = []; - scope.slidden = {}; var processReturnData = function() { var response = this; @@ -37,8 +37,8 @@ angular.module('RestedApp') }; scope.sendRequest = function() { - var request = scope.request; - var headers = {}; + var request = angular.copy(scope.request); + var headers = request.headers || []; // Check for sillyness // If no URL is provided, assume user wants the placeholder URL. @@ -51,18 +51,18 @@ angular.module('RestedApp') }); } - request.headers = scope.headers; - // Add basic auth header var basicAuth = scope.request.basicAuth; if (basicAuth && basicAuth.username) { var password = basicAuth.password ? basicAuth.password : ''; - request.headers.push({ + headers.push({ name: 'Authorization', value: 'Basic ' + Base64.encode(basicAuth.username + ':' + password) }); } + request.headers = headers; + Request.run(request, RequestUtils.reMapHeaders(scope.$root.urlVariables, true), processReturnData); }; @@ -72,11 +72,11 @@ angular.module('RestedApp') value: '' }; - if(!Array.isArray(scope.headers)) { - scope.headers = []; + if(!Array.isArray(scope.request.headers)) { + scope.request.headers = []; } - var isAlreadyAdded = scope.headers.some(function(item) { + var isAlreadyAdded = scope.request.headers.some(function(item) { return newHeader.name == item.name; }); @@ -84,7 +84,7 @@ angular.module('RestedApp') return; } - scope.headers.push(newHeader); + scope.request.headers.push(newHeader); }; scope.addRequest = function(request) { @@ -163,18 +163,6 @@ angular.module('RestedApp') }); }; - scope.$watch('request', function(newVal, oldVal) { - if(newVal && newVal !== oldVal) { - scope.request = newVal; - - // Map headers from {name: value} => [{name: xxx, value: xxx}] - // This is so we can mutate them from the template. - if (!scope.request.headers) { - scope.headers = []; - } - } - }); - scope.getRandomURL = RequestUtils.randomURL; } }; diff --git a/data/js/services/request.js b/data/js/services/request.js index 58ca574..a76501d 100644 --- a/data/js/services/request.js +++ b/data/js/services/request.js @@ -32,11 +32,12 @@ angular.module('RestedApp') var createXMLHttpRequest = function(req) { var request = new XMLHttpRequest(true, true); - console.log(req.url, req.method); request.open(req.method, req.url); req.headers.forEach(function(header) { - request.setRequestHeader(header.name, header.value); + if(header.name) { + request.setRequestHeader(header.name, header.value); + } }); return request; diff --git a/data/js/services/requestUtils.js b/data/js/services/requestUtils.js index e56b45a..87cee0f 100644 --- a/data/js/services/requestUtils.js +++ b/data/js/services/requestUtils.js @@ -28,6 +28,7 @@ angular.module('RestedApp') * ] */ var reMapHeaders = function(headers, asObject) { + // TODO - we no longer use asObject = false if(!headers && !asObject) { return []; } else if(!headers && asObject) { diff --git a/data/views/directives/request.html b/data/views/directives/request.html index 178767a..0a9df7e 100644 --- a/data/views/directives/request.html +++ b/data/views/directives/request.html @@ -79,14 +79,14 @@

+ data-title="Headers" + data-content="response.headers" + data-start-hidden="true"> + data-title="Response body" + data-content="response.formattedResponse"> diff --git a/data/views/fragments/request/headerDropdown.html b/data/views/fragments/request/headerDropdown.html index 9fd7834..fe57677 100644 --- a/data/views/fragments/request/headerDropdown.html +++ b/data/views/fragments/request/headerDropdown.html @@ -12,7 +12,7 @@

+ data-ng-repeat="header in request.headers track by $index">
Date: Wed, 9 Sep 2015 23:25:33 +0200 Subject: [PATCH 06/19] Add empty header row as default --- data/js/constants/constants.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/data/js/constants/constants.js b/data/js/constants/constants.js index af9adac..81bc7e7 100644 --- a/data/js/constants/constants.js +++ b/data/js/constants/constants.js @@ -26,7 +26,10 @@ module.constant('DB_URL_VARIABLES_STORE_NAME', 'urlVariables'); // application load or on request reset. module.constant('DEFAULT_REQUEST', { method: 'GET', - headers: {}, + headers: [{ + name: '', + value: '' + }], cache: false }); From 50ef69c90734ab874bb5207f7bfabd9478f6aa19 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Wed, 9 Sep 2015 23:53:46 +0200 Subject: [PATCH 07/19] Add remove header button --- data/css/spesific.css | 4 +++- data/js/directives/request.js | 6 ++++++ data/views/fragments/request/headerDropdown.html | 8 +++++++- 3 files changed, 16 insertions(+), 2 deletions(-) diff --git a/data/css/spesific.css b/data/css/spesific.css index a640978..2bbc407 100644 --- a/data/css/spesific.css +++ b/data/css/spesific.css @@ -73,4 +73,6 @@ slidey-button { /* Makes the animation look a bit more sane */ white-space: nowrap; } - +.remove-header { + margin-top: 10px; +} diff --git a/data/js/directives/request.js b/data/js/directives/request.js index 5b1da91..2fd915a 100644 --- a/data/js/directives/request.js +++ b/data/js/directives/request.js @@ -87,6 +87,12 @@ angular.module('RestedApp') scope.request.headers.push(newHeader); }; + scope.removeHeader = function(header) { + scope.request.headers = scope.request.headers.filter(function(item) { + return item !== header; + }); + }; + scope.addRequest = function(request) { if(!request.url) { // The non-hiding text for the add button diff --git a/data/views/fragments/request/headerDropdown.html b/data/views/fragments/request/headerDropdown.html index fe57677..7daa0a2 100644 --- a/data/views/fragments/request/headerDropdown.html +++ b/data/views/fragments/request/headerDropdown.html @@ -13,7 +13,7 @@

-
+
placeholder="Value" />
+
Date: Thu, 10 Sep 2015 00:01:15 +0200 Subject: [PATCH 08/19] Responsive adjustments for send button --- data/css/common.css | 7 +++++++ data/views/directives/request.html | 8 ++++---- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/data/css/common.css b/data/css/common.css index 944949b..66c3a58 100644 --- a/data/css/common.css +++ b/data/css/common.css @@ -22,6 +22,13 @@ opacity: 1; } +.text-ellipsis { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + max-width: 100%; +} + .animate { -webkit-transition: 0.2s ease; -moz-transition: 0.2s ease; diff --git a/data/views/directives/request.html b/data/views/directives/request.html index 0a9df7e..97dcd4f 100644 --- a/data/views/directives/request.html +++ b/data/views/directives/request.html @@ -36,20 +36,20 @@
-
+
-
+
From 62db64d28d656623741d1a57c0c022ed7be180d6 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 17:13:49 +0200 Subject: [PATCH 09/19] Ensure headers is array before iterating --- data/css/common.css | 1 - data/js/services/request.js | 12 +++++++----- 2 files changed, 7 insertions(+), 6 deletions(-) diff --git a/data/css/common.css b/data/css/common.css index 66c3a58..9d7f809 100644 --- a/data/css/common.css +++ b/data/css/common.css @@ -36,4 +36,3 @@ transition: 0.2s ease; } - diff --git a/data/js/services/request.js b/data/js/services/request.js index a76501d..1722f7b 100644 --- a/data/js/services/request.js +++ b/data/js/services/request.js @@ -34,11 +34,13 @@ angular.module('RestedApp') var request = new XMLHttpRequest(true, true); request.open(req.method, req.url); - req.headers.forEach(function(header) { - if(header.name) { - request.setRequestHeader(header.name, header.value); - } - }); + if(Array.isArray(req.headers)) { + req.headers.forEach(function(header) { + if(header.name) { + request.setRequestHeader(header.name, header.value); + } + }); + } return request; }; From c9d744ceed542ebf7865e8285913af381e75b02d Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 17:31:45 +0200 Subject: [PATCH 10/19] Simplify contentSlider: Should no longer format --- data/js/directives/contentSlider.js | 11 +---------- data/views/directives/contentSlider.html | 6 ++++-- 2 files changed, 5 insertions(+), 12 deletions(-) diff --git a/data/js/directives/contentSlider.js b/data/js/directives/contentSlider.js index 72de51b..09ad83f 100644 --- a/data/js/directives/contentSlider.js +++ b/data/js/directives/contentSlider.js @@ -13,16 +13,6 @@ angular.module('RestedApp') link: function(scope, element, attrs, controllers) { scope.slidden = !scope.startHidden; - // prettyprint handles js and html but not json, - // here we assume that if it starts with [ or { - // it is json, and we parse it as such. - scope.parseJSON = function(body) { - if(body !== null && (typeof body === 'object' || /^\s*[\[\{]/.test(body))) { - return JSON.stringify(body, null, 2); - } - return body; - }; - scope.slideToggle = function() { element.find('.content').slideToggle(); scope.slidden = !scope.slidden; @@ -30,3 +20,4 @@ angular.module('RestedApp') } }; }); + diff --git a/data/views/directives/contentSlider.html b/data/views/directives/contentSlider.html index eb9fa77..32c1c92 100644 --- a/data/views/directives/contentSlider.html +++ b/data/views/directives/contentSlider.html @@ -5,7 +5,9 @@

data-ng-class="{'fa-rotate-90': slidden}">

- 
-    {{parseJSON(content)}}
+
+ From fc5d15f463bb6db48888d52d065e91f91da93250 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 18:18:07 +0200 Subject: [PATCH 11/19] Fix bug with json beautification --- data/js/directives/request.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/data/js/directives/request.js b/data/js/directives/request.js index 2fd915a..5e8729c 100644 --- a/data/js/directives/request.js +++ b/data/js/directives/request.js @@ -29,7 +29,7 @@ angular.module('RestedApp') // Format json pretty-like if (response.getResponseHeader('Content-Type') && response.getResponseHeader('Content-Type').toLowerCase().indexOf('json') > -1) { - scope.response.formattedResponse = JSON.parse(response.responseText); + scope.response.formattedResponse = JSON.stringify(JSON.parse(response.responseText), null, 2); } else { scope.response.formattedResponse = response.responseText; } From 50587713597b0e598f001139e8c74d84e6fd8669 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 18:28:26 +0200 Subject: [PATCH 12/19] Workaround to allow escape key modal dismiss --- data/views/directives/modal.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/data/views/directives/modal.html b/data/views/directives/modal.html index 638c9db..134258a 100644 --- a/data/views/directives/modal.html +++ b/data/views/directives/modal.html @@ -1,4 +1,4 @@ -
+
@@ -38,3 +38,4 @@

+ From e994e89096cf100f3e85945026dd399f2ba3f576 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 18:33:07 +0200 Subject: [PATCH 13/19] Make confirm modal dailogue --- data/js/directives/modal.js | 5 +++++ data/views/directives/modal.html | 1 + 2 files changed, 6 insertions(+) diff --git a/data/js/directives/modal.js b/data/js/directives/modal.js index 9beb53e..03e57f9 100644 --- a/data/js/directives/modal.js +++ b/data/js/directives/modal.js @@ -16,6 +16,11 @@ angular.module('RestedApp') if(newVal) { element.find('.modal').modal('show'); + + // Focus OK button after fade-in so user can press Enter + setTimeout(function() { + element.find('#modalAction').focus(); + }, 500); } else { element.find('.modal').modal('hide'); } diff --git a/data/views/directives/modal.html b/data/views/directives/modal.html index 134258a..dc58b64 100644 --- a/data/views/directives/modal.html +++ b/data/views/directives/modal.html @@ -29,6 +29,7 @@

Close

- From a42aeea3fc7ec52951a71a8299b540b1b4327840 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 20:16:51 +0200 Subject: [PATCH 18/19] Bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index fecc1d5..27356ff 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,6 @@ "description": "A REST client for the rest of us", "author": "Espen Henriksen", "license": "GPL-2.0", - "version": "0.2.0", + "version": "0.3.0", "main": "lib/main.js" } From d73ec338fd926f7a6f84d786ae2eddf9459e19d4 Mon Sep 17 00:00:00 2001 From: Espen Henriksen Date: Thu, 10 Sep 2015 20:18:41 +0200 Subject: [PATCH 19/19] Update README with info on 0.3 and append to TODO --- README.md | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index c2e0c7c..008f237 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ A REST client for the rest of us. _Note: This is the source code, the extension download is [here](https://addons.mozilla.org/en-US/firefox/addon/rested/?src=search)._ RESTED is a new take on rest clients on Firefox. -It is meant to be easy to use to let you work as effective as possible. +It is designed to be easy to use to let you work as effective as possible. It features all the most commonly used HTTP methods, setting headers, saving requests to local storage, and more. @@ -20,14 +20,17 @@ that they will be merged - requests will be reviewed). This project was from the very beginning intended to be easy to work with. It is basically just an angular 1.4 app inside of Firefox, so if you know angular, you're in luck! -Features in 0.2, currently in review: - - Templates in the URLs (example: www.vg.no?authToken={{token}}) - - Basic auth - - Fullscreen request panel (minimize collections) - - Other UI goodies +Features in 0.3, currently in review: + - Remove headers from request + - Spinner for slow requests + - Changes undelying implementation $http -> XHR + - Https urls should no longer break + - Responsive adjustments - should now look good on monitors for mice What features are on the to-do list: - Improve collections with collapsible collection groups + - Request history + - Export and import collections from file - Improve pretty-printing of results In order to work on this project, you're going to need a few things: