Welcome to Fresh Products Store!
9 |
10 | {{#products}}
11 |
28 |
12 | 
13 |
25 |
26 | {{/products}}
27 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Lesson05/Activtiy06/build/js/viewer.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 |
3 | var _flashingLight = _interopRequireDefault(require("./flashingLight.js"));
4 |
5 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
6 |
7 | var slider = document.getElementById("brightnessSlider");
8 | var color = document.getElementById("color");
9 | var button = document.getElementById("build");
10 |
11 | button.onclick = function () {
12 | new _flashingLight["default"](true, slider.value, true);
13 | };
--------------------------------------------------------------------------------
/Lesson05/Activtiy06/src/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Activtiy06/src/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Activtiy06/src/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Activtiy06/src/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Activtiy06/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/Lesson05/Activtiy06/src/js/viewer.js:
--------------------------------------------------------------------------------
1 | import FlashingLight from './flashingLight.js';
2 |
3 | let slider = document.getElementById("brightnessSlider");
4 | let color = document.getElementById("color");
5 | let button = document.getElementById("build");
6 |
7 | button.onclick = function () {
8 | new FlashingLight(true, slider.value, true);
9 | }
10 |
--------------------------------------------------------------------------------
/Lesson05/Activtiy06/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require("path");
2 |
3 | module.exports = {
4 | mode: 'development',
5 | entry: "./build/js/viewer.js",
6 | output: {
7 | path: path.resolve(__dirname, "build"),
8 | filename: "bundle.js"
9 | }
10 | };
11 |
--------------------------------------------------------------------------------
/Lesson05/Exercise22/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise22/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise22/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise22/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise22/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | 
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Lesson05/Exercise22/js/light.js:
--------------------------------------------------------------------------------
1 | let light = {};
2 | light.state = true;
3 | light.level = 0.5;
4 |
5 | var log = function () {
6 | console.log(light);
7 | };
8 |
9 | export default log;
10 |
--------------------------------------------------------------------------------
/Lesson05/Exercise22/js/viewer.js:
--------------------------------------------------------------------------------
1 | import Light from './light.js';
2 |
3 | // Page elements and variables
4 | let bulb = document.getElementById("bulb");
5 | let slider = document.getElementById("brightnessSlider");
6 | let onImage = "images/bulb_on.png";
7 | let offImage = "images/bulb_off.png";
8 |
9 | light();
10 |
--------------------------------------------------------------------------------
/Lesson05/Exercise22/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "projs-l5",
3 | "version": "1.0.0",
4 | "description": "Sample code for Lesson 05 in Professional JavaScript.",
5 | "keywords": [
6 | "Packt",
7 | "JavaScript",
8 | "modules"
9 | ],
10 | "homepage": "https://github.com/TrainingByPackt/Professional-JavaScript",
11 | "bugs": {
12 | "url": "https://github.com/TrainingByPackt/Professional-JavaScript/issues",
13 | "email": "kirkins@gmail.com"
14 | },
15 | "license": "MIT",
16 | "author": "Philip Kirkbride",
17 | "repository": "https://github.com/TrainingByPackt/Professional-JavaScript",
18 | "scripts": {
19 | "start": "ws"
20 | },
21 | "devDependencies": {
22 | "local-web-server": "^2.6.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson05/Exercise23/number.js:
--------------------------------------------------------------------------------
1 | Number.prototype.double = function () {
2 | return this.valueOf()*2;
3 | }
4 |
5 | Number.prototype.square = function () {
6 | return this.valueOf()*this.valueOf();
7 | }
8 |
9 | Number.prototype.fibonacci = function () {
10 | function iterator(a, b, n) {
11 | return n == 0n ? b : iterator((a+b), a, (n-1n))
12 | }
13 | function fibonacci(n) {
14 | n = BigInt(n);
15 | return iterator(1n, 0n, n);
16 | }
17 | return fibonacci(this.valueOf());
18 | }
19 |
20 | Number.prototype.factorial = function () {
21 | factorial = (n) => {
22 | n = BigInt(n);
23 | return (n>1) ? n * factorial(n-1n) : n;
24 | }
25 | return factorial(this.valueOf());
26 | }
27 |
28 | let n = 100;
29 |
30 | console.log(
31 | "for number " + n +"\n",
32 | "double is " + n.double() + "\n",
33 | "square is " + n.square() + "\n",
34 | "fibonacci is " + n.fibonacci() + "\n",
35 | "factorial is " + n.factorial() + "\n"
36 | );
37 |
--------------------------------------------------------------------------------
/Lesson05/Exercise24/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise24/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise24/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise24/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise24/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Lesson05/Exercise24/js/light.js:
--------------------------------------------------------------------------------
1 | class Light {
2 | constructor(state, brightness) {
3 | // Check that inputs are the right types
4 | this.state = this.checkStateFormat(state);
5 | this.brightness = this.checkBrightnessFormat(brightness);
6 | this.createdAt = Date.now();
7 | }
8 |
9 | checkStateFormat(state) {
10 | // state must be true or false
11 | if(state) {
12 | return true;
13 | } else {
14 | return false;
15 | }
16 | }
17 |
18 | checkBrightnessFormat(brightness) {
19 | // brightness must be a number between 0.01 and 1
20 | if(isNaN(brightness)) {
21 | brightness = 1;
22 | } else if(brightness > 1) {
23 | brightness = 1;
24 | } else if(brightness < 0.01) {
25 | brightness = 0.01;
26 | }
27 | return brightness;
28 | }
29 |
30 | toggle() {
31 | this.state = !this.state;
32 | }
33 |
34 | test() {
35 | alert("state is " + this.state);
36 | }
37 | }
38 |
39 | export default Light;
40 |
--------------------------------------------------------------------------------
/Lesson05/Exercise24/js/viewer.js:
--------------------------------------------------------------------------------
1 | import Light from './light.js';
2 |
3 | // Page elements and variables
4 | let bulb = document.getElementById("bulb");
5 | let slider = document.getElementById("brightnessSlider");
6 | let onImage = "images/bulb_on.png";
7 | let offImage = "images/bulb_off.png";
8 |
9 | let light = new Light(true, 0.5);
10 |
11 | // Set image based on light state
12 | bulb.src = light.state ? onImage : offImage;
13 |
14 | // Set opacity based on brightness
15 | bulb.style.opacity = light.brightness;
16 |
17 | // Set slider value to brightness
18 | slider.value = light.brightness;
19 |
20 | bulb.onclick = function () {
21 | light.toggle();
22 | bulb.src = light.state ? onImage : offImage;
23 | }
24 |
25 | slider.onchange = function () {
26 | light.brightness = this.value;
27 | bulb.style.opacity = light.brightness;
28 | }
29 |
--------------------------------------------------------------------------------
/Lesson05/Exercise24/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "projs-l5",
3 | "version": "1.0.0",
4 | "description": "Sample code for Lesson 05 in Professional JavaScript.",
5 | "keywords": [
6 | "Packt",
7 | "JavaScript",
8 | "modules"
9 | ],
10 | "homepage": "https://github.com/TrainingByPackt/Professional-JavaScript",
11 | "bugs": {
12 | "url": "https://github.com/TrainingByPackt/Professional-JavaScript/issues",
13 | "email": "kirkins@gmail.com"
14 | },
15 | "license": "MIT",
16 | "author": "Philip Kirkbride",
17 | "repository": "https://github.com/TrainingByPackt/Professional-JavaScript",
18 | "scripts": {
19 | "start": "ws"
20 | },
21 | "devDependencies": {
22 | "local-web-server": "^2.6.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson05/Exercise25/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise25/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise25/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise25/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise25/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Lesson05/Exercise25/js/viewer.js:
--------------------------------------------------------------------------------
1 | import Light from './light.js';
2 |
3 | // Page elements and variables
4 | let bulb = document.getElementById("bulb");
5 | let slider = document.getElementById("brightnessSlider");
6 | let onImage = "images/bulb_on.png";
7 | let offImage = "images/bulb_off.png";
8 |
9 | let light = new Light(true, 0.5);
10 |
11 | // Set image based on light state
12 | bulb.src = light.getState() ? onImage : offImage;
13 |
14 | // Set opacity based on brightness
15 | bulb.style.opacity = light.getBrightness();
16 |
17 | // Set slider value to brightness
18 | slider.value = light.getBrightness();
19 |
20 | bulb.onclick = function () {
21 | light.toggle();
22 | bulb.src = light.getState() ? onImage : offImage;
23 | }
24 |
25 | slider.onchange = function () {
26 | light.setBrightness(this.value);
27 | bulb.style.opacity = light.getBrightness();
28 | }
29 |
--------------------------------------------------------------------------------
/Lesson05/Exercise25/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "projs-l5",
3 | "version": "1.0.0",
4 | "description": "Sample code for Lesson 05 in Professional JavaScript.",
5 | "keywords": [
6 | "Packt",
7 | "JavaScript",
8 | "modules"
9 | ],
10 | "homepage": "https://github.com/TrainingByPackt/Professional-JavaScript",
11 | "bugs": {
12 | "url": "https://github.com/TrainingByPackt/Professional-JavaScript/issues",
13 | "email": "kirkins@gmail.com"
14 | },
15 | "license": "MIT",
16 | "author": "Philip Kirkbride",
17 | "repository": "https://github.com/TrainingByPackt/Professional-JavaScript",
18 | "scripts": {
19 | "start": "ws"
20 | },
21 | "devDependencies": {
22 | "local-web-server": "^2.6.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson05/Exercise26/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise26/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise26/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise26/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise26/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Lesson05/Exercise26/js/colorLight.js:
--------------------------------------------------------------------------------
1 | import Light from './light.js';
2 |
3 | let privateVars = new WeakMap();
4 |
5 | class ColorLight extends Light {
6 |
7 | constructor(state=false, brightness=100, color="ffffff") {
8 | super(state, brightness);
9 |
10 | // Create info object
11 | let info = {"color": this.checkColorFormat(color)};
12 |
13 | // Save info into privateVars
14 | privateVars.set(this, info);
15 | }
16 |
17 | checkColorFormat(color) {
18 | // color must be a valid hex color
19 | var isHexColor = /^#[0-9A-F]{6}$/i.test('#'+color);
20 | if(!isHexColor) {
21 | // if invalid make white
22 | color = "ffffff";
23 | }
24 | return color;
25 | }
26 |
27 | getColor() {
28 | let info = privateVars.get(this);
29 | return info.color;
30 | }
31 |
32 | setColor(color) {
33 | let info = privateVars.get(this);
34 | info.color = this.checkColorFormat(color);
35 | privateVars.set(this, info);
36 | }
37 |
38 | }
39 |
40 | export default ColorLight;
41 |
--------------------------------------------------------------------------------
/Lesson05/Exercise26/js/viewer.js:
--------------------------------------------------------------------------------
1 | import ColorLight from './colorLight.js';
2 | import changeColor from './__extra__/changeColor.js';
3 |
4 | // Page elements and variables
5 | let bulb = document.getElementById("bulb");
6 | let slider = document.getElementById("brightnessSlider");
7 | let onImage = "images/bulb_on.png";
8 | let offImage = "images/bulb_off.png";
9 |
10 | let light = new ColorLight(true, 1, "61AD85");
11 |
12 | // Set image based on light state
13 | bulb.src = light.getState() ? onImage : offImage;
14 |
15 | // Set opacity based on brightness
16 | bulb.style.opacity = light.getBrightness();
17 |
18 | // Set slider value to brightness
19 | slider.value = light.getBrightness();
20 |
21 | bulb.onclick = function () {
22 | light.toggle();
23 | bulb.src = light.getState() ? onImage : offImage;
24 | }
25 |
26 | slider.onchange = function () {
27 | light.setBrightness(this.value);
28 | bulb.style.opacity = light.getBrightness();
29 | }
30 |
31 | // Update image color
32 | changeColor(light.getColor());
33 |
--------------------------------------------------------------------------------
/Lesson05/Exercise26/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "projs-l5",
3 | "version": "1.0.0",
4 | "description": "Sample code for Lesson 05 in Professional JavaScript.",
5 | "keywords": [
6 | "Packt",
7 | "JavaScript",
8 | "modules"
9 | ],
10 | "homepage": "https://github.com/TrainingByPackt/Professional-JavaScript",
11 | "bugs": {
12 | "url": "https://github.com/TrainingByPackt/Professional-JavaScript/issues",
13 | "email": "kirkins@gmail.com"
14 | },
15 | "license": "MIT",
16 | "author": "Philip Kirkbride",
17 | "repository": "https://github.com/TrainingByPackt/Professional-JavaScript",
18 | "scripts": {
19 | "start": "ws"
20 | },
21 | "devDependencies": {
22 | "local-web-server": "^2.6.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson05/Exercise27/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise27/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise27/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise27/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise27/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Lesson05/Exercise27/js/viewer.js:
--------------------------------------------------------------------------------
1 | import ColorLight from './colorLight.js';
2 |
3 | let slider = document.getElementById("brightnessSlider");
4 | let color = document.getElementById("color");
5 | let button = document.getElementById("build");
6 |
7 | button.onclick = function () {
8 | new ColorLight(true, slider.value, color.value);
9 | }
10 |
--------------------------------------------------------------------------------
/Lesson05/Exercise27/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "projs-l5",
3 | "version": "1.0.0",
4 | "description": "Sample code for Lesson 05 in Professional JavaScript.",
5 | "keywords": [
6 | "Packt",
7 | "JavaScript",
8 | "modules"
9 | ],
10 | "homepage": "https://github.com/TrainingByPackt/Professional-JavaScript",
11 | "bugs": {
12 | "url": "https://github.com/TrainingByPackt/Professional-JavaScript/issues",
13 | "email": "kirkins@gmail.com"
14 | },
15 | "license": "MIT",
16 | "author": "Philip Kirkbride",
17 | "repository": "https://github.com/TrainingByPackt/Professional-JavaScript",
18 | "scripts": {
19 | "start": "ws"
20 | },
21 | "devDependencies": {
22 | "local-web-server": "^2.6.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson05/Exercise28/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": ["@babel/preset-env"]
3 | }
4 |
--------------------------------------------------------------------------------
/Lesson05/Exercise28/build/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise28/build/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise28/build/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise28/build/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise28/build/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Lesson05/Exercise28/build/js/viewer.js:
--------------------------------------------------------------------------------
1 | "use strict";
2 |
3 | var _colorLight = _interopRequireDefault(require("./colorLight.js"));
4 |
5 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
6 |
7 | var slider = document.getElementById("brightnessSlider");
8 | var color = document.getElementById("color");
9 | var button = document.getElementById("build");
10 |
11 | button.onclick = function () {
12 | new _colorLight["default"](true, slider.value, color.value);
13 | };
--------------------------------------------------------------------------------
/Lesson05/Exercise28/src/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise28/src/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/Exercise28/src/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/Exercise28/src/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/Exercise28/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Lesson05/Exercise28/src/js/viewer.js:
--------------------------------------------------------------------------------
1 | import ColorLight from './colorLight.js';
2 |
3 | let slider = document.getElementById("brightnessSlider");
4 | let color = document.getElementById("color");
5 | let button = document.getElementById("build");
6 |
7 | button.onclick = function () {
8 | new ColorLight(true, slider.value, color.value);
9 | }
10 |
--------------------------------------------------------------------------------
/Lesson05/Exercise28/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require("path");
2 |
3 | module.exports = {
4 | mode: 'development',
5 | entry: "./build/js/viewer.js",
6 | output: {
7 | path: path.resolve(__dirname, "build"),
8 | filename: "bundle.js"
9 | }
10 | };
11 |
--------------------------------------------------------------------------------
/Lesson05/start/images/bulb_off.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/start/images/bulb_off.png
--------------------------------------------------------------------------------
/Lesson05/start/images/bulb_on.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson05/start/images/bulb_on.png
--------------------------------------------------------------------------------
/Lesson05/start/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/Lesson05/start/js/viewer.js:
--------------------------------------------------------------------------------
1 | // Page elements and variables
2 | let bulb = document.getElementById("bulb");
3 | let slider = document.getElementById("brightnessSlider");
4 | let onImage = "images/bulb_on.png";
5 | let offImage = "images/bulb_off.png";
6 |
--------------------------------------------------------------------------------
/Lesson05/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "projs-l5",
3 | "version": "1.0.0",
4 | "description": "Sample code for Lesson 05 in Professional JavaScript.",
5 | "keywords": [
6 | "Packt",
7 | "JavaScript",
8 | "modules"
9 | ],
10 | "homepage": "https://github.com/TrainingByPackt/Professional-JavaScript",
11 | "bugs": {
12 | "url": "https://github.com/TrainingByPackt/Professional-JavaScript/issues",
13 | "email": "kirkins@gmail.com"
14 | },
15 | "license": "MIT",
16 | "author": "Philip Kirkbride",
17 | "repository": "https://github.com/TrainingByPackt/Professional-JavaScript",
18 | "scripts": {
19 | "start": "ws"
20 | },
21 | "devDependencies": {
22 | "local-web-server": "^2.6.1"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson06/Activity07/result/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["airbnb-base", "prettier"],
3 | "parserOptions": {
4 | "ecmaVersion": 2018,
5 | "sourceType": "module"
6 | },
7 | "env": {
8 | "browser": true,
9 | "node": true,
10 | "es6": true,
11 | "mocha": true,
12 | "jest": true
13 | },
14 | "plugins": [],
15 | "rules": {
16 | "no-unused-vars": [
17 | "error",
18 | {
19 | "vars": "local",
20 | "args": "none"
21 | }
22 | ],
23 | "no-plusplus": "off",
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/Lesson06/Activity07/result/.huskyrc:
--------------------------------------------------------------------------------
1 | {
2 | "hooks": {
3 | "pre-commit": "npm run lint && npm test"
4 | }
5 | }
6 |
--------------------------------------------------------------------------------
/Lesson06/Activity07/result/.prettierignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | build
3 | dist
4 |
--------------------------------------------------------------------------------
/Lesson06/Activity07/result/images/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson06/Activity07/result/images/screenshot.png
--------------------------------------------------------------------------------
/Lesson06/Activity07/result/jest-puppeteer.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | server: {
3 | command: 'npm start',
4 | port: 8080,
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/Lesson06/Activity07/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "before",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "dependencies": {
7 | "http-server": "^0.11.1"
8 | },
9 | "devDependencies": {
10 | "eslint": "^5.16.0",
11 | "eslint-config-airbnb-base": "^13.1.0",
12 | "eslint-config-prettier": "^4.3.0",
13 | "eslint-plugin-import": "^2.17.3",
14 | "eslint-plugin-jest": "^22.6.4",
15 | "husky": "^2.4.0",
16 | "jest": "^24.8.0",
17 | "jest-puppeteer": "^4.2.0",
18 | "prettier": "^1.18.1",
19 | "puppeteer": "^1.17.0"
20 | },
21 | "scripts": {
22 | "start": "http-server",
23 | "lint": "prettier --write js/*.js && eslint js/*.js",
24 | "test": "jest"
25 | },
26 | "jest": {
27 | "preset": "jest-puppeteer"
28 | },
29 | "author": "",
30 | "license": "ISC"
31 | }
32 |
--------------------------------------------------------------------------------
/Lesson06/Activity07/start/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Activity07/start/images/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson06/Activity07/start/images/screenshot.png
--------------------------------------------------------------------------------
/Lesson06/Activity07/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "before",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "dependencies": {
7 | "http-server": "^0.11.1"
8 | },
9 | "devDependencies": {},
10 | "scripts": {
11 | "start": "http-server"
12 | },
13 | "author": "Philip Kirkbride",
14 | "license": "ISC"
15 | }
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise29/result/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["airbnb-base", "prettier"],
3 | "parserOptions": {
4 | "ecmaVersion": 2018,
5 | "sourceType": "module"
6 | },
7 | "env": {
8 | "browser": true,
9 | "node": true,
10 | "es6": true,
11 | "mocha": true,
12 | "jest": true,
13 | },
14 | "plugins": [],
15 | "rules": {
16 | "no-unused-vars": [
17 | "error",
18 | {
19 | "vars": "local",
20 | "args": "none"
21 | }
22 | ],
23 | "no-plusplus": "off",
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/Lesson06/Exercise29/result/.prettierignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | build
3 | dist
4 |
--------------------------------------------------------------------------------
/Lesson06/Exercise29/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "lint",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "lint": "prettier --write src/**/*.js && eslint src/*.js"
9 | },
10 | "keywords": [],
11 | "author": "",
12 | "license": "ISC",
13 | "devDependencies": {
14 | "eslint": "^5.16.0",
15 | "eslint-config-airbnb-base": "^13.1.0",
16 | "eslint-config-prettier": "^4.3.0",
17 | "eslint-plugin-import": "^2.17.3",
18 | "eslint-plugin-jest": "^22.6.4",
19 | "prettier": "^1.17.1"
20 | }
21 | }
22 |
--------------------------------------------------------------------------------
/Lesson06/Exercise29/result/src/square.js:
--------------------------------------------------------------------------------
1 | const square = x => x * x;
2 | console.log(square(5));
3 |
--------------------------------------------------------------------------------
/Lesson06/Exercise30/result/__test__/math.test.js:
--------------------------------------------------------------------------------
1 | const math = require('./../src/math.js');
2 |
3 | test('Check that square of 5 is 25', () => {
4 | expect(math.square(5)).toBe(25);
5 | });
6 |
--------------------------------------------------------------------------------
/Lesson06/Exercise30/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jest1",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest"
8 | },
9 | "keywords": [],
10 | "author": "",
11 | "license": "ISC",
12 | "devDependencies": {
13 | "jest": "^24.8.0"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise30/result/src/math.js:
--------------------------------------------------------------------------------
1 | const square = (x) => x * x;
2 | const cube = (x) => x * x * x;
3 | const add = (x, y) => x + y;
4 | const subtract = (x, y) => x - y;
5 | const multiply = (x, y) => x * y;
6 |
7 | const math = {
8 | square,
9 | cube,
10 | add,
11 | subtract,
12 | multiply
13 | }
14 |
15 | module.exports = math;
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise30/start/src/math.js:
--------------------------------------------------------------------------------
1 | const square = (x) => x + x;
2 | const cube = (x) => x * x * x;
3 | const add = (x, y) => x + y;
4 | const subtract = (x, y) => x - y;
5 | const multiply = (x, y) => x * y;
6 |
7 | const math = {
8 | square,
9 | cube,
10 | add,
11 | subtract,
12 | multiply
13 | }
14 |
15 | module.exports = math;
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise31/result/__test__/math.test.js:
--------------------------------------------------------------------------------
1 | const math = require('./../src/math.js');
2 |
3 | test('Check that square of 5 is 25', () => {
4 | expect(math.square(5)).toBe(25);
5 | });
6 |
7 | test('check that square of result from 1 + 1 is 4', () => {
8 | const start = new Date();
9 | expect(math.square(math.add(1,1))).toBe(4);
10 | expect(new Date() - start).toBeLessThan(5000);
11 | });
12 |
13 | test('check that square of result from 1 - 1 is 0', () => {
14 | expect(math.square(math.subtract(1,1))).toBe(0);
15 | });
16 |
17 | test('check that square of result from 1 + 1 is 4', () => {
18 | expect(math.subtract(math.cube(5), 5)).toBe(120);
19 | });
20 |
--------------------------------------------------------------------------------
/Lesson06/Exercise31/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jest1",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest"
8 | },
9 | "keywords": [],
10 | "author": "",
11 | "license": "ISC",
12 | "devDependencies": {
13 | "jest": "^24.8.0"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise31/result/src/math.js:
--------------------------------------------------------------------------------
1 | const square = (x) => x * x;
2 | const cube = (x) => x * x * x;
3 | const add = (x, y) => x + y;
4 | const subtract = (x, y) => x - y;
5 | const multiply = (x, y) => x * y;
6 |
7 | const math = {
8 | square,
9 | cube,
10 | add,
11 | subtract,
12 | multiply
13 | }
14 |
15 | module.exports = math;
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise31/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jest1",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "jest"
8 | },
9 | "keywords": [],
10 | "author": "",
11 | "license": "ISC",
12 | "devDependencies": {
13 | "jest": "^24.8.0"
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise31/start/src/math.js:
--------------------------------------------------------------------------------
1 | const square = (x) => x * x;
2 | const cube = (x) => x * x * x;
3 | const add = (x, y) => x + y;
4 | const subtract = (x, y) => x - y;
5 | const multiply = (x, y) => x * y;
6 |
7 | const math = {
8 | square,
9 | cube,
10 | add,
11 | subtract,
12 | multiply
13 | }
14 |
15 | module.exports = math;
16 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/result/__tests__/fib.test.js:
--------------------------------------------------------------------------------
1 | const fastFib = require('./../fastFib');
2 | const slowFib = require('./../slowFib');
3 |
4 | test('Fast way of getting Fibonacci of 44', () => {
5 | const start = new Date();
6 | expect(fastFib(44)).toBe(701408733);
7 | expect(new Date() - start).toBeLessThan(5000);
8 | });
9 |
10 | test('Timer - Slow way of getting Fibonacci of 44', () => {
11 | const start = new Date();
12 | expect(slowFib(44)).toBe(701408733);
13 | expect(new Date() - start).toBeLessThan(5000);
14 | });
15 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/result/fastFib.js:
--------------------------------------------------------------------------------
1 | function fibonacciIterator(a, b, n) {
2 | return n == 0 ? b : fibonacciIterator((a+b), a, (n-1));
3 | }
4 |
5 | function fibonacci(n) {
6 | return fibonacciIterator(1, 0, n);
7 | }
8 |
9 | module.exports = fibonacci;
10 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "tmp",
3 | "version": "1.0.0",
4 | "main": "index.js",
5 | "license": "MIT",
6 | "dependencies": {
7 | "jest": "^24.8.0"
8 | },
9 | "scripts": {
10 | "test": "jest"
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/result/slowFib.js:
--------------------------------------------------------------------------------
1 | function fib(n) {
2 | return (n<=1) ? n : fib(n - 1) + fib(n - 2);
3 | }
4 |
5 | module.exports = fib;
6 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/start/fastFib.js:
--------------------------------------------------------------------------------
1 | function fibonacciIterator(a, b, n) {
2 | return n == 0 ? b : fibonacciIterator((a+b), a, (n-1));
3 | }
4 |
5 | function fibonacci(n) {
6 | return fibonacciIterator(1, 0, n);
7 | }
8 |
9 | module.exports = fibonacci;
10 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "tmp",
3 | "version": "1.0.0",
4 | "main": "index.js",
5 | "license": "MIT",
6 | "dependencies": {
7 | "jest": "^24.8.0"
8 | },
9 | "scripts": {
10 | "test": "jest"
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/Lesson06/Exercise32/start/slowFib.js:
--------------------------------------------------------------------------------
1 | function fib(n) {
2 | return (n<=1) ? n : fib(n - 1) + fib(n - 2);
3 | }
4 |
5 | module.exports = fib;
6 |
--------------------------------------------------------------------------------
/Lesson06/Exercise33/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Exercise33/result/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Exercise33/result/__tests__/test.test.js:
--------------------------------------------------------------------------------
1 | describe('Calculator', () => {
2 | beforeAll(async () => {
3 | await page.goto('http://localhost:8080/index.html')
4 | })
5 |
6 | it('Check that 5 times 5 is 25', async () => {
7 | const five = await page.$("#five");
8 | const multiply = await page.$("#multiply");
9 | const equals = await page.$("#equals");
10 | await five.click();
11 | await multiply.click();
12 | await five.click();
13 | await equals.click();
14 | const result = await page.$eval('#screen', e => e.innerText);
15 | expect(result).toMatch('25');
16 | })
17 | })
18 |
--------------------------------------------------------------------------------
/Lesson06/Exercise33/result/images/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson06/Exercise33/result/images/screenshot.png
--------------------------------------------------------------------------------
/Lesson06/Exercise33/result/jest-puppeteer.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | server: {
3 | command: 'npm start',
4 | port: 8080,
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/Lesson06/Exercise33/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "after",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "jest-puppeteer.config.js",
6 | "dependencies": {
7 | "http-server": "^0.11.1"
8 | },
9 | "devDependencies": {
10 | "jest": "^24.8.0",
11 | "jest-puppeteer": "^4.2.0",
12 | "puppeteer": "^1.17.0"
13 | },
14 | "scripts": {
15 | "test": "jest",
16 | "start": "http-server"
17 | },
18 | "jest": {
19 | "preset": "jest-puppeteer"
20 | },
21 | "author": "Philip Kirkbride",
22 | "license": "ISC"
23 | }
24 |
--------------------------------------------------------------------------------
/Lesson06/Exercise33/start/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Exercise33/start/images/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TrainingByPackt/Professional-JavaScript/58c2f50e3764b8d1aae52fca6dd2a7313461cd68/Lesson06/Exercise33/start/images/screenshot.png
--------------------------------------------------------------------------------
/Lesson06/Exercise33/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "before",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "dependencies": {
7 | "http-server": "^0.11.1"
8 | },
9 | "devDependencies": {},
10 | "scripts": {
11 | "start": "http-server"
12 | },
13 | "keywords": [],
14 | "author": "",
15 | "license": "ISC"
16 | }
17 |
--------------------------------------------------------------------------------
/Lesson06/Exercise34/result/README.md:
--------------------------------------------------------------------------------
1 | Due to this exercise using a feature of git itself, the result cannot be saved to a repository.
2 |
--------------------------------------------------------------------------------
/Lesson06/Exercise34/start/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["airbnb-base", "prettier"],
3 | "parserOptions": {
4 | "ecmaVersion": 2018,
5 | "sourceType": "module"
6 | },
7 | "env": {
8 | "browser": true,
9 | "node": true,
10 | "es6": true,
11 | "mocha": true,
12 | "jest": true,
13 | },
14 | "plugins": [],
15 | "rules": {
16 | "no-unused-vars": [
17 | "error",
18 | {
19 | "vars": "local",
20 | "args": "none"
21 | }
22 | ],
23 | "no-plusplus": "off",
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/Lesson06/Exercise34/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "lint",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "lint": "prettier --write src/**/*.js && eslint src/*.js",
9 | "prettier": "prettier --write src/**/*.js"
10 | },
11 | "keywords": [],
12 | "author": "",
13 | "license": "ISC",
14 | "devDependencies": {
15 | "eslint": "^5.16.0",
16 | "eslint-config-airbnb-base": "^13.1.0",
17 | "eslint-config-prettier": "^4.3.0",
18 | "eslint-plugin-import": "^2.17.3",
19 | "eslint-plugin-jest": "^22.6.4",
20 | "prettier": "^1.17.1"
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/Lesson06/Exercise34/start/src/js.js:
--------------------------------------------------------------------------------
1 | const square = x => x * x;
2 | console.log(square(5));
3 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/result/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["airbnb-base", "prettier"],
3 | "parserOptions": {
4 | "ecmaVersion": 2018,
5 | "sourceType": "module"
6 | },
7 | "env": {
8 | "browser": true,
9 | "node": true,
10 | "es6": true,
11 | "mocha": true,
12 | "jest": true,
13 | },
14 | "plugins": [],
15 | "rules": {
16 | "no-unused-vars": [
17 | "error",
18 | {
19 | "vars": "local",
20 | "args": "none"
21 | }
22 | ],
23 | "no-plusplus": "off",
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/result/.huskyrc:
--------------------------------------------------------------------------------
1 | {
2 | "hooks": {
3 | "pre-commit": "npm run lint"
4 | }
5 | }
6 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "lint",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "lint": "prettier --write src/**/*.js && eslint src/*.js",
9 | "prettier": "prettier --write src/**/*.js"
10 | },
11 | "keywords": [],
12 | "author": "",
13 | "license": "ISC",
14 | "devDependencies": {
15 | "eslint": "^5.16.0",
16 | "eslint-config-airbnb-base": "^13.1.0",
17 | "eslint-config-prettier": "^4.3.0",
18 | "eslint-plugin-import": "^2.17.3",
19 | "eslint-plugin-jest": "^22.6.4",
20 | "husky": "^2.3.0",
21 | "prettier": "^1.17.1"
22 | }
23 | }
24 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/result/src/js.js:
--------------------------------------------------------------------------------
1 | const square = x => x * x;
2 | console.log(square(5));
3 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/start/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["airbnb-base", "prettier"],
3 | "parserOptions": {
4 | "ecmaVersion": 2018,
5 | "sourceType": "module"
6 | },
7 | "env": {
8 | "browser": true,
9 | "node": true,
10 | "es6": true,
11 | "mocha": true,
12 | "jest": true,
13 | },
14 | "plugins": [],
15 | "rules": {
16 | "no-unused-vars": [
17 | "error",
18 | {
19 | "vars": "local",
20 | "args": "none"
21 | }
22 | ],
23 | "no-plusplus": "off",
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "lint",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1",
8 | "lint": "prettier --write src/**/*.js && eslint src/*.js",
9 | "prettier": "prettier --write src/**/*.js"
10 | },
11 | "keywords": [],
12 | "author": "",
13 | "license": "ISC",
14 | "devDependencies": {
15 | "eslint": "^5.16.0",
16 | "eslint-config-airbnb-base": "^13.1.0",
17 | "eslint-config-prettier": "^4.3.0",
18 | "eslint-plugin-import": "^2.17.3",
19 | "eslint-plugin-jest": "^22.6.4",
20 | "prettier": "^1.17.1"
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/Lesson06/Exercise35/start/src/js.js:
--------------------------------------------------------------------------------
1 | const square = x => x * x;
2 | console.log(square(5));
3 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Exercise36/result/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Exercise36/result/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Score: 0
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/result/jest-puppeteer.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | server: {
3 | command: 'npm start',
4 | port: 8080,
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/result/js/questions.js:
--------------------------------------------------------------------------------
1 | export let questions = {
2 | "1": {
3 | "text": "5+5",
4 | "wrong": ["5", "15", "20"],
5 | "right": "10"
6 | },
7 | "2": {
8 | "text": "100-64",
9 | "wrong": ["77", "50", "20"],
10 | "right": "36"
11 | },
12 | "3": {
13 | "text": "3*3",
14 | "wrong": ["20", "23", "11"],
15 | "right": "9"
16 | },
17 | "4": {
18 | "text": "33*3",
19 | "wrong": ["111", "112", "119"],
20 | "right": "99"
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/result/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "before",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "dependencies": {
7 | "http-server": "^0.11.1"
8 | },
9 | "devDependencies": {
10 | "jest": "^24.9.0",
11 | "jest-puppeteer": "^4.3.0",
12 | "puppeteer": "^1.19.0"
13 | },
14 | "scripts": {
15 | "start": "http-server",
16 | "test": "jest"
17 | },
18 | "jest": {
19 | "preset": "jest-puppeteer"
20 | },
21 | "keywords": [],
22 | "author": "",
23 | "license": "ISC"
24 | }
25 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/start/.gitignore:
--------------------------------------------------------------------------------
1 | # Windows image file caches
2 | Thumbs.db
3 | ehthumbs.db
4 |
5 | # Folder config file
6 | Desktop.ini
7 |
8 | # Recycle Bin used on file shares
9 | $RECYCLE.BIN/
10 |
11 | # Windows Installer files
12 | *.cab
13 | *.msi
14 | *.msm
15 | *.msp
16 |
17 | # Windows shortcuts
18 | *.lnk
19 |
20 | # =========================
21 | # Operating System Files
22 | # =========================
23 |
24 | # OSX
25 | # =========================
26 |
27 | .DS_Store
28 | .AppleDouble
29 | .LSOverride
30 |
31 | # Thumbnails
32 | ._*
33 |
34 | # Files that might appear in the root of a volume
35 | .DocumentRevisions-V100
36 | .fseventsd
37 | .Spotlight-V100
38 | .TemporaryItems
39 | .Trashes
40 | .VolumeIcon.icns
41 |
42 | # Directories potentially created on remote AFP share
43 | .AppleDB
44 | .AppleDesktop
45 | Network Trash Folder
46 | Temporary Items
47 | .apdisk
48 | .idea
--------------------------------------------------------------------------------
/Lesson06/Exercise36/start/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Score: 0
11 |
12 |
13 |
14 |
15 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/start/js/questions.js:
--------------------------------------------------------------------------------
1 | export let questions = {
2 | "1": {
3 | "text": "5+5",
4 | "wrong": ["5", "15", "20"],
5 | "right": "10"
6 | },
7 | "2": {
8 | "text": "100-64",
9 | "wrong": ["77", "50", "20"],
10 | "right": "36"
11 | },
12 | "3": {
13 | "text": "3*3",
14 | "wrong": ["20", "23", "11"],
15 | "right": "9"
16 | },
17 | "4": {
18 | "text": "33*3",
19 | "wrong": ["111", "112", "119"],
20 | "right": "99"
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/Lesson06/Exercise36/start/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "before",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "dependencies": {
7 | "http-server": "^0.11.1"
8 | },
9 | "scripts": {
10 | "start": "http-server"
11 | },
12 | "keywords": [],
13 | "author": "",
14 | "license": "ISC"
15 | }
16 |
--------------------------------------------------------------------------------
/Lesson07/Exercise37/Exercise37.js:
--------------------------------------------------------------------------------
1 | let exampleArray1 = [];
2 | Array.isArray(exampleArray1);
3 |
4 | // Or
5 | let exampleArray2 = new Array();
6 | Array.isArray(exampleArray2);
7 |
8 | // Or
9 | let exampleArray3 = [];
10 | typeof exampleArray3
11 |
12 | // Or
13 | let exampleArray4 = new Array(6);
14 | console.log(exampleArray4);
15 |
16 | // Or
17 | let singers = new Array(6).fill('miku');
18 |
19 | singers[0] = 'miku';
20 | console.log(singers);
21 |
22 | singers[3] = 'luka';
23 | console.log(singers[1]);
24 |
25 | singers[singers.length - 1] = 'rin';
26 | console.log(singers);
27 |
--------------------------------------------------------------------------------
/Lesson07/Exercise38/Exercise38.js:
--------------------------------------------------------------------------------
1 | let singers = [];
2 | singers.push('miku');
3 | console.log(singers);
4 |
5 | let food = new Array(3)
6 | food.push('burger');
7 | console.log(food);
8 |
9 | singers.push('me');
10 | console.log(singers);
11 |
12 | singers.pop();
13 | console.log(singers);
14 |
15 | singers.unshift('rin')
16 |
17 | console.log(singers);
18 |
--------------------------------------------------------------------------------
/Lesson07/Exercise39/Exercise39.js:
--------------------------------------------------------------------------------
1 | let foods = [];
2 |
3 | foods.push('burger');
4 | foods.push('fries');
5 | foods.push('wings');
6 |
7 | console.log(foods.indexOf('burger'));
8 |
9 | console.log(foods.length);
10 |
11 | let position = foods.indexOf('burger');
12 | foods.splice(position, 1);
13 |
14 | console.log(foods);
15 |
--------------------------------------------------------------------------------
/Lesson07/Exercise40/Exercise40.js:
--------------------------------------------------------------------------------
1 | // 1
2 | let singers = [];
3 | // 2
4 | singers.push({ name: 'miku', age: 16 });
5 | // 3
6 | singers[0].name = 'Hatsune Miku'
7 | console.log(singers);
8 | // 4
9 | singers[0].birthday = 'August 31';
10 | console.log(singers);
11 | // 5
12 | console.log(singers[0].name);
13 | const propertyName = 'name';
14 | console.log(singers[0][propertyName]);
15 | // 6
16 | let myConsole = { name: 'PS4', color: 'black', price: 499, library: []};
17 | // 7
18 | console.log(Object.keys(myConsole));
19 | // 8
20 | if (myConsole.ramSize) {
21 | console.log('ram size is defined.');
22 | }
23 |
--------------------------------------------------------------------------------
/Lesson07/Exercise41/Exercise41.js:
--------------------------------------------------------------------------------
1 | function betterStringify(item, propertyMap) {
2 | let output = {};
3 | // Cherry pick all the property we want and store it in the output
4 | propertyMap.forEach((key) => {
5 | if (item[key]) {
6 | output[key] = item[key];
7 | }
8 | });
9 | return JSON.stringify(output);
10 | }
11 |
12 | const singer = {
13 | name: 'Hatsune Miku',
14 | age: 16,
15 | birthday: 'August 31',
16 | birthplace: 'Sapporo, Japan',
17 | songList: [
18 | 'World is mine',
19 | 'Tell your world',
20 | 'Melt'
21 | ]
22 | }
23 |
24 | console.log(betterStringify(singer, ['name', 'birthday']));
25 |
--------------------------------------------------------------------------------
/Lesson07/Exercise42/Exercise42.js:
--------------------------------------------------------------------------------
1 | // 1
2 | const userInfo = ['John', 'chef', 34];
3 | // 2
4 | let name, age, job;
5 | // 3
6 | [name, job, age] = userInfo;
7 | // 4
8 | console.log(name);
9 | console.log(job);
10 | console.log(age);
11 | // 5
12 | [name, ,age] = userInfo
13 |
--------------------------------------------------------------------------------
/Lesson07/Exercise43/Exercise43.js:
--------------------------------------------------------------------------------
1 | // 1
2 | const userInfo = { name: 'John', job: 'chef', age: 34 };
3 | // 2
4 | let name, job;
5 | // 3
6 | ({ name, job } = userInfo);
7 | // 4
8 | console.log(name);
9 | console.log(job);
10 | // 5
11 | const userInfo = ['John', 'chef', 34];
12 | let [ name, , age] = userInfo;
13 | console.log(name);
14 | console.log(age);
15 | // 6
16 | const userInfoObj = { name: 'John', job: 'chef', age: 34 };
17 | let { job } userInfoObj;
18 | console.log(job);
19 |
--------------------------------------------------------------------------------
/Lesson07/Exercise44/Exercise44.js:
--------------------------------------------------------------------------------
1 | // 1
2 | const userInfo = ['John', 'chef', 34];
3 |
4 | // 2
5 | function printUser(name, job, age) {
6 | console.log(name + ' is working as ' + job + ' and is ' + age + ' years old');
7 | }
8 |
9 | // 3
10 | printUser(...userInfo)
11 |
12 | // 4
13 | const detailedInfo = ['male', ...userInfo, 'July 5']
14 | console.log(detailedInfo)
15 |
16 | // 5
17 | let detailedInfoCopy = [ ...detailedInfo ];
18 | console.log(detailedInfoCopy)
19 |
20 | // 6
21 | const userRequest = { name: 'username', type: 'update', data: 'newname'}
22 |
23 | //7
24 | const newObj = { ...userRequest }
25 | console.log(newObj)
26 |
27 | //8
28 | const detailedRequestObj = { data: new Date(), new: true, ...userRequest}
29 | console.log(detailedRequestObj)
30 |
31 |
--------------------------------------------------------------------------------
/Lesson07/Exercise45/Exercise45.js:
--------------------------------------------------------------------------------
1 | function Food(name, calories, cost) {
2 | this.name = name;
3 | this.calories = calories;
4 | this.cost = cost;
5 | }
6 | Food.prototype.description = function () {
7 | return this.name + ' calories: ' + this.calories;
8 | }
9 | let burger = new Food('burger', 1000, 9);
10 | console.log(burger.description());
--------------------------------------------------------------------------------
/Lesson07/Exercise46/Exercise46.js:
--------------------------------------------------------------------------------
1 | class Food {
2 | constructor(name, calories, cost) {
3 | this.name = name;
4 | this.calories = calories;
5 | this.cost = cost;
6 | }
7 | static getCalories(food) {
8 | return food.calories
9 | }
10 | description() {
11 | return this.name + ' calories: ' + this.calories;
12 | }
13 | }
14 |
15 | // Food('burger', 1000, 9);
16 | // TypeError: Class constructor Food2 cannot be invoked without 'new'
17 | let friedChicken = new Food('fried chicken', 520, 5);
18 | console.log(friedChicken.description());
19 |
20 | console.log(Food.getCalories(friedChicken)); /// 520
21 |
--------------------------------------------------------------------------------
/Lesson07/Exercise50/Exercise50.js:
--------------------------------------------------------------------------------
1 | const foods = ['sushi', 'tofu', 'fried chicken'];
2 | foods.join(', ');
3 |
4 | function eat_food(food) {
5 | console.log('I am eating ' + food);
6 | }
7 |
8 | function eat_food(food) {
9 | console.log('I am eating ' + food);
10 | }
11 |
12 | for(let i = 0; i < foods.length; i++) {
13 | eat_food(foods[i]);
14 | }
15 |
16 | foods.forEach(eat_food);
17 |
18 | const nutrition = [100, 50, 400];
19 | const foodInfo = foods.map((food, index) => {
20 | return {
21 | name: food,
22 | calories: nutrition[index]
23 | };
24 | });
25 | console.log(foodInfo);
--------------------------------------------------------------------------------
/Lesson07/Exercise51/Exercise51.js:
--------------------------------------------------------------------------------
1 | let profiles = [
2 | 'Michael Scott',
3 | 'Jim Halpert',
4 | 'Dwight Shrute',
5 | 'Random User',
6 | 'Hatsune Miku',
7 | 'Rin Kagamine'
8 | ];
9 | let hasJim = profiles.includes('Jim Halpert');
10 | console.log(hasJim);
11 |
12 | profiles = [
13 | { name: 'Michael Scott', age: 42 },
14 | { name: 'Jim Halpert', age: 27},
15 | { name: 'Dwight Shrute', age: 37 },
16 | { name: 'Random User', age: 10 },
17 | { name: 'Hatsune Miku', age: 16 },
18 | { name: 'Rin Kagamine', age: 14 }
19 | ];
20 |
21 | hasJim = profiles.includes({ name: 'Jim Halpert', age: 27});
22 | console.log(hasJim);
23 |
24 | hasJim = !!profiles.find((profile) => {
25 | return profile.name === 'Jim Halpert';
26 | }).length;
27 | console.log(hasJim);
28 |
29 | const adults = profiles.filter((profile) => {
30 | return profile.age > 18;
31 | });
32 | console.log(adults);
33 |
--------------------------------------------------------------------------------
/Lesson07/Exercise52/Exercise52.js:
--------------------------------------------------------------------------------
1 | const numbers = [ 20, 1, 3, 55, 100, 2];
2 | numbers.sort();
3 | console.log(numbers);
4 |
5 | function compareNumber(a, b) {
6 | return a - b;
7 | }
8 | numbers.sort(compareNumber);
9 | console.log(numbers);
10 |
11 | const profiles = [
12 | { name: 'Michael Scott', age: 42 },
13 | { name: 'Jim Halpert', age: 27},
14 | { name: 'Dwight Shrute', age: 37 },
15 | { name: 'Random User', age: 10 },
16 | { name: 'Hatsune Miku', age: 16 },
17 | { name: 'Rin Kagamine', age: 14 }
18 | ];
19 | profiles.sort();
20 | console.log(profiles);
21 |
22 | function compareAge(a, b) {
23 | return a.age - b.age;
24 | }
25 |
26 | profiles.sort(compareAge);
27 | console.log(profiles);
28 |
--------------------------------------------------------------------------------
/Lesson07/Exercise53/Exercise53.js:
--------------------------------------------------------------------------------
1 | const cart = [];
2 |
3 | cart.push({ name: 'CD', price: 12.00, amount: 2 });
4 | cart.push({ name: 'Book', price: 45.90, amount: 1 });
5 | cart.push({ name: 'Headphones', price: 5.99, amount: 3 });
6 | cart.push({ name: 'Coffee', price: 12.00, amount: 2 });
7 | cart.push({ name: 'Mug', price: 15.45, amount: 1 });
8 | cart.push({ name: 'Sugar', price: 5.00, amount: 1 });
9 |
10 | let total = 0;
11 | cart.forEach((item) => {
12 | total += item.price * item.amount;
13 | });
14 | console.log('Total amount: ' + total);
15 |
16 | function priceReducer (accumulator, currentValue) {
17 | return accumulator += currentValue.price * currentValue.amount;
18 | }
19 |
20 | total = cart.reduce(priceReducer, 0);
21 | console.log('Total amount: ' + total);
22 |
--------------------------------------------------------------------------------
/Lesson07/Exercise54/Exercise54.js:
--------------------------------------------------------------------------------
1 | const map = new Map();
2 | const key1 = 'key1';
3 | const key2 = { name: 'John', age: 18 };
4 | const key3 = Map;
5 | map.set(key1, 'value for key1');
6 | map.set(key2, 'value for key2');
7 | map.set(key3, 'value for key3');
8 | console.log(map.get(key1));
9 | console.log(map.get(key2));
10 | console.log(map.get(key3));
11 |
12 | console.log(map.get({ name: 'John', age: 18 }));
13 |
14 | map.forEach((value, key) => {
15 | console.log('the value for key: ' + key + ' is ' + value);
16 | });
17 | console.log(map.keys());
18 | console.log(map.values());
19 | console.log(map.has('non exist')); // false
--------------------------------------------------------------------------------
/Lesson07/Exercise55/Exercise55.js:
--------------------------------------------------------------------------------
1 | const planets = [
2 | 'Mercury',
3 | 'Uranus',
4 | 'Mars',
5 | 'Venus',
6 | 'Neptune',
7 | 'Saturn',
8 | 'Mars',
9 | 'Jupiter',
10 | 'Earth',
11 | 'Saturn'
12 | ];
13 | const planetSet = new Set(planets);
14 | console.log(planetSet.values());
15 |
16 | planetSet.add('Venus');
17 | planetSet.add('Kepler-440b');
18 | console.log(planetSet.size);
19 |
20 | planetSet.clear();
21 | console.log(planetSet);
22 |
--------------------------------------------------------------------------------
/Lesson07/Exercise56/Exercise56.js:
--------------------------------------------------------------------------------
1 | let planet = 'Earth';
2 | let sentence = `We are on the planet ${planet}`;
3 | console.log(sentence);
4 |
5 | console.log(sentence.split(' '));
6 |
7 | sentence = sentence.replace('Earth', 'Venus');
8 | console.log(sentence);
9 | console.log(sentence.includes('Mars'));
10 | sentence.toUpperCase();
11 | sentence.toLowerCase();
12 | sentence.charAt(0); // returns W
13 | console.log(sentence.length);
14 |
--------------------------------------------------------------------------------
/Lesson07/Exercise57/Exercise57.js:
--------------------------------------------------------------------------------
1 | function generateRandomString(length) {
2 | const characters = [];
3 | const characterSet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
4 | for (let i = 0; i < length; i++) {
5 | characters.push(characterSet.charAt(generateRandomNumber(0, characterSet.length)));
6 | }
7 | return characters.join('');
8 | }
9 |
10 | function generateRandomNumber(min, max) {
11 | return Math.floor(Math.random() * (max - min + 1)) + min;
12 | }
13 |
14 | console.log(generateRandomString(16));
15 |
16 | console.log(Math.PI);
17 |
18 | function circleArea(radius) {
19 | return Math.pow(radius, 2) * Math.PI;
20 | }
21 |
22 | const now = new Date();
23 | console.log(now);
24 |
25 | const past = new Date('August 31, 2007 00:00:00');
26 | console.log(past);
27 |
28 | console.log(past.getFullYear());
29 | console.log(past.getMonth());
30 | console.log(past.getDate());
31 |
32 | console.log(past.toString());
33 |
34 | console.log(Math.floor(Date.now() / 1000));
--------------------------------------------------------------------------------
/Lesson07/Exercise58/Exercise58.js:
--------------------------------------------------------------------------------
1 | let symbol1 = Symbol();
2 | let symbol2 = Symbol('symbol');
3 | console.log(symbol1 === symbol2);
4 | console.log(symbol1 === Symbol('symbol'));
5 | const testObj = {};
6 | testObj.name = 'test object';
7 | testObj.included = 'this will be included';
8 | const symbolKey = Symbol();
9 | testObj[symbolKey] = 'this will be hidden';
10 |
11 | console.log(Object.keys(testObj));
12 | console.log(testObj[Symbol()]); // Will return undefined
13 | console.log(testObj[symbolKey]); // Will return our hidden property
14 |
15 | const anotherSymbolKey = Symbol.for('key');
16 | const copyOfAnotherSymbol = Symbol.for('key');
17 | testObj[anotherSymbolKey] = 'another key';
18 | console.log(testObj[copyOfAnotherSymbol]);
19 |
--------------------------------------------------------------------------------
/Lesson07/Exercise59/Exercise59.js:
--------------------------------------------------------------------------------
1 | function range(max) {
2 | return {
3 | *[Symbol.iterator]() {
4 | for (let i = 0; i < max; i++) {
5 | yield i;
6 | }
7 | }
8 | };
9 | }
10 |
11 | for (let value of range(10)) {
12 | console.log(value);
13 | }
14 |
15 | function* gen() {
16 | yield 1;
17 | }
18 |
19 | const generator = gen();
20 |
21 | console.log(generator.next());
22 | console.log(generator.next());
23 | console.log(generator.next());
--------------------------------------------------------------------------------
/Lesson07/Exercise60/Exercise60.js:
--------------------------------------------------------------------------------
1 | const simpleObject = {};
2 |
3 | const handlers = {
4 | get: (object, prop) => {
5 | return 'values are private';
6 | },
7 | set: (object, prop, value) => {
8 | if (prop === 'id') {
9 | if (!Number.isNaN(value)) {
10 | throw new TypeError('The id needs to be a number');
11 | }
12 | }
13 | }
14 | }
15 |
16 | const proxiedValue = new Proxy(simpleObject, handlers);
17 |
18 | proxiedValue.key1 = 'value1';
19 |
20 | console.log(proxiedValue.key1);
21 | console.log(proxiedValue.keyDoesntExist);
22 |
23 | proxiedValue.id = 'not an id'
--------------------------------------------------------------------------------
/Lesson08/Exercise62/Exercise62.js:
--------------------------------------------------------------------------------
1 | const myPromise = new Promise((resolve) => {
2 | resolve(12);
3 | }).then((value) => {
4 | console.log(value);
5 | });
6 | const myPromiseValue = Promise.resolve(12);
7 |
8 | const myRejectedPromise = Promise.reject(new Error('rejected'));
9 |
10 | myRejectedPromise.catch((error) => {
11 | console.log(error);
12 | });
13 |
14 | function wait(seconds) {
15 | return new Promise((resolve) => {
16 | setTimeout(() => {
17 | resolve(seconds);
18 | }, seconds * 1000);
19 | })
20 | }
21 | function waitCallback(seconds, callback) {
22 | setTimeout(callback, seconds * 1000);
23 | }
24 |
25 | wait(2).then((seconds) => {
26 | console.log('i waited ' + seconds + ' seconds');
27 | });
28 | wait(2)
29 | .then(() => wait(2))
30 | .then(() => {
31 | console.log('i waited 4 seconds');
32 | });
33 |
--------------------------------------------------------------------------------
/Lesson08/Exercise65/Exercise65.js:
--------------------------------------------------------------------------------
1 | function getConcertList() {
2 | return Promise.resolve([
3 | 'Magical Mirai 2018',
4 | 'Magical Mirai 2019'
5 | ]);
6 | }
7 |
8 | function getPrice(i) {
9 | const prices = [9900, 9000];
10 | return Promise.resolve(prices[i]);
11 | }
12 |
13 | function buggyCode() {
14 | return Promise.reject(new Error('computer: dont feel like working today'));
15 | }
16 |
17 | async function printList() {
18 | const concerts = await getConcertList();
19 | const prices = await Promise.all(concerts.map((c, i) => getPrice(i)));
20 | try {
21 | await buggyCode();
22 | } catch (error) {
23 | console.log('computer produced error');
24 | console.log(error);
25 | }
26 | return {
27 | concerts,
28 | prices
29 | };
30 | }
31 |
32 | printList().then(() => {
33 | console.log('I am going to both of them.')
34 | });
35 |
--------------------------------------------------------------------------------
/Lesson09/Exercise67/Exercise67.js:
--------------------------------------------------------------------------------
1 | const EventEmitter = require('events');
2 |
3 | const emitter = new EventEmitter();
4 |
5 | emitter.emit('my-event', { value: 'event value' });
6 |
7 | emitter.on('my-event', (value) => {
8 | console.log(value);
9 | });
10 |
11 | emitter.emit('my-event', { value: 'another value' });
12 |
13 | emitter.on('my-event', (value) => {
14 | console.log('i am handling it again');
15 | });
16 | emitter.emit('my-event', { value: 'new value' });
17 |
18 | function handleEvent(event) {
19 | console.log('i am handling event type: ', event.type);
20 | }
21 |
22 | emitter.on('event-with-type', handleEvent);
23 |
24 | emitter.emit('event-with-type', { type: 'sync' });
25 | emitter.removeListener('event-with-type', handleEvent);
26 | emitter.emit('event-with-type', { type: 'sync2' });
--------------------------------------------------------------------------------
/Lesson10/Activity15/activity-on-checkout-prop-start.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/Lesson10/Examples/03-higher-order/example-9-function-comp-react.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 |
4 | function Hello({who}) {
5 | return Hello {who}
; 6 | } 7 | 8 | const App = () => ( 9 | <> 10 |Hello micro!
Run this withnode example-2-micro-hello.js';
5 | });
6 |
7 | server.listen(3000, () => {
8 | console.log('Listening on http://localhost:3000');
9 | });
10 |
--------------------------------------------------------------------------------
/Lesson10/Examples/04-composition/example-3-request-timer.js:
--------------------------------------------------------------------------------
1 | const micro = require('micro');
2 |
3 | const hello = () =>
4 | 'Hello micro!
Run this withnode example-3-request-timer.js';
5 |
6 | const timer = fn => async (req, res) => {
7 | console.time('request');
8 | const value = await fn(req, res);
9 | console.timeEnd('request');
10 | return value;
11 | };
12 |
13 | const server = micro(timer(hello));
14 |
15 | server.listen(3000, () => {
16 | console.log('Listening on http://localhost:3000');
17 | });
18 |
--------------------------------------------------------------------------------
/Lesson10/Examples/04-composition/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "04-composition",
3 | "version": "1.0.0",
4 | "author": "Hugo Di Francesco",
5 | "license": "MIT",
6 | "dependencies": {
7 | "express": "^4.17.1",
8 | "micro": "^9.3.4"
9 | }
10 | }
11 |
--------------------------------------------------------------------------------
/Lesson10/Examples/05-immutability-side-effects/example-1-redux-action-creator.js:
--------------------------------------------------------------------------------
1 | const ADD_PRODUCT = 'ADD_PRODUCT';
2 |
3 | function addProduct(newProduct) {
4 | return {
5 | type: ADD_PRODUCT,
6 | newProduct
7 | };
8 | }
9 |
--------------------------------------------------------------------------------
/Lesson10/Examples/05-immutability-side-effects/example-2-immutable-map-filter-reduce.js:
--------------------------------------------------------------------------------
1 | // Node.js built-in
2 | const assert = require('assert').strict;
3 |
4 | const initial = [
5 | {
6 | count: 1,
7 | name: 'Shampoo'
8 | },
9 | {
10 | count: 2,
11 | name: 'Soap'
12 | }
13 | ];
14 |
15 | function checkNoMutation() {
16 | assert.deepStrictEqual(initial, [
17 | {
18 | count: 1,
19 | name: 'Shampoo'
20 | },
21 | {
22 | count: 2,
23 | name: 'Soap'
24 | }
25 | ]);
26 | }
27 |
28 | checkNoMutation();
29 |
30 | assert.deepStrictEqual(
31 | initial.map(item => item.name),
32 | ['Shampoo', 'Soap'],
33 | 'demo map'
34 | );
35 | checkNoMutation();
36 |
37 | assert(
38 | initial.map(item => item.count).reduce((acc, curr) => acc + curr) === 3,
39 | 'demo map reduce'
40 | );
41 | checkNoMutation();
42 |
43 | assert.deepStrictEqual(
44 | initial.filter(item => item.count > 1),
45 | [{count: 2, name: 'Soap'}],
46 | 'demo filter'
47 | );
48 | checkNoMutation();
49 |
--------------------------------------------------------------------------------
/Lesson10/Examples/05-immutability-side-effects/example-5-immutable-object-freeze.js:
--------------------------------------------------------------------------------
1 | // Node.js built-in
2 | const assert = require('assert').strict;
3 |
4 | const myProduct = Object.freeze({
5 | name: 'Special Sauce',
6 | price: 1999
7 | });
8 |
9 | console.assert(myProduct.name === 'Special Sauce', 'no change to properties');
10 | console.assert(myProduct.price === 1999, 'no change to properties');
11 |
12 | assert.throws(() => {
13 | 'use strict';
14 | myProduct.category = 'condiments';
15 | }, 'writing to an existing property is an error in strict mode');
16 |
17 | assert.doesNotThrow(() => {
18 | myProduct.category = 'condiments';
19 | }, 'writing to an existing property is fine in non strict mode');
20 |
21 | assert.throws(() => {
22 | 'use strict';
23 | myProduct.name = 'Super Special Sauce';
24 | }, 'writing a new property is an error in strict mode');
25 |
26 | assert.doesNotThrow(() => {
27 | myProduct.name = 'Super Special Sauce';
28 | }, 'writing a new property is fine in non strict mode');
29 |
--------------------------------------------------------------------------------
/Lesson10/Examples/05-immutability-side-effects/example-6-component-did-mount-request.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/Lesson10/Examples/05-immutability-side-effects/example-6-component-did-mount-request.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom';
3 |
4 | class App extends React.Component {
5 | constructor() {
6 | super();
7 | this.state = {};
8 | }
9 |
10 | componentDidMount() {
11 | fetch('https://hello-world-micro.glitch.me')
12 | .then(response => {
13 | if (response.ok) {
14 | return response.text();
15 | }
16 | })
17 | .then(data => {
18 | this.setState({
19 | message: data
20 | });
21 | });
22 | }
23 |
24 | render() {
25 | return (
26 |
27 |
29 | );
30 | }
31 | }
32 |
33 | ReactDOM.render(Message: {this.state.message}
28 |
21 |
23 | );
24 | };
25 |
26 | ReactDOM.render(Message: {message}
22 |