├── 01_boilerplate ├── assets │ ├── css │ │ └── style.css │ ├── fonts │ │ ├── Menlo-Bold.woff │ │ ├── Menlo-BoldItalic.woff │ │ ├── Menlo-Italic.woff │ │ └── Menlo-Regular.woff │ └── js │ │ └── script.js └── index.html ├── 02_making_a_request_1 ├── assets │ ├── css │ │ └── style.css │ ├── fonts │ │ ├── Menlo-Bold.woff │ │ ├── Menlo-BoldItalic.woff │ │ ├── Menlo-Italic.woff │ │ └── Menlo-Regular.woff │ └── js │ │ └── script.js └── index.html ├── 03_making_a_request_2 ├── assets │ ├── css │ │ └── style.css │ ├── fonts │ │ ├── Menlo-Bold.woff │ │ ├── Menlo-BoldItalic.woff │ │ ├── Menlo-Italic.woff │ │ └── Menlo-Regular.woff │ └── js │ │ └── script.js └── index.html ├── 04_making_a_POST_request_1 ├── assets │ ├── css │ │ └── style.css │ ├── fonts │ │ ├── Menlo-Bold.woff │ │ ├── Menlo-BoldItalic.woff │ │ ├── Menlo-Italic.woff │ │ └── Menlo-Regular.woff │ └── js │ │ └── script.js └── index.html ├── 05_making_a_POST_request_2 ├── assets │ ├── css │ │ └── style.css │ ├── fonts │ │ ├── Menlo-Bold.woff │ │ ├── Menlo-BoldItalic.woff │ │ ├── Menlo-Italic.woff │ │ └── Menlo-Regular.woff │ └── js │ │ └── script.js └── index.html ├── 06_finding_a_subtle_error ├── assets │ ├── css │ │ └── style.css │ ├── fonts │ │ ├── Menlo-Bold.woff │ │ ├── Menlo-BoldItalic.woff │ │ ├── Menlo-Italic.woff │ │ └── Menlo-Regular.woff │ └── js │ │ └── script.js └── index.html └── 07_handling_exceptions ├── assets ├── css │ └── style.css ├── fonts │ ├── Menlo-Bold.woff │ ├── Menlo-BoldItalic.woff │ ├── Menlo-Italic.woff │ └── Menlo-Regular.woff └── js │ └── script.js └── index.html /01_boilerplate/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /01_boilerplate/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/01_boilerplate/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /01_boilerplate/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/01_boilerplate/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /01_boilerplate/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/01_boilerplate/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /01_boilerplate/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/01_boilerplate/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /01_boilerplate/assets/js/script.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/01_boilerplate/assets/js/script.js -------------------------------------------------------------------------------- /01_boilerplate/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /02_making_a_request_1/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /02_making_a_request_1/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/02_making_a_request_1/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /02_making_a_request_1/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/02_making_a_request_1/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /02_making_a_request_1/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/02_making_a_request_1/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /02_making_a_request_1/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/02_making_a_request_1/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /02_making_a_request_1/assets/js/script.js: -------------------------------------------------------------------------------- 1 | const API_KEY = "VZn-Fx2ohpPGHAs_RhP_m6IgxYA"; 2 | const API_URL = "https://ci-jshint.herokuapp.com/api"; 3 | const resultsModal = new bootstrap.Modal(document.getElementById("resultsModal")); 4 | 5 | document.getElementById("status").addEventListener("click", e => getStatus(e)); 6 | 7 | async function getStatus(e) { 8 | 9 | const queryString = `${API_URL}?api_key=${API_KEY}`; 10 | 11 | const response = await fetch(queryString); 12 | 13 | const data = await response.json(); 14 | 15 | if (response.ok) { 16 | console.log(data.expiry); 17 | } 18 | 19 | } -------------------------------------------------------------------------------- /02_making_a_request_1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /03_making_a_request_2/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /03_making_a_request_2/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/03_making_a_request_2/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /03_making_a_request_2/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/03_making_a_request_2/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /03_making_a_request_2/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/03_making_a_request_2/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /03_making_a_request_2/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/03_making_a_request_2/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /03_making_a_request_2/assets/js/script.js: -------------------------------------------------------------------------------- 1 | const API_KEY = "VZn-Fx2ohpPGHAs_RhP_m6IgxYA"; 2 | const API_URL = "https://ci-jshint.herokuapp.com/api"; 3 | const resultsModal = new bootstrap.Modal(document.getElementById("resultsModal")); 4 | 5 | document.getElementById("status").addEventListener("click", e => getStatus(e)); 6 | 7 | async function getStatus(e) { 8 | 9 | const queryString = `${API_URL}?api_key=${API_KEY}`; 10 | 11 | const response = await fetch(queryString); 12 | 13 | const data = await response.json(); 14 | 15 | if (response.ok) { 16 | displayStatus(data); 17 | } else { 18 | throw new Error(data.error); 19 | } 20 | 21 | } 22 | 23 | function displayStatus(data) { 24 | 25 | let heading = "API Key Status"; 26 | let results = `
Your key is valid until
`; 27 | results += `
${data.expiry}
`; 28 | 29 | document.getElementById("resultsModalTitle").innerText = heading; 30 | document.getElementById("results-content").innerHTML = results; 31 | resultsModal.show(); 32 | 33 | } -------------------------------------------------------------------------------- /03_making_a_request_2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /04_making_a_POST_request_1/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /04_making_a_POST_request_1/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/04_making_a_POST_request_1/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /04_making_a_POST_request_1/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/04_making_a_POST_request_1/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /04_making_a_POST_request_1/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/04_making_a_POST_request_1/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /04_making_a_POST_request_1/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/04_making_a_POST_request_1/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /04_making_a_POST_request_1/assets/js/script.js: -------------------------------------------------------------------------------- 1 | const API_KEY = "VZn-Fx2ohpPGHAs_RhP_m6IgxYA"; 2 | const API_URL = "https://ci-jshint.herokuapp.com/api"; 3 | const resultsModal = new bootstrap.Modal(document.getElementById("resultsModal")); 4 | 5 | document.getElementById("status").addEventListener("click", e => getStatus(e)); 6 | document.getElementById("submit").addEventListener("click", e => postForm(e)); 7 | 8 | async function postForm(e) { 9 | 10 | const form = new FormData(document.getElementById("checksform")); 11 | 12 | const response = await fetch(API_URL, { 13 | method: "POST", 14 | headers: { 15 | "Authorization": API_KEY, 16 | }, 17 | body: form, 18 | }); 19 | 20 | } 21 | 22 | async function getStatus(e) { 23 | 24 | const queryString = `${API_URL}?api_key=${API_KEY}`; 25 | 26 | const response = await fetch(queryString); 27 | 28 | const data = await response.json(); 29 | 30 | if (response.ok) { 31 | displayStatus(data); 32 | } else { 33 | throw new Error(data.error); 34 | } 35 | 36 | } 37 | 38 | function displayStatus(data) { 39 | 40 | let heading = "API Key Status"; 41 | let results = `
Your key is valid until
`; 42 | results += `
${data.expiry}
`; 43 | 44 | document.getElementById("resultsModalTitle").innerText = heading; 45 | document.getElementById("results-content").innerHTML = results; 46 | resultsModal.show(); 47 | 48 | } -------------------------------------------------------------------------------- /04_making_a_POST_request_1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /05_making_a_POST_request_2/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /05_making_a_POST_request_2/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/05_making_a_POST_request_2/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /05_making_a_POST_request_2/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/05_making_a_POST_request_2/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /05_making_a_POST_request_2/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/05_making_a_POST_request_2/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /05_making_a_POST_request_2/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/05_making_a_POST_request_2/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /05_making_a_POST_request_2/assets/js/script.js: -------------------------------------------------------------------------------- 1 | const API_KEY = "VZn-Fx2ohpPGHAs_RhP_m6IgxYA"; 2 | const API_URL = "https://ci-jshint.herokuapp.com/api"; 3 | const resultsModal = new bootstrap.Modal(document.getElementById("resultsModal")); 4 | 5 | document.getElementById("status").addEventListener("click", e => getStatus(e)); 6 | document.getElementById("submit").addEventListener("click", e => postForm(e)); 7 | 8 | async function postForm(e) { 9 | 10 | const form = new FormData(document.getElementById("checksform")); 11 | 12 | const response = await fetch(API_URL, { 13 | method: "POST", 14 | headers: { 15 | "Authorization": API_KEY, 16 | }, 17 | body: form, 18 | }); 19 | 20 | const data = await response.json(); 21 | 22 | if (response.ok) { 23 | displayErrors(data); 24 | } else { 25 | throw new Error(data.error); 26 | } 27 | 28 | } 29 | 30 | async function getStatus(e) { 31 | 32 | const queryString = `${API_URL}?api_key=${API_KEY}`; 33 | 34 | const response = await fetch(queryString); 35 | 36 | const data = await response.json(); 37 | 38 | if (response.ok) { 39 | displayStatus(data); 40 | } else { 41 | throw new Error(data.error); 42 | } 43 | 44 | } 45 | 46 | function displayErrors(data) { 47 | 48 | let results = ""; 49 | 50 | let heading = `JSHint Results for ${data.file}`; 51 | if (data.total_errors === 0) { 52 | results = `
No errors reported!
`; 53 | } else { 54 | results = `
Total Errors: ${data.total_errors}
`; 55 | for (let error of data.error_list) { 56 | results += `
At line ${error.line}, `; 57 | results += `column ${error.col}:
`; 58 | results += `
${error.error}
`; 59 | } 60 | } 61 | 62 | document.getElementById("resultsModalTitle").innerText = heading; 63 | document.getElementById("results-content").innerHTML = results; 64 | resultsModal.show(); 65 | } 66 | 67 | function displayStatus(data) { 68 | 69 | let heading = "API Key Status"; 70 | let results = `
Your key is valid until
`; 71 | results += `
${data.expiry}
`; 72 | 73 | document.getElementById("resultsModalTitle").innerText = heading; 74 | document.getElementById("results-content").innerHTML = results; 75 | resultsModal.show(); 76 | 77 | } -------------------------------------------------------------------------------- /05_making_a_POST_request_2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /06_finding_a_subtle_error/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /06_finding_a_subtle_error/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/06_finding_a_subtle_error/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /06_finding_a_subtle_error/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/06_finding_a_subtle_error/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /06_finding_a_subtle_error/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/06_finding_a_subtle_error/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /06_finding_a_subtle_error/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/06_finding_a_subtle_error/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /06_finding_a_subtle_error/assets/js/script.js: -------------------------------------------------------------------------------- 1 | const API_KEY = "VZn-Fx2ohpPGHAs_RhP_m6IgxYA"; 2 | const API_URL = "https://ci-jshint.herokuapp.com/api"; 3 | const resultsModal = new bootstrap.Modal(document.getElementById("resultsModal")); 4 | 5 | document.getElementById("status").addEventListener("click", e => getStatus(e)); 6 | document.getElementById("submit").addEventListener("click", e => postForm(e)); 7 | 8 | function processOptions(form) { 9 | let optArray = []; 10 | 11 | for (let e of form.entries()) { 12 | if (e[0] === "options") { 13 | optArray.push(e[1]); 14 | } 15 | } 16 | 17 | form.delete("options"); 18 | 19 | form.append("options", optArray.join()); 20 | 21 | return form; 22 | } 23 | 24 | async function postForm(e) { 25 | 26 | const form = processOptions(new FormData(document.getElementById("checksform"))); 27 | 28 | const response = await fetch(API_URL, { 29 | method: "POST", 30 | headers: { 31 | "Authorization": API_KEY, 32 | }, 33 | body: form, 34 | }); 35 | 36 | const data = await response.json(); 37 | 38 | if (response.ok) { 39 | displayErrors(data); 40 | } else { 41 | throw new Error(data.error); 42 | } 43 | 44 | } 45 | 46 | async function getStatus(e) { 47 | 48 | const queryString = `${API_URL}?api_key=${API_KEY}`; 49 | 50 | const response = await fetch(queryString); 51 | 52 | const data = await response.json(); 53 | 54 | if (response.ok) { 55 | displayStatus(data); 56 | } else { 57 | throw new Error(data.error); 58 | } 59 | 60 | } 61 | 62 | function displayErrors(data) { 63 | 64 | let results = ""; 65 | 66 | let heading = `JSHint Results for ${data.file}`; 67 | if (data.total_errors === 0) { 68 | results = `
No errors reported!
`; 69 | } else { 70 | results = `
Total Errors: ${data.total_errors}
`; 71 | for (let error of data.error_list) { 72 | results += `
At line ${error.line}, `; 73 | results += `column ${error.col}:
`; 74 | results += `
${error.error}
`; 75 | } 76 | } 77 | 78 | document.getElementById("resultsModalTitle").innerText = heading; 79 | document.getElementById("results-content").innerHTML = results; 80 | resultsModal.show(); 81 | } 82 | 83 | function displayStatus(data) { 84 | 85 | let heading = "API Key Status"; 86 | let results = `
Your key is valid until
`; 87 | results += `
${data.expiry}
`; 88 | 89 | document.getElementById("resultsModalTitle").innerText = heading; 90 | document.getElementById("results-content").innerHTML = results; 91 | resultsModal.show(); 92 | 93 | } -------------------------------------------------------------------------------- /06_finding_a_subtle_error/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /07_handling_exceptions/assets/css/style.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: "Menlo"; 3 | font-style: normal; 4 | font-weight: normal; 5 | src: url("../fonts/Menlo-Regular.woff") format("woff"); 6 | } 7 | @font-face { 8 | font-family: "Menlo"; 9 | font-style: normal; 10 | font-weight: bold; 11 | src: url("../fonts/Menlo-Bold.woff") format("woff"); 12 | } 13 | @font-face { 14 | font-family: "Menlo"; 15 | font-style: italic; 16 | font-weight: normal; 17 | src: url("../fonts/Menlo-Italic.woff") format("woff"); 18 | } 19 | @font-face { 20 | font-family: "Menlo"; 21 | font-style: italic; 22 | font-weight: bold; 23 | src: url("../fonts/Menlo-BoldItalic.woff") format("woff"); 24 | } 25 | 26 | ::-webkit-scrollbar { 27 | -webkit-appearance: none; 28 | width: 7px; 29 | } 30 | 31 | ::-webkit-scrollbar-thumb { 32 | border-radius: 4px; 33 | background-color: rgba(0, 0, 0, .5); 34 | box-shadow: 0 0 1px rgba(255, 255, 255, .5); 35 | } 36 | 37 | body { 38 | margin-top: 10px; 39 | } 40 | 41 | textarea 42 | { 43 | font-family: "Menlo", 'Courier New', Courier, monospace; 44 | height: 25vh; 45 | } 46 | 47 | .modal-body { 48 | max-height: 60vh; 49 | overflow-y: scroll; 50 | } -------------------------------------------------------------------------------- /07_handling_exceptions/assets/fonts/Menlo-Bold.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/07_handling_exceptions/assets/fonts/Menlo-Bold.woff -------------------------------------------------------------------------------- /07_handling_exceptions/assets/fonts/Menlo-BoldItalic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/07_handling_exceptions/assets/fonts/Menlo-BoldItalic.woff -------------------------------------------------------------------------------- /07_handling_exceptions/assets/fonts/Menlo-Italic.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/07_handling_exceptions/assets/fonts/Menlo-Italic.woff -------------------------------------------------------------------------------- /07_handling_exceptions/assets/fonts/Menlo-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Code-Institute-Solutions/API_walkthrough/9cf1796a31accfe2a0b03ba8867b56a5f3d1fccc/07_handling_exceptions/assets/fonts/Menlo-Regular.woff -------------------------------------------------------------------------------- /07_handling_exceptions/assets/js/script.js: -------------------------------------------------------------------------------- 1 | const API_KEY = "VZn-Fx2ohpPGHAs_RhP_m6IgxYA"; 2 | const API_URL = "https://ci-jshint.herokuapp.com/api"; 3 | const resultsModal = new bootstrap.Modal(document.getElementById("resultsModal")); 4 | 5 | document.getElementById("status").addEventListener("click", e => getStatus(e)); 6 | document.getElementById("submit").addEventListener("click", e => postForm(e)); 7 | 8 | function processOptions(form) { 9 | let optArray = []; 10 | 11 | for (let e of form.entries()) { 12 | if (e[0] === "options") { 13 | optArray.push(e[1]); 14 | } 15 | } 16 | 17 | form.delete("options"); 18 | 19 | form.append("options", optArray.join()); 20 | 21 | return form; 22 | } 23 | 24 | async function postForm(e) { 25 | 26 | const form = processOptions(new FormData(document.getElementById("checksform"))); 27 | 28 | const response = await fetch(API_URL, { 29 | method: "POST", 30 | headers: { 31 | "Authorization": API_KEY, 32 | }, 33 | body: form, 34 | }); 35 | 36 | const data = await response.json(); 37 | 38 | if (response.ok) { 39 | displayErrors(data); 40 | } else { 41 | displayException(data); 42 | throw new Error(data.error); 43 | } 44 | 45 | } 46 | 47 | async function getStatus(e) { 48 | 49 | const queryString = `${API_URL}?api_key=${API_KEY}`; 50 | 51 | const response = await fetch(queryString); 52 | 53 | const data = await response.json(); 54 | 55 | if (response.ok) { 56 | displayStatus(data); 57 | } else { 58 | displayException(data); 59 | throw new Error(data.error); 60 | } 61 | 62 | } 63 | 64 | function displayException(data) { 65 | 66 | let heading = `
An Exception Occurred
`; 67 | 68 | results = `
The API returned status code ${data.status_code}
`; 69 | results += `
Error number: ${data.error_no}
`; 70 | results += `
Error text: ${data.error}
`; 71 | 72 | document.getElementById("resultsModalTitle").innerText = heading; 73 | document.getElementById("results-content").innerHTML = results; 74 | resultsModal.show(); 75 | } 76 | 77 | function displayErrors(data) { 78 | 79 | let results = ""; 80 | 81 | let heading = `JSHint Results for ${data.file}`; 82 | if (data.total_errors === 0) { 83 | results = `
No errors reported!
`; 84 | } else { 85 | results = `
Total Errors: ${data.total_errors}
`; 86 | for (let error of data.error_list) { 87 | results += `
At line ${error.line}, `; 88 | results += `column ${error.col}:
`; 89 | results += `
${error.error}
`; 90 | } 91 | } 92 | 93 | document.getElementById("resultsModalTitle").innerText = heading; 94 | document.getElementById("results-content").innerHTML = results; 95 | resultsModal.show(); 96 | } 97 | 98 | function displayStatus(data) { 99 | 100 | let heading = "API Key Status"; 101 | let results = `
Your key is valid until
`; 102 | results += `
${data.expiry}
`; 103 | 104 | document.getElementById("resultsModalTitle").innerText = heading; 105 | document.getElementById("results-content").innerHTML = results; 106 | resultsModal.show(); 107 | 108 | } -------------------------------------------------------------------------------- /07_handling_exceptions/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 9 | 10 | 11 | JSHint Front End 12 | 13 | 14 | 15 |
16 |
17 |
18 |

JSHinterface

19 |
20 |
21 | 22 |
23 |
24 |
25 |

26 |
27 |
28 |
29 |
30 |
31 | 32 |
33 | 34 | Mandatory if you are pasting code, but not used if you enter a URL. 35 |
36 |
37 |
38 | 39 |
40 | 41 | Enter a URL or paste JavaScript content below. 42 |
43 |
44 |
45 | 46 |
47 |
48 | 49 | 50 |
51 |
52 | 53 | 54 |
55 |
56 | 57 | 58 |
59 |
60 | 61 | 62 |
63 |
64 | 65 | 66 |
67 |
68 | 69 | 70 |
71 |
72 |
73 |
74 | 75 |
76 |
77 |
78 |
79 |
80 | 81 |
82 |
83 |
84 | 85 | 86 | 101 | 102 | 105 | 106 | 107 | 108 | --------------------------------------------------------------------------------