| dist.sh | |
| # If the directory, `dist`, doesn't exist, create `dist` | |
| stat dist || mkdir dist | |
| # Archive artifacts | |
| zip dist/$npm_package_name.zip -r dist package.json package-lock.json | |
| package.json | |
| "scripts": { |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title></title> | |
| <meta name="author" content=""> | |
| <meta name="description" content=""> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <script src="https://cdn.jsdelivr.net/npm/hls.js"></script> | |
| <script src="https://unpkg.com/plyr@3"></script> | |
| <script src="./script.js"></script> | |
| <div class="container"> | |
| Try adjust different video quality to see it yourself | |
| <video controls crossorigin playsinline > | |
| <source | |
| type="application/x-mpegURL" | |
| src="https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8" |
| module.exports = { | |
| entry: { | |
| main: path.resolve(__dirname, 'src/index.js'), | |
| ProductList: path.resolve(__dirname, 'src/ProductList/ProductList.js'), | |
| ProductPage: path.resolve(__dirname, 'src/ProductPage/ProductPage.js'), | |
| Icon: path.resolve(__dirname, 'src/Icon/Icon.js'), | |
| }, | |
| output: { | |
| path: path.resolve(__dirname, 'dist'), |
#Understanding closures, callbacks and promises
For a code newbie like myself, callbacks, closures and promises are scary JavaScript concepts.
10 months into my full-time dev career, and I would struggle to explain these words to a peer.
So I decided it was time to face my fears, and try to get my head around each concept.
Here are the notes from my initial reading. I'll continue to refine them as my understanding improves.
| // Shadow DOM - is an internal DOM of your component that is defined by you (as a creator of the component) | |
| // and hidden from an end-user. For example: | |
| @Component({ | |
| selector: 'some-component', | |
| template: ` | |
| <h1>I am Shadow DOM!</h1> | |
| <h2>Nice to meet you :)</h2> | |
| <ng-content></ng-content> | |
| `; |
| import {HttpClientModule} from '@angular/common/http'; | |
| @NgModule({ | |
| declarations: [ | |
| AppComponent | |
| ], | |
| imports: [ | |
| BrowserModule, | |
| HttpClientModule | |
| ], |