Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 7c6abf1

Browse files
committed
added Nobel Prize API lecture + code to week1
1 parent 8224b04 commit 7c6abf1

File tree

25 files changed

+35771
-0
lines changed

25 files changed

+35771
-0
lines changed

Week1/lecture/.eslintrc

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"commonjs": true,
5+
"es6": true,
6+
"node": true
7+
},
8+
"parserOptions": {
9+
"ecmaFeatures": {
10+
"jsx": true
11+
},
12+
"sourceType": "module"
13+
},
14+
"extends": ["eslint:recommended"],
15+
"rules": {
16+
"no-const-assign": "warn",
17+
"no-this-before-super": "warn",
18+
"no-undef": "warn",
19+
"no-unreachable": "warn",
20+
"no-unused-vars": "warn",
21+
"constructor-super": "warn",
22+
"valid-typeof": "warn",
23+
"no-var": "warn",
24+
"prefer-const": "warn",
25+
"no-multiple-empty-lines": "warn",
26+
"eol-last": ["error", "always"],
27+
"no-console": "off",
28+
"camelcase": "warn",
29+
"eqeqeq": [
30+
"error",
31+
"always",
32+
{
33+
"null": "ignore"
34+
}
35+
],
36+
"semi": ["warn", "always"]
37+
}
38+
}

Week1/lecture/.gitignore

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
8+
# Runtime data
9+
pids
10+
*.pid
11+
*.seed
12+
*.pid.lock
13+
14+
# Directory for instrumented libs generated by jscoverage/JSCover
15+
lib-cov
16+
17+
# Coverage directory used by tools like istanbul
18+
coverage
19+
20+
# nyc test coverage
21+
.nyc_output
22+
23+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
24+
.grunt
25+
26+
# Bower dependency directory (https://bower.io/)
27+
bower_components
28+
29+
# node-waf configuration
30+
.lock-wscript
31+
32+
# Compiled binary addons (http://nodejs.org/api/addons.html)
33+
build/Release
34+
35+
# Dependency directories
36+
node_modules/
37+
jspm_packages/
38+
39+
# Typescript v1 declaration files
40+
typings/
41+
42+
# Optional npm cache directory
43+
.npm
44+
45+
# Optional eslint cache
46+
.eslintcache
47+
48+
# Optional REPL history
49+
.node_repl_history
50+
51+
# Output of 'npm pack'
52+
*.tgz
53+
54+
# Yarn Integrity file
55+
.yarn-integrity
56+
57+
# dotenv environment variables file
58+
.env
59+

Week1/lecture/.vscode/settings.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"cSpell.words": [
3+
"firstname",
4+
"whiteframe"
5+
]
6+
}

Week1/lecture/1-callback/callback.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
'use strict';
2+
3+
function timerStopped() {
4+
console.log('timer stopped');
5+
}
6+
7+
function startTimer(duration, callback) {
8+
console.log('timer started');
9+
setTimeout(callback, duration);
10+
}
11+
12+
startTimer(2000, timerStopped);

Week1/lecture/10-xhr-base/app.js

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
'use strict';
2+
{
3+
const API = {
4+
endpoints: {
5+
laureate: 'http://api.nobelprize.org/v1/laureate.json?',
6+
prize: 'http://api.nobelprize.org/v1/prize.json?'
7+
},
8+
queries: [
9+
{
10+
description: 'All female laureates',
11+
endpoint: 'laureate',
12+
queryString: 'gender=female'
13+
}
14+
]
15+
};
16+
17+
const url = API.endpoints.laureate + API.queries[0].queryString;
18+
19+
const xhr = new XMLHttpRequest();
20+
xhr.open('GET', url);
21+
xhr.responseType = 'json';
22+
xhr.onreadystatechange = () => {
23+
if (xhr.readyState === 4) {
24+
if (xhr.status < 400) {
25+
console.log(xhr.response);
26+
} else {
27+
console.error(xhr.statusText);
28+
}
29+
}
30+
};
31+
xhr.send();
32+
}

Week1/lecture/10-xhr-base/index.html

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Nobel Prizes</title>
9+
</head>
10+
11+
<body>
12+
<div id="root"></div>
13+
<script src="app.js"></script>
14+
</body>
15+
16+
</html>

Week1/lecture/11-xhr-callback/app.js

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
'use strict';
2+
{
3+
const API = {
4+
endpoints: {
5+
laureate: 'http://api.nobelprize.org/v1/laureate.json?',
6+
prize: 'http://api.nobelprize.org/v1/prize.json?'
7+
},
8+
queries: [
9+
{
10+
description: 'All female laureates',
11+
endpoint: 'laureate',
12+
queryString: 'gender=female'
13+
}
14+
]
15+
};
16+
17+
function main() {
18+
const url = API.endpoints.laureate + API.queries[0].queryString;
19+
20+
fetchJSON(url, (err, data) => {
21+
if (err) {
22+
console.error(err.message);
23+
} else {
24+
console.log(data);
25+
}
26+
});
27+
}
28+
29+
function fetchJSON(url, cb) {
30+
const xhr = new XMLHttpRequest();
31+
xhr.open('GET', url);
32+
xhr.responseType = 'json';
33+
xhr.onreadystatechange = () => {
34+
if (xhr.readyState === 4) {
35+
if (xhr.status < 400) {
36+
cb(null, xhr.response);
37+
} else {
38+
cb(new Error(xhr.statusText));
39+
}
40+
}
41+
};
42+
xhr.send();
43+
}
44+
45+
window.onload = main;
46+
}
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Nobel Prizes</title>
9+
</head>
10+
11+
<body>
12+
<div id="root"></div>
13+
<script src="app.js"></script>
14+
</body>
15+
16+
</html>

Week1/lecture/12-xhr-render/app.js

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
'use strict';
2+
{
3+
const API = {
4+
endpoints: {
5+
laureate: 'http://api.nobelprize.org/v1/laureate.json?',
6+
prize: 'http://api.nobelprize.org/v1/prize.json?'
7+
},
8+
queries: [
9+
{
10+
description: 'All female laureates',
11+
endpoint: 'laureate',
12+
queryString: 'gender=female'
13+
}
14+
]
15+
};
16+
17+
function main() {
18+
const url = API.endpoints.laureate + API.queries[0].queryString;
19+
fetchJSON(url, (err, data) => {
20+
if (err) {
21+
console.error(err.message);
22+
return;
23+
}
24+
const root = document.getElementById('root');
25+
const pre = document.createElement('pre');
26+
root.appendChild(pre);
27+
pre.innerHTML = JSON.stringify(data, null, 2);
28+
});
29+
}
30+
31+
function fetchJSON(url, cb) {
32+
const xhr = new XMLHttpRequest();
33+
xhr.open('GET', url);
34+
xhr.responseType = 'json';
35+
xhr.onreadystatechange = () => {
36+
if (xhr.readyState === 4) {
37+
if (xhr.status < 400) {
38+
cb(null, xhr.response);
39+
} else {
40+
cb(new Error(xhr.statusText));
41+
}
42+
}
43+
};
44+
xhr.send();
45+
}
46+
47+
window.onload = main;
48+
}
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
8+
<title>Nobel Prizes</title>
9+
</head>
10+
11+
<body>
12+
<div id="root"></div>
13+
<script src="app.js"></script>
14+
</body>
15+
16+
</html>

Week1/lecture/13-xhr-html/index.html

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<html lang="en">
2+
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
8+
<link rel="stylesheet" href="style.css">
9+
<title>Nobel Prizes</title>
10+
</head>
11+
12+
<body>
13+
<div id="root">
14+
<div id="list-container">
15+
<div class="list-item">
16+
<table>
17+
<tbody>
18+
<tr>
19+
<td class="label">Name:</td>
20+
<td>Marie Curie, née Sklodowska </td>
21+
</tr>
22+
</tbody>
23+
</table>
24+
</div>
25+
</div>
26+
</div>
27+
</body>
28+
29+
</html>

0 commit comments

Comments
 (0)