diff --git a/step2-01/exercise/index.html b/step2-01/exercise/index.html
new file mode 100644
index 0000000..454cef5
--- /dev/null
+++ b/step2-01/exercise/index.html
@@ -0,0 +1,6 @@
+
+
+
+
+
+
diff --git a/step2-01/exercise/src/async/index.ts b/step2-01/exercise/src/async/index.ts
new file mode 100644
index 0000000..c4a34fe
--- /dev/null
+++ b/step2-01/exercise/src/async/index.ts
@@ -0,0 +1,12 @@
+async function fetchSomething() {
+ const response = await fetch('http://localhost:3000/hello');
+ return await response.text();
+}
+
+// Async functions always returns Promise
+fetchSomething().then(text => {
+ console.log('hello ' + text);
+});
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/exercise/src/generics/index.ts b/step2-01/exercise/src/generics/index.ts
new file mode 100644
index 0000000..95e5093
--- /dev/null
+++ b/step2-01/exercise/src/generics/index.ts
@@ -0,0 +1,23 @@
+// Generics for classes
+class Stack {
+ private data: T[] = [];
+
+ push(item: T) {
+ this.data.push(item);
+ }
+ pop(): T {
+ return this.data.pop();
+ }
+}
+
+const numberStack = new Stack();
+const stringStack = new Stack();
+
+// Generics for functions
+function reverse(arg: T[]): T[] {
+ // TODO: implement the logic to reverse the array
+ return arg;
+}
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/exercise/src/index.tsx b/step2-01/exercise/src/index.tsx
new file mode 100644
index 0000000..41d949e
--- /dev/null
+++ b/step2-01/exercise/src/index.tsx
@@ -0,0 +1,19 @@
+// Interesting Typescript Topics
+
+// types
+import './types';
+
+// interface
+import './interfaces';
+
+// modularity
+import './modules';
+
+// generics
+import './generics';
+
+// await / async
+import './async';
+
+// spread syntax
+import './spread';
diff --git a/step2-01/exercise/src/interfaces/index.ts b/step2-01/exercise/src/interfaces/index.ts
new file mode 100644
index 0000000..88e2f17
--- /dev/null
+++ b/step2-01/exercise/src/interfaces/index.ts
@@ -0,0 +1,22 @@
+interface Car {
+ make: string;
+ model: string;
+}
+
+class MyCar implements Car {
+ make: 'Honda';
+ model: 'Accord';
+}
+
+const myCar: Car = {
+ make: 'Honda',
+ model: 'Accord'
+};
+
+// Interface as Functions
+interface InterestingFn {
+ (someArgs: string): number;
+}
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/exercise/src/modules/default.ts b/step2-01/exercise/src/modules/default.ts
new file mode 100644
index 0000000..6a9f1db
--- /dev/null
+++ b/step2-01/exercise/src/modules/default.ts
@@ -0,0 +1,3 @@
+export default class DefaultClass {
+ hello = 'world';
+}
diff --git a/step2-01/exercise/src/modules/index.ts b/step2-01/exercise/src/modules/index.ts
new file mode 100644
index 0000000..fb47500
--- /dev/null
+++ b/step2-01/exercise/src/modules/index.ts
@@ -0,0 +1,19 @@
+import { namedConst, namedFn, namedObj, namedConstBracket, namedConst as c } from './named';
+import * as named from './named';
+
+// Print out the exports
+console.log(namedConst);
+console.log(c);
+console.log(namedFn());
+console.log(namedObj);
+console.log(namedConstBracket);
+
+// Print out exports through module level import
+console.log(named.namedConst);
+console.log(named.namedFn());
+console.log(named.namedObj);
+console.log(named.namedConstBracket);
+
+import DefaultClass from './default';
+
+console.log(new DefaultClass().hello);
diff --git a/step2-01/exercise/src/modules/named.ts b/step2-01/exercise/src/modules/named.ts
new file mode 100644
index 0000000..3560907
--- /dev/null
+++ b/step2-01/exercise/src/modules/named.ts
@@ -0,0 +1,12 @@
+export const namedConst = 5;
+
+export function namedFn() {
+ return 5;
+}
+
+export const namedObj = {
+ hello: 'world'
+};
+
+const namedConstBracket = 10;
+export { namedConstBracket };
diff --git a/step2-01/exercise/src/spread/index.ts b/step2-01/exercise/src/spread/index.ts
new file mode 100644
index 0000000..addce19
--- /dev/null
+++ b/step2-01/exercise/src/spread/index.ts
@@ -0,0 +1,15 @@
+// Destructuring
+var [x, y, ...rest] = [1, 2, 3, 4];
+console.log(x, y, rest); // 1,2,[3,4]
+
+// Array assignment
+var list = [1, 2];
+list = [...list, 3, 4];
+console.log(list); // [1,2,3,4]
+
+// Object assignment
+const point2D = { x: 1, y: 2 };
+const point3D = { ...point2D, z: 3 };
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/exercise/src/types/index.ts b/step2-01/exercise/src/types/index.ts
new file mode 100644
index 0000000..a89f240
--- /dev/null
+++ b/step2-01/exercise/src/types/index.ts
@@ -0,0 +1,55 @@
+// Basic Types
+let isDone: boolean = false;
+let decimal: number = 6;
+let color: string = 'blue';
+let sky: string = `the sky is ${color}`;
+
+// Function Types
+type FibFn = (n: number) => number;
+
+// Object Types
+type Obj = {
+ [key: string]: string;
+};
+
+// Object with Specified Keys
+type Specific1 = {
+ foo: string;
+ bar: number;
+ common: string;
+};
+
+type Specific2 = {
+ alice: string;
+ bob: number;
+ common: number;
+};
+
+// composition
+type typeofObj = {
+ foo: string;
+ bar: number;
+ obj: Specific1;
+};
+
+// union, intersection
+type Union = Specific1 | Specific2;
+type Intersection = Specific1 & Specific2;
+
+// casting
+let choose1 = { common: '5' };
+
+// string literal union
+type CatStatus = 'alive' | 'dead' | 'both';
+
+// Classes
+class Animal {}
+
+// Illustration purposes only
+// In real apps, avoid inheritance if possible
+// noted exception: React.Component with react@<16.8.0
+class Cat extends Animal {}
+class Dog extends Animal {}
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/src/async/index.ts b/step2-01/src/async/index.ts
index bc9d239..c4a34fe 100644
--- a/step2-01/src/async/index.ts
+++ b/step2-01/src/async/index.ts
@@ -7,3 +7,6 @@ async function fetchSomething() {
fetchSomething().then(text => {
console.log('hello ' + text);
});
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/src/generics/index.ts b/step2-01/src/generics/index.ts
index eed6a06..95e5093 100644
--- a/step2-01/src/generics/index.ts
+++ b/step2-01/src/generics/index.ts
@@ -18,3 +18,6 @@ function reverse(arg: T[]): T[] {
// TODO: implement the logic to reverse the array
return arg;
}
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/src/interfaces/index.ts b/step2-01/src/interfaces/index.ts
index 9037376..88e2f17 100644
--- a/step2-01/src/interfaces/index.ts
+++ b/step2-01/src/interfaces/index.ts
@@ -17,3 +17,6 @@ const myCar: Car = {
interface InterestingFn {
(someArgs: string): number;
}
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/src/spread/index.ts b/step2-01/src/spread/index.ts
index dccb3d7..addce19 100644
--- a/step2-01/src/spread/index.ts
+++ b/step2-01/src/spread/index.ts
@@ -10,3 +10,6 @@ console.log(list); // [1,2,3,4]
// Object assignment
const point2D = { x: 1, y: 2 };
const point3D = { ...point2D, z: 3 };
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/step2-01/src/types/index.ts b/step2-01/src/types/index.ts
index d25ab32..a89f240 100644
--- a/step2-01/src/types/index.ts
+++ b/step2-01/src/types/index.ts
@@ -50,3 +50,6 @@ class Animal {}
// noted exception: React.Component with react@<16.8.0
class Cat extends Animal {}
class Dog extends Animal {}
+
+// adding an export to turn this into a "module"
+export default {};
diff --git a/webpack.config.js b/webpack.config.js
index ca5b598..fb25eed 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,5 +1,3 @@
-// @ts-check
-
const path = require('path');
const fs = require('fs');
@@ -8,22 +6,26 @@ const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const entries = {};
-function getEntryPoint(entry) {
- if (entry.includes('step') || entry.includes('playground')) {
- for (let suffix of ['.js', '.jsx', '.ts', '.tsx']) {
- if (fs.existsSync(`./${entry}/src/index${suffix}`)) {
- return `./${entry}/src/index${suffix}`;
+function* getEntryPoint(step) {
+ if (step.includes('step') || step.includes('playground')) {
+ for (let prefix of ['', 'demo/', 'exercise/']) {
+ for (let suffix of ['.js', '.jsx', '.ts', '.tsx']) {
+ const entryRequest = `./${step}/${prefix}src/index${suffix}`;
+ if (fs.existsSync(entryRequest)) {
+ yield entryRequest;
+ }
}
}
}
+
return false;
}
-fs.readdirSync('./').filter(entry => {
- const entryPoint = getEntryPoint(entry);
-
- if (entryPoint) {
- entries[entry] = entryPoint;
+fs.readdirSync('./').filter(step => {
+ for (let entryPoint of getEntryPoint(step)) {
+ if (entryPoint) {
+ entries[entryPoint.replace(/\/src\/index.*/, '').replace(/^\.\//, '')] = entryPoint;
+ }
}
});