├── .gitignore ├── README.md ├── ajax-requests ├── README.md ├── bears.json ├── index.js └── package.json ├── async-js-with-promises ├── README.md ├── bears.txt ├── fetch.js ├── fish.txt ├── index.js └── package.json ├── beginning-client-server-javascript-with-io-node ├── README.md ├── index.js └── package.json ├── content-security-policy ├── .gitignore ├── README.md ├── index.css ├── index.html ├── index.js ├── package.json └── server.js ├── creating-desktop-apps-with-electron ├── README.md ├── app.js ├── index.html ├── index.js └── package.json ├── css-selector-precedence ├── README.md ├── index.html ├── index.js └── package.json ├── debugging-javascript ├── README.md ├── index.js ├── lib │ ├── get-bears.js │ └── lots.js └── package.json ├── dom-event-listeners ├── README.md ├── index.js └── package.json ├── drawing-animating-svgs ├── README.md ├── index.html ├── index.js └── package.json ├── easier-webgl-shaders-stackgl ├── README.md ├── index.js └── package.json ├── electron-webpack-vuejs ├── .gitignore ├── README.md ├── package.json ├── src │ ├── index.html │ ├── main │ │ └── index.js │ └── renderer │ │ ├── App.vue │ │ └── index.js └── webpack.config.js ├── ember-computed-properties ├── .bowerrc ├── .editorconfig ├── .ember-cli ├── .gitignore ├── .jshintrc ├── .travis.yml ├── .watchmanconfig ├── README.md ├── app │ ├── app.js │ ├── components │ │ ├── .gitkeep │ │ └── bear-list.js │ ├── controllers │ │ └── .gitkeep │ ├── helpers │ │ └── .gitkeep │ ├── index.html │ ├── models │ │ └── .gitkeep │ ├── router.js │ ├── routes │ │ ├── .gitkeep │ │ └── application.js │ ├── styles │ │ └── app.css │ └── templates │ │ ├── application.hbs │ │ └── components │ │ ├── .gitkeep │ │ └── bear-list.hbs ├── bower.json ├── config │ └── environment.js ├── ember-cli-build.js ├── package.json ├── public │ ├── bears.json │ ├── crossdomain.xml │ └── robots.txt ├── testem.json ├── tests │ ├── .jshintrc │ ├── helpers │ │ ├── resolver.js │ │ └── start-app.js │ ├── index.html │ ├── integration │ │ └── components │ │ │ └── bear-list-test.js │ ├── test-helper.js │ └── unit │ │ ├── .gitkeep │ │ └── routes │ │ └── application-test.js └── vendor │ └── .gitkeep ├── ember-fundamentals ├── .bowerrc ├── .editorconfig ├── .ember-cli ├── .gitignore ├── .jshintrc ├── .travis.yml ├── .watchmanconfig ├── README.md ├── app │ ├── app.js │ ├── components │ │ ├── .gitkeep │ │ └── bear-list.js │ ├── controllers │ │ ├── .gitkeep │ │ └── application.js │ ├── helpers │ │ └── .gitkeep │ ├── index.html │ ├── models │ │ └── .gitkeep │ ├── router.js │ ├── routes │ │ ├── .gitkeep │ │ └── application.js │ ├── styles │ │ └── app.css │ └── templates │ │ ├── application.hbs │ │ └── components │ │ ├── .gitkeep │ │ └── bear-list.hbs ├── bower.json ├── config │ └── environment.js ├── ember-cli-build.js ├── package.json ├── public │ ├── bears.json │ ├── crossdomain.xml │ └── robots.txt ├── testem.json ├── tests │ ├── .jshintrc │ ├── helpers │ │ ├── resolver.js │ │ └── start-app.js │ ├── index.html │ ├── integration │ │ └── components │ │ │ └── bear-list-test.js │ ├── test-helper.js │ └── unit │ │ ├── .gitkeep │ │ ├── controllers │ │ └── application-test.js │ │ └── routes │ │ └── application-test.js └── vendor │ └── .gitkeep ├── essential-es6-es2015 ├── README.md ├── index.js └── package.json ├── getting-started-with-browserify ├── README.md ├── app.js ├── bundle.js ├── buttons │ └── button.js ├── index.html └── package.json ├── getting-started-with-electron-1.0 ├── README.md ├── bear.html ├── index.html ├── index.js ├── main.js └── package.json ├── getting-started-with-virtual-dom ├── README.md ├── index.js └── package.json ├── getting-started-with-vuejs ├── App.vue ├── BearList.vue ├── README.md ├── index.html ├── index.js └── package.json ├── getting-started-with-webpack ├── README.md ├── base.css ├── bear.css ├── bear.js ├── index.html ├── index.js ├── package.json └── webpack.config.js ├── how-to-make-chrome-extensions ├── README.md └── bear │ ├── background.js │ ├── content.js │ ├── manifest.json │ ├── popup.html │ └── popup.js ├── intro-to-leveldb ├── README.md ├── index.js └── package.json ├── intro-to-webgl-and-shaders ├── README.md ├── index.js └── package.json ├── javascript-filereader ├── README.md ├── bear.jpg ├── bears.csv ├── index.html ├── index.js └── package.json ├── javascript-generators ├── README.md ├── big.file ├── index.js ├── package.json └── uppercase.file ├── javascript-modules ├── README.md ├── index.js ├── lib │ └── bears.js └── package.json ├── javascript-mutation-observer ├── README.md ├── bears.js ├── index.html ├── index.js ├── package.json └── sizer.js ├── javascript-prototypal-inheritance ├── README.md ├── index.js └── package.json ├── javascript-prototype-fun ├── README.md ├── bear.js ├── index.js └── package.json ├── javascript-proxy ├── README.md ├── array.js ├── index.js ├── package.json └── person.js ├── js-arrays ├── README.md ├── index.js └── package.json ├── js-timers ├── README.md ├── bear.jpg ├── index.js └── package.json ├── learn-to-yo-yo ├── README.md ├── index.js └── package.json ├── learning-js-functions ├── README.md ├── index.js └── package.json ├── mastering-callbacks ├── README.md ├── bears.dictionary ├── bears.txt ├── brown.jpg ├── grizzly.jpg ├── index.js ├── package.json └── polar.jpg ├── multi-window-electron-desktop-app ├── README.md ├── app.js ├── main.html ├── main.js ├── package.json └── prefs.html ├── node-process-child-process ├── README.md ├── index.js └── package.json ├── node-streams ├── README.md ├── actualbears.txt ├── bears.txt ├── index.js └── package.json ├── nodejs-cli ├── README.md ├── bear.txt ├── bears.txt ├── cli.js └── package.json ├── nodejs-server ├── README.md ├── package.json └── server.js ├── p2p-video-chat-webrtc ├── README.md ├── index.html ├── index.js └── package.json ├── packaging-distributing-electron-apps ├── Icon.icns ├── README.md ├── index.html ├── index.js └── package.json ├── simple-p2p-with-webrtc ├── README.md ├── index.js ├── package.json └── player.js ├── tagged-template-literals ├── README.md ├── index.js └── package.json ├── testing-client-server-javascript ├── .gitignore ├── .travis.yml ├── .zuul.yml ├── README.md ├── index.js ├── package.json └── test.js ├── transform-your-bundles-with-browserify ├── README.md ├── bears.txt ├── bundle.js ├── index.js ├── package.json └── transform.js ├── two-d-animations-with-canvas-javascript ├── README.md ├── index.js └── package.json ├── vuejs-computed-properties ├── App.vue ├── README.md ├── index.html ├── index.js └── package.json ├── what-is-async-javascript ├── README.md ├── index.js ├── one.bear ├── package.json ├── three.bear └── two.bear └── what-is-isomorphic-javascript ├── README.md ├── bears.txt ├── fake-fs.js ├── index.js └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | npm-debug.log* 3 | package-lock.json -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Let's Write Code 2 | 3 | All the code examples for the youtube series 4 | [Let's Write Code](https://www.youtube.com/user/kylerobinsonyoung) 5 | 6 | ## Ideas? 7 | If you have any screencast you'd like to see or suggestions, please 8 | [open an issue here](https://github.com/shama/letswritecode/issues). Thanks! 9 | 10 | ## Dev Setup 11 | Throughout these videos I typically use the same development environment. This 12 | is a guide through that development setup. 13 | 14 | ### Dependencies 15 | Rather than copying / pasting script tags into my HTML for 3rd party code, I use 16 | [npm](https://www.npmjs.com/). The `npm` command comes with Node.js. When I run 17 | `npm install jquery`, it downloads the 3rd party files into the `node_modules/jquery/` 18 | folder. 19 | 20 | The `package.json` file can hold those dependencies and versions, so the next 21 | time you want to install those files, run `npm install` in the same folder. 22 | 23 | ### Build Tool 24 | [Browserify](http://browserify.org/) is a tool that reads your JavaScript source 25 | files and files you've installed with `npm`. Then outputs those files loaded in 26 | the correct order to a single bundled file. 27 | 28 | You can install the `browserify` command on your machine with: `npm install browserify -g`. 29 | 30 | To create a bundled file, run `browserify index.js -o bundle.js`, where `index.js` 31 | is the entry point to all your scripts. 32 | 33 | In your `index.js` file, you can include other files with `require('./other.js')` 34 | or a 3rd party file installed with `npm` by doing `require('jquery')`. 35 | 36 | Once you have generated this `bundle.js` file, you can add a single script tag in 37 | your HTML: `` and host those assets like any 38 | other HTML, JavaScript and CSS files. 39 | 40 | ### Dev Server 41 | While rapidly developing, running the `browserify` command every time you make 42 | a change in the code can get tedious. Also having to FTP, git push or some other 43 | method to deploy the code to a server can slow your development down. 44 | 45 | I use a tool called [budo](https://www.npmjs.com/package/budo) which runs a server 46 | locally on your machine (`http://localhost:9966`) and automatically bundles your 47 | code with Browserify as you refresh the page or live as you make changes if you 48 | have the `--live` option on. 49 | 50 | Install the `budo` command with: `npm install budo` and run the server with: 51 | `budo index.js`. Now you can rapidly develop the code by viewing `localhost:9966`. 52 | 53 | For convenience, I add the `budo` command to the `scripts` section of my 54 | `package.json`: 55 | 56 | ```json 57 | { 58 | "scripts": { 59 | "start": "budo index.js:bundle.js" 60 | } 61 | } 62 | ``` 63 | 64 | Now I only need to run `npm start` to start developing code. 65 | 66 | ### Deployment 67 | After you're done developing the code, run `browserify index.js -o bundle.js` to 68 | create your JavaScript bundle. Add the script tag to your HTML: 69 | `` to load that JavaScript file. 70 | 71 | Then upload those files to your remote server. Either via FTP/SFTP, 72 | [`git` deploying](https://www.youtube.com/watch?v=9qIK8ZC9BnU), 73 | [heroku](https://devcenter.heroku.com/categories/deployment), 74 | [firebase](https://firebase.google.com/docs/hosting/deploying) or whatever method 75 | you normally use to deploy your website. 76 | -------------------------------------------------------------------------------- /ajax-requests/README.md: -------------------------------------------------------------------------------- 1 | # AJAX HTTP Requests 2 | 3 | > [http://youtu.be/ZJMO-zmErA8](http://youtu.be/ZJMO-zmErA8) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `devDependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /ajax-requests/bears.json: -------------------------------------------------------------------------------- 1 | ["grizzly", "polar", "brown"] 2 | -------------------------------------------------------------------------------- /ajax-requests/index.js: -------------------------------------------------------------------------------- 1 | // var request = new XMLHttpRequest(); 2 | // 3 | // request.onreadystatechange = function () { 4 | // if (request.readyState === 4) { 5 | // if (request.status === 200) { 6 | // var bears = JSON.parse(request.response); 7 | // console.log(bears[1]); 8 | // } else { 9 | // throw new Error(request.response); 10 | // } 11 | // } 12 | // } 13 | // 14 | // request.open('GET', 'http://localhost:9966/boars.json'); 15 | // request.send(); 16 | 17 | var nets = require('nets'); 18 | nets({ 19 | url: 'http://localhost:9966/bears.json', 20 | json: true 21 | }, function (err, response, bears) { 22 | bears.forEach(function (bear) { 23 | //document.write(bear + '
'); 24 | console.log(bear); 25 | }); 26 | }); 27 | -------------------------------------------------------------------------------- /ajax-requests/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ajax-requests", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "dependencies": { 12 | "nets": "^3.1.0" 13 | }, 14 | "devDependencies": { 15 | "budo": "^11.2.0" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /async-js-with-promises/README.md: -------------------------------------------------------------------------------- 1 | # Async JavaScript with Promises 2 | 3 | > [https://youtu.be/g90irqWEqd8](https://youtu.be/g90irqWEqd8) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `devDependencies` and `dependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /async-js-with-promises/bears.txt: -------------------------------------------------------------------------------- 1 | grizzly 2 | polar 3 | brown 4 | -------------------------------------------------------------------------------- /async-js-with-promises/fetch.js: -------------------------------------------------------------------------------- 1 | var xhr = require('xhr') 2 | 3 | module.exports = function (uri) { 4 | return new Promise(function (resolve, reject) { 5 | xhr(uri, function (err, res, body) { 6 | if (err) return reject(err) 7 | if (res.statusCode !== 200) return reject(new Error(body)) 8 | resolve(body) 9 | }) 10 | }) 11 | } 12 | -------------------------------------------------------------------------------- /async-js-with-promises/fish.txt: -------------------------------------------------------------------------------- 1 | salmon 2 | tuna 3 | bass 4 | -------------------------------------------------------------------------------- /async-js-with-promises/index.js: -------------------------------------------------------------------------------- 1 | var fetch = require('./fetch.js') 2 | 3 | // Using then and catch 4 | // var promise = fetch('bears.txt') 5 | // 6 | // promise.then(function (bears) { 7 | // console.log(bears) 8 | // //throw new Error('Uh oh') 9 | // return fetch('fish.txt') 10 | // }).then(function (fish) { 11 | // console.log(fish) 12 | // }).catch(function (err) { 13 | // console.error('WE GOT ERROR', err) 14 | // }) 15 | 16 | // Using Promise.all 17 | // Promise.all([ 18 | // fetch('bears.txt'), 19 | // fetch('fish.txt'), 20 | // ]).then(function (values) { 21 | // var bears = values[0] 22 | // var fish = values[1] 23 | // console.log(bears, fish) 24 | // }) 25 | 26 | // Creating promises 27 | var promise = new Promise(function (resolve, reject) { 28 | //reject(new Error("uh oh")) 29 | resolve('all good') 30 | }) 31 | 32 | promise.then(function (result) { 33 | console.log('was it good?', result) 34 | }).catch(function (err) { 35 | console.error('ERR', err) 36 | }) 37 | -------------------------------------------------------------------------------- /async-js-with-promises/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "async-js-with-promises", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "budo": "^4.0.0" 13 | }, 14 | "dependencies": { 15 | "xhr": "^2.0.2" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /beginning-client-server-javascript-with-io-node/README.md: -------------------------------------------------------------------------------- 1 | # Beginning client and server JavaScript with io.js or Node.js 2 | 3 | > [https://www.youtube.com/watch?v=Ads1A7pn2LI](https://www.youtube.com/watch?v=Ads1A7pn2LI) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `devDependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /beginning-client-server-javascript-with-io-node/index.js: -------------------------------------------------------------------------------- 1 | document.body.style.backgroundColor = 'red' 2 | 3 | alert('hi') 4 | -------------------------------------------------------------------------------- /beginning-client-server-javascript-with-io-node/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "my-project", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "budo": "^3.0.4", 13 | "watchify": "^3.1.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /content-security-policy/.gitignore: -------------------------------------------------------------------------------- 1 | db 2 | -------------------------------------------------------------------------------- /content-security-policy/README.md: -------------------------------------------------------------------------------- 1 | # Content Security Policy 2 | 3 | > [https://www.youtube.com/watch?v=JbfNWg6JS4U](https://www.youtube.com/watch?v=JbfNWg6JS4U) 4 | 5 | Install [node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app and `http://localhost:9966` to view. 11 | -------------------------------------------------------------------------------- /content-security-policy/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: Arial, sans-serif; 3 | } 4 | form { 5 | margin: 1rem 0; 6 | } 7 | textarea { 8 | display: block; 9 | font-size: 1.2rem; 10 | width: 100%; 11 | height: 10rem; 12 | } 13 | button { 14 | display: block; 15 | font-size: 1.2rem; 16 | } 17 | -------------------------------------------------------------------------------- /content-security-policy/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 |

Bears are the best!

7 | 8 |
9 |
10 | 11 | 12 | 13 |
14 |
15 | 16 |

Other people thoughts

17 |
    18 | <% _.forEach(comments, function(comment) { %>
  • <%= comment %>
    • <% }); %> 19 |
20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /content-security-policy/index.js: -------------------------------------------------------------------------------- 1 | var nets = require('nets') 2 | var assign = require('object-assign') 3 | 4 | // When the form is submitted, add a new comment 5 | document.querySelector('form').addEventListener('submit', function (e) { 6 | e.preventDefault() 7 | var comment = document.querySelector('textarea').value 8 | nets({ 9 | url: '/addcomment', 10 | method: 'POST', 11 | body: comment 12 | }, function () { 13 | location.reload() 14 | }) 15 | }, false) 16 | 17 | var h1 = document.querySelector('h1') 18 | //h1.setAttribute('style', 'color: red; text-shadow: 1px 1px 1px #000;') 19 | // h1.style.color = 'red' 20 | // h1.style.textShadow = '1px 1px 1px #000' 21 | assign(h1.style, { 22 | color: 'red', 23 | textShadow: '1px 1px 1px #000' 24 | }) 25 | -------------------------------------------------------------------------------- /content-security-policy/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "content-security-policy", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "node server.js" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "dependencies": { 12 | "level": "^1.3.0", 13 | "lodash": "^3.10.1", 14 | "nets": "^3.1.0", 15 | "object-assign": "^4.0.1", 16 | "sanitize-html": "^1.10.1" 17 | }, 18 | "devDependencies": { 19 | "browserify": "^11.2.0" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /content-security-policy/server.js: -------------------------------------------------------------------------------- 1 | var http = require('http') 2 | var fs = require('fs') 3 | var browserify = require('browserify') 4 | var db = require('level')('./db') 5 | var template = require('lodash').template(fs.readFileSync('index.html', 'utf8')) 6 | var sanitize = require('sanitize-html') 7 | 8 | var server = http.createServer(function (req, res) { 9 | res.setHeader('Content-Security-Policy', "script-src 'self' https://apis.google.com; style-src 'self'") 10 | 11 | switch (req.url) { 12 | case '/index.js': 13 | // If requesting index.js, browserify our script and return it 14 | browserify('index.js').bundle().pipe(res) 15 | break 16 | case '/index.css': 17 | // If requesting index.css, just return that file 18 | fs.createReadStream('index.css').pipe(res) 19 | break 20 | case '/addcomment': 21 | // When adding a comment, put into the database 22 | var comment = [] 23 | req.on('data', function (data) { 24 | comment.push(data) 25 | }) 26 | req.on('end', function () { 27 | comment = comment.join('') 28 | db.put(Date.now(), comment, function () { 29 | res.end() 30 | }) 31 | }) 32 | break 33 | default: 34 | // The default route is our index.html file, grab comments and 35 | // feed to our template 36 | var comments = [] 37 | db.createReadStream().on('data', function (data) { 38 | comments.push(data.value) 39 | }).on('end', function () { 40 | res.end(template({comments:comments})) 41 | }) 42 | break 43 | } 44 | }) 45 | 46 | server.listen(9966, function () { 47 | console.log('Server running at http://locahost:9966') 48 | }) 49 | -------------------------------------------------------------------------------- /creating-desktop-apps-with-electron/README.md: -------------------------------------------------------------------------------- 1 | # Creating Desktop Apps with Electron 2 | 3 | > [https://www.youtube.com/watch?v=ojX5yz35v4M](https://www.youtube.com/watch?v=ojX5yz35v4M) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app. 11 | -------------------------------------------------------------------------------- /creating-desktop-apps-with-electron/app.js: -------------------------------------------------------------------------------- 1 | document.write('The current version of io.js ' + process.version) 2 | 3 | var fs = require('fs') 4 | 5 | var contents = fs.readFileSync('./package.json', 'utf8') 6 | alert(contents) 7 | -------------------------------------------------------------------------------- /creating-desktop-apps-with-electron/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Hi 7 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /creating-desktop-apps-with-electron/index.js: -------------------------------------------------------------------------------- 1 | var app = require('app') 2 | var BrowserWindow = require('browser-window') 3 | 4 | app.on('ready', function() { 5 | var mainWindow = new BrowserWindow({ 6 | width: 800, 7 | height: 600 8 | }) 9 | mainWindow.loadUrl('file://' + __dirname + '/index.html') 10 | }) 11 | -------------------------------------------------------------------------------- /creating-desktop-apps-with-electron/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "creating-desktop-apps-with-electron", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "electron ." 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "electron-prebuilt": "^0.25.1" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /css-selector-precedence/README.md: -------------------------------------------------------------------------------- 1 | # CSS Selector Precedence 2 | 3 | > [https://youtu.be/eofMNcafgMU](https://youtu.be/eofMNcafgMU) 4 | 5 | Install [io.js](https://iojs.org/en/index.html) or [node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app and `http://localhost:9966` to view. 11 | -------------------------------------------------------------------------------- /css-selector-precedence/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 12 | 13 | 14 | 15 | 16 | 17 | 25 |
26 | Grizzly 27 |
28 | 29 | 30 | 31 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /css-selector-precedence/index.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/css-selector-precedence/index.js -------------------------------------------------------------------------------- /css-selector-precedence/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "css-selector-precedence", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js:bundle.js --live", 8 | "test": "node test.js" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT", 12 | "devDependencies": { 13 | "budo": "^4.2.1" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /debugging-javascript/README.md: -------------------------------------------------------------------------------- 1 | # Debugging JavaScript 2 | 3 | > [https://www.youtube.com/watch?v=LVXY16PJ_jU](https://www.youtube.com/watch?v=LVXY16PJ_jU) 4 | 5 | Install [Node.js](https://nodejs.org). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `devDependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /debugging-javascript/index.js: -------------------------------------------------------------------------------- 1 | // var getBears = require('./lib/get-bears.js') 2 | // 3 | // var noPolar = getBears() 4 | // noPolar.splice(1, 1) 5 | // console.log(noPolar) 6 | // 7 | // var noGrizzly = getBears() 8 | // noGrizzly.splice(0, 1) 9 | // console.log(noGrizzly) 10 | 11 | var lots = require('./lib/lots.js') 12 | lots() 13 | -------------------------------------------------------------------------------- /debugging-javascript/lib/get-bears.js: -------------------------------------------------------------------------------- 1 | module.exports = function () { 2 | var bears = ['grizzly', 'polar', 'brown'] 3 | debugger 4 | return bears 5 | } 6 | -------------------------------------------------------------------------------- /debugging-javascript/lib/lots.js: -------------------------------------------------------------------------------- 1 | 2 | function addBear (arr) { 3 | arr.push('bear' + arr.length) 4 | } 5 | module.exports.addBear = addBear 6 | 7 | module.exports = function () { 8 | debugger 9 | var bears = [] 10 | for (var i = 0; i < 100; i++) { 11 | addBear(bears) 12 | } 13 | return bears 14 | } 15 | -------------------------------------------------------------------------------- /debugging-javascript/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "debugging-javascript", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "dependencies": { 12 | "nets": "^3.2.0" 13 | }, 14 | "devDependencies": { 15 | "budo": "^11.2.0" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /dom-event-listeners/README.md: -------------------------------------------------------------------------------- 1 | # DOM Event Listeners 2 | 3 | > [https://youtu.be/ocXVINp-5oU](https://youtu.be/ocXVINp-5oU) 4 | 5 | Install [Node.js](https://nodejs.org/en/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /dom-event-listeners/index.js: -------------------------------------------------------------------------------- 1 | const bear = document.createElement('button') 2 | bear.textContent = 'growl' 3 | 4 | // bear.addEventListener('click', function onclick (e) { 5 | // console.log(e.target) 6 | // }, false) 7 | 8 | 9 | const forest = document.createElement('div') 10 | for (var i = 0; i < 100; i++) { 11 | const bear = document.createElement('button') 12 | bear.textContent = 'click ' + i 13 | forest.appendChild(bear) 14 | } 15 | document.body.appendChild(forest) 16 | 17 | forest.addEventListener('click', function (e) { 18 | console.log(e.currentTarget) 19 | }, false) 20 | 21 | document.addEventListener('click', function (e) { 22 | console.log(e.target) 23 | }, false) 24 | 25 | const cat = document.createElement('button') 26 | cat.textContent = 'meow' 27 | forest.appendChild(cat) 28 | cat.addEventListener('click', function (e) { 29 | e.stopPropagation() 30 | console.log('mew') 31 | }, false) -------------------------------------------------------------------------------- /dom-event-listeners/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dom-event-listeners", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live", 8 | "test": "node test.js" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT", 12 | "devDependencies": { 13 | "budo": "^11.2.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /drawing-animating-svgs/README.md: -------------------------------------------------------------------------------- 1 | # Drawing & Animating SVGs 2 | 3 | > [https://www.youtube.com/watch?v=Nnnx9ytFqK4](https://www.youtube.com/watch?v=Nnnx9ytFqK4) 4 | 5 | Install [Node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app viewable on `http://localhost:9966`. 11 | -------------------------------------------------------------------------------- /drawing-animating-svgs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Obligatory Bear Inclusion 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 31 | 32 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /drawing-animating-svgs/index.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/drawing-animating-svgs/index.js -------------------------------------------------------------------------------- /drawing-animating-svgs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "drawing-animating-svgs", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live", 8 | "test": "node test.js" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT", 12 | "devDependencies": { 13 | "budo": "^11.2.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /easier-webgl-shaders-stackgl/README.md: -------------------------------------------------------------------------------- 1 | # Easier WebGL and Shaders with stack.gl 2 | 3 | > [https://www.youtube.com/watch?v=Qsku8RfB-pM](https://www.youtube.com/watch?v=Qsku8RfB-pM) 4 | 5 | Install [Node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app viewable on `http://localhost:9966`. 11 | -------------------------------------------------------------------------------- /easier-webgl-shaders-stackgl/index.js: -------------------------------------------------------------------------------- 1 | const shell = require('gl-now')() 2 | const createShader = require('gl-shader') 3 | const createBuffer = require('gl-buffer') 4 | const mat4 = require('gl-mat4') 5 | 6 | let shader, buffer 7 | shell.on('gl-init', function () { 8 | const gl = shell.gl 9 | shader = createShader(gl, ` 10 | uniform mat4 model; 11 | uniform mat4 camera; 12 | attribute vec3 position; 13 | void main() { 14 | gl_Position = camera * model * vec4(position, 1.0); 15 | } 16 | `, ` 17 | void main() { 18 | gl_FragColor = vec4(0.0, 0.0, 0.0, 1.0); 19 | } 20 | `) 21 | buffer = createBuffer(gl, [ 22 | 0.0, 0.5, 0.0, 23 | -0.5, -0.5, 0.0, 24 | 0.5, -0.5, 0.0, 25 | ]) 26 | }) 27 | 28 | shell.on('gl-render', function () { 29 | const gl = shell.gl 30 | shader.bind() 31 | buffer.bind() 32 | 33 | const camera = mat4.create() 34 | mat4.perspective(camera, 45 * Math.PI / 180, shell.width / shell.height, 0.1, 1000.0) 35 | mat4.translate(camera, camera, [0, 0, -2]) 36 | shader.uniforms.camera = camera 37 | 38 | const model = mat4.create() 39 | mat4.translate(model, model, [-.3, 0, 0]) 40 | //mat4.rotate(model, model, 45, [0, 0, 1]) 41 | mat4.scale(model, model, [.5, .5, 1]) 42 | shader.uniforms.model = model 43 | shader.attributes.position.pointer() 44 | gl.drawArrays(gl.TRIANGLES, 0, 3) 45 | }) 46 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /easier-webgl-shaders-stackgl/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "easier-webgl-shaders-stackgl", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "budo": "^11.2.0" 13 | }, 14 | "dependencies": { 15 | "gl-buffer": "^2.1.2", 16 | "gl-mat4": "^1.2.0", 17 | "gl-now": "^1.4.0", 18 | "gl-shader": "^4.2.1" 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /electron-webpack-vuejs/.gitignore: -------------------------------------------------------------------------------- 1 | dist 2 | node_modules 3 | package-lock.json -------------------------------------------------------------------------------- /electron-webpack-vuejs/README.md: -------------------------------------------------------------------------------- 1 | # Electron with webpack and Vue.js 2 | 3 | > [https://youtu.be/oL7vIDkDOsg](https://youtu.be/oL7vIDkDOsg) 4 | 5 | Install [Node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app. 11 | -------------------------------------------------------------------------------- /electron-webpack-vuejs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "electron-webpack-vuejs", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "electron-webpack dev", 8 | "build": "electron-webpack && electron-builder -c.mac.identity=null" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT", 12 | "devDependencies": { 13 | "electron": "^2.0.2", 14 | "electron-builder": "^20.15.1", 15 | "electron-webpack": "^2.1.2", 16 | "vue": "^2.5.16", 17 | "vue-loader": "^15.2.2", 18 | "vue-template-compiler": "^2.5.16", 19 | "webpack": "^4.9.1" 20 | }, 21 | "dependencies": { 22 | "source-map-support": "^0.5.6" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /electron-webpack-vuejs/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | <%= process.env.npm_package_productName %> 5 | 6 | 14 | 15 | 16 |
17 | 18 | 19 | -------------------------------------------------------------------------------- /electron-webpack-vuejs/src/main/index.js: -------------------------------------------------------------------------------- 1 | import { app, BrowserWindow } from 'electron' 2 | import path from 'path' 3 | import { format as formatUrl } from 'url' 4 | 5 | const isDevelopment = process.env.NODE_ENV !== 'production' 6 | 7 | app.on('ready', () => { 8 | let window = new BrowserWindow({ 9 | width: 1024, 10 | webPreferences: { 11 | nodeIntegration: true 12 | } 13 | }) 14 | if (isDevelopment) { 15 | window.loadURL(`http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT}`) 16 | } else { 17 | window.loadURL(formatUrl({ 18 | pathname: path.join(__dirname, 'index.html'), 19 | protocol: 'file', 20 | slashes: true 21 | })) 22 | } 23 | window.on("closed", () => { 24 | window = null; 25 | }) 26 | }) 27 | 28 | app.on("window-all-closed", () => { 29 | if (process.platform !== "darwin") { 30 | app.quit(); 31 | } 32 | }) -------------------------------------------------------------------------------- /electron-webpack-vuejs/src/renderer/App.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /electron-webpack-vuejs/src/renderer/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | new Vue({ 4 | el: '#app', 5 | render(h) { 6 | return h(App) 7 | } 8 | }) -------------------------------------------------------------------------------- /electron-webpack-vuejs/webpack.config.js: -------------------------------------------------------------------------------- 1 | const VueLoaderPlugin = require('vue-loader/lib/plugin') 2 | module.exports = { 3 | module: { 4 | rules: [ 5 | { 6 | test: /\.vue$/, 7 | use: 'vue-loader' 8 | } 9 | ] 10 | }, 11 | plugins: [ 12 | new VueLoaderPlugin() 13 | ] 14 | } -------------------------------------------------------------------------------- /ember-computed-properties/.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "bower_components", 3 | "analytics": false 4 | } 5 | -------------------------------------------------------------------------------- /ember-computed-properties/.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent 2 | # coding styles between different editors and IDEs 3 | # editorconfig.org 4 | 5 | root = true 6 | 7 | 8 | [*] 9 | end_of_line = lf 10 | charset = utf-8 11 | trim_trailing_whitespace = true 12 | insert_final_newline = true 13 | indent_style = space 14 | indent_size = 2 15 | 16 | [*.js] 17 | indent_style = space 18 | indent_size = 2 19 | 20 | [*.hbs] 21 | insert_final_newline = false 22 | indent_style = space 23 | indent_size = 2 24 | 25 | [*.css] 26 | indent_style = space 27 | indent_size = 2 28 | 29 | [*.html] 30 | indent_style = space 31 | indent_size = 2 32 | 33 | [*.{diff,md}] 34 | trim_trailing_whitespace = false 35 | -------------------------------------------------------------------------------- /ember-computed-properties/.ember-cli: -------------------------------------------------------------------------------- 1 | { 2 | /** 3 | Ember CLI sends analytics information by default. The data is completely 4 | anonymous, but there are times when you might want to disable this behavior. 5 | 6 | Setting `disableAnalytics` to true will prevent any data from being sent. 7 | */ 8 | "disableAnalytics": false 9 | } 10 | -------------------------------------------------------------------------------- /ember-computed-properties/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | 7 | # dependencies 8 | /node_modules 9 | /bower_components 10 | 11 | # misc 12 | /.sass-cache 13 | /connect.lock 14 | /coverage/* 15 | /libpeerconnection.log 16 | npm-debug.log 17 | testem.log 18 | -------------------------------------------------------------------------------- /ember-computed-properties/.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "predef": [ 3 | "document", 4 | "window", 5 | "-Promise" 6 | ], 7 | "browser": true, 8 | "boss": true, 9 | "curly": true, 10 | "debug": false, 11 | "devel": true, 12 | "eqeqeq": true, 13 | "evil": true, 14 | "forin": false, 15 | "immed": false, 16 | "laxbreak": false, 17 | "newcap": true, 18 | "noarg": true, 19 | "noempty": false, 20 | "nonew": false, 21 | "nomen": false, 22 | "onevar": false, 23 | "plusplus": false, 24 | "regexp": false, 25 | "undef": true, 26 | "sub": true, 27 | "strict": false, 28 | "white": false, 29 | "eqnull": true, 30 | "esnext": true, 31 | "unused": true 32 | } 33 | -------------------------------------------------------------------------------- /ember-computed-properties/.travis.yml: -------------------------------------------------------------------------------- 1 | --- 2 | language: node_js 3 | node_js: 4 | - "0.12" 5 | 6 | sudo: false 7 | 8 | cache: 9 | directories: 10 | - node_modules 11 | 12 | before_install: 13 | - export PATH=/usr/local/phantomjs-2.0.0/bin:$PATH 14 | - "npm config set spin false" 15 | - "npm install -g npm@^2" 16 | 17 | install: 18 | - npm install -g bower 19 | - npm install 20 | - bower install 21 | 22 | script: 23 | - npm test 24 | -------------------------------------------------------------------------------- /ember-computed-properties/.watchmanconfig: -------------------------------------------------------------------------------- 1 | { 2 | "ignore_dirs": ["tmp"] 3 | } 4 | -------------------------------------------------------------------------------- /ember-computed-properties/README.md: -------------------------------------------------------------------------------- 1 | # Ember.js Computed Properties 2 | 3 | > [https://youtu.be/sT_QZT9znGI](https://youtu.be/sT_QZT9znGI) 4 | 5 | Install [Node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app and `http://localhost:4200` to view. 11 | 12 | ## Further Reading / Useful Links 13 | 14 | * [ember.js](http://emberjs.com/) 15 | * [ember-cli](http://www.ember-cli.com/) 16 | * Development Browser Extensions 17 | * [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi) 18 | * [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/) 19 | -------------------------------------------------------------------------------- /ember-computed-properties/app/app.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | import Resolver from 'ember/resolver'; 3 | import loadInitializers from 'ember/load-initializers'; 4 | import config from './config/environment'; 5 | 6 | var App; 7 | 8 | Ember.MODEL_FACTORY_INJECTIONS = true; 9 | 10 | App = Ember.Application.extend({ 11 | modulePrefix: config.modulePrefix, 12 | podModulePrefix: config.podModulePrefix, 13 | Resolver: Resolver 14 | }); 15 | 16 | loadInitializers(App, config.modulePrefix); 17 | 18 | export default App; 19 | -------------------------------------------------------------------------------- /ember-computed-properties/app/components/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/components/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/app/components/bear-list.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | 3 | export default Ember.Component.extend({ 4 | model: Ember.computed({ 5 | set: function (key, bears) { 6 | return bears.map(function (bear) { 7 | bear.favorited = false; 8 | return Ember.Object.create(bear); 9 | }); 10 | } 11 | }), 12 | totalBears: Ember.computed('model.[]', function () { 13 | return this.get('model.length'); 14 | }), 15 | bears: Ember.computed('model.[]', 'page', function () { 16 | var page = this.get('page'); 17 | return this.get('model').slice(page, page + 5); 18 | }), 19 | page: 0, 20 | favoritedBears: Ember.computed('model.@each.favorited', { 21 | get: function () { 22 | return this.get('model').filterBy('favorited', true).length; 23 | } 24 | }), 25 | actions: { 26 | showMore: function () { 27 | this.incrementProperty('page', 5); 28 | }, 29 | favorite: function (bear) { 30 | bear.toggleProperty('favorited'); 31 | } 32 | } 33 | }); 34 | -------------------------------------------------------------------------------- /ember-computed-properties/app/controllers/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/controllers/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/app/helpers/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/helpers/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | EmberComputedProperties 7 | 8 | 9 | 10 | {{content-for 'head'}} 11 | 12 | 13 | 14 | 15 | {{content-for 'head-footer'}} 16 | 17 | 18 | {{content-for 'body'}} 19 | 20 | 21 | 22 | 23 | {{content-for 'body-footer'}} 24 | 25 | 26 | -------------------------------------------------------------------------------- /ember-computed-properties/app/models/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/models/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/app/router.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | import config from './config/environment'; 3 | 4 | var Router = Ember.Router.extend({ 5 | location: config.locationType 6 | }); 7 | 8 | Router.map(function() { 9 | }); 10 | 11 | export default Router; 12 | -------------------------------------------------------------------------------- /ember-computed-properties/app/routes/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/routes/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/app/routes/application.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | 3 | export default Ember.Route.extend({ 4 | model: function () { 5 | return $.get('/bears.json'); 6 | } 7 | }); 8 | -------------------------------------------------------------------------------- /ember-computed-properties/app/styles/app.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/styles/app.css -------------------------------------------------------------------------------- /ember-computed-properties/app/templates/application.hbs: -------------------------------------------------------------------------------- 1 | {{bear-list model=model}} 2 | -------------------------------------------------------------------------------- /ember-computed-properties/app/templates/components/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/app/templates/components/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/app/templates/components/bear-list.hbs: -------------------------------------------------------------------------------- 1 |

Bears ({{totalBears}})

2 |
    3 | {{#each bears as |bear|}} 4 |
  • 5 | {{#if bear.favorited}} 6 | ⭐️ 7 | {{/if}} 8 | {{bear.name}} 9 |
    • 10 | {{/each}} 11 |
12 | 13 | 14 |
15 |
16 | You have favorited {{favoritedBears}} bears 17 | -------------------------------------------------------------------------------- /ember-computed-properties/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ember-computed-properties", 3 | "dependencies": { 4 | "ember": "1.13.7", 5 | "ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3", 6 | "ember-cli-test-loader": "ember-cli-test-loader#0.1.3", 7 | "ember-data": "1.13.8", 8 | "ember-load-initializers": "ember-cli/ember-load-initializers#0.1.5", 9 | "ember-qunit": "0.4.9", 10 | "ember-qunit-notifications": "0.0.7", 11 | "ember-resolver": "~0.1.18", 12 | "jquery": "^1.11.3", 13 | "loader.js": "ember-cli/loader.js#3.2.1", 14 | "qunit": "~1.18.0" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /ember-computed-properties/config/environment.js: -------------------------------------------------------------------------------- 1 | /* jshint node: true */ 2 | 3 | module.exports = function(environment) { 4 | var ENV = { 5 | modulePrefix: 'ember-computed-properties', 6 | environment: environment, 7 | baseURL: '/', 8 | locationType: 'auto', 9 | EmberENV: { 10 | FEATURES: { 11 | // Here you can enable experimental features on an ember canary build 12 | // e.g. 'with-controller': true 13 | } 14 | }, 15 | 16 | APP: { 17 | // Here you can pass flags/options to your application instance 18 | // when it is created 19 | } 20 | }; 21 | 22 | if (environment === 'development') { 23 | // ENV.APP.LOG_RESOLVER = true; 24 | // ENV.APP.LOG_ACTIVE_GENERATION = true; 25 | // ENV.APP.LOG_TRANSITIONS = true; 26 | // ENV.APP.LOG_TRANSITIONS_INTERNAL = true; 27 | // ENV.APP.LOG_VIEW_LOOKUPS = true; 28 | } 29 | 30 | if (environment === 'test') { 31 | // Testem prefers this... 32 | ENV.baseURL = '/'; 33 | ENV.locationType = 'none'; 34 | 35 | // keep test console output quieter 36 | ENV.APP.LOG_ACTIVE_GENERATION = false; 37 | ENV.APP.LOG_VIEW_LOOKUPS = false; 38 | 39 | ENV.APP.rootElement = '#ember-testing'; 40 | } 41 | 42 | if (environment === 'production') { 43 | 44 | } 45 | 46 | return ENV; 47 | }; 48 | -------------------------------------------------------------------------------- /ember-computed-properties/ember-cli-build.js: -------------------------------------------------------------------------------- 1 | /* global require, module */ 2 | var EmberApp = require('ember-cli/lib/broccoli/ember-app'); 3 | 4 | module.exports = function(defaults) { 5 | var app = new EmberApp(defaults, { 6 | // Add options here 7 | }); 8 | 9 | // Use `app.import` to add additional libraries to the generated 10 | // output files. 11 | // 12 | // If you need to use different assets in different 13 | // environments, specify an object as the first parameter. That 14 | // object's keys should be the environment name and the values 15 | // should be the asset to use in that environment. 16 | // 17 | // If the library that you are including contains AMD or ES6 18 | // modules that you would like to import into your application 19 | // please specify an object with the list of modules as keys 20 | // along with the exports of each module as its value. 21 | 22 | return app.toTree(); 23 | }; 24 | -------------------------------------------------------------------------------- /ember-computed-properties/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ember-computed-properties", 3 | "version": "0.0.0", 4 | "description": "Small description for ember-computed-properties goes here", 5 | "private": true, 6 | "directories": { 7 | "doc": "doc", 8 | "test": "tests" 9 | }, 10 | "scripts": { 11 | "build": "ember build", 12 | "start": "ember server", 13 | "test": "ember test" 14 | }, 15 | "repository": "", 16 | "engines": { 17 | "node": ">= 0.10.0" 18 | }, 19 | "author": "", 20 | "license": "MIT", 21 | "devDependencies": { 22 | "broccoli-asset-rev": "^2.1.2", 23 | "ember-cli": "1.13.8", 24 | "ember-cli-app-version": "0.5.0", 25 | "ember-cli-babel": "^5.1.3", 26 | "ember-cli-content-security-policy": "0.4.0", 27 | "ember-cli-dependency-checker": "^1.0.1", 28 | "ember-cli-htmlbars": "0.7.9", 29 | "ember-cli-htmlbars-inline-precompile": "^0.2.0", 30 | "ember-cli-ic-ajax": "0.2.1", 31 | "ember-cli-inject-live-reload": "^1.3.1", 32 | "ember-cli-qunit": "^1.0.0", 33 | "ember-cli-release": "0.2.3", 34 | "ember-cli-sri": "^1.0.3", 35 | "ember-cli-uglify": "^1.2.0", 36 | "ember-data": "1.13.8", 37 | "ember-disable-proxy-controllers": "^1.0.0", 38 | "ember-export-application-global": "^1.0.3" 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /ember-computed-properties/public/bears.json: -------------------------------------------------------------------------------- 1 | [ 2 | { "name": "Grizzly" }, 3 | { "name": "Gobi" }, 4 | { "name": "Atlas" }, 5 | { "name": "Polar" }, 6 | { "name": "Brown" }, 7 | { "name": "American Black" }, 8 | { "name": "Asian Black" }, 9 | { "name": "Bergmans" }, 10 | { "name": "Blue" }, 11 | { "name": "Cinnamon" }, 12 | { "name": "Kermode" }, 13 | { "name": "Formosan" }, 14 | { "name": "Himalayan" }, 15 | { "name": "Kodiak" }, 16 | { "name": "Marsican" }, 17 | { "name": "Sri Lankan" }, 18 | { "name": "Ursid" }, 19 | { "name": "Spectacled" }, 20 | { "name": "Giant Panda" }, 21 | { "name": "Sloth Bear" }, 22 | { "name": "Sun Bear" } 23 | ] 24 | -------------------------------------------------------------------------------- /ember-computed-properties/public/crossdomain.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 15 | 16 | -------------------------------------------------------------------------------- /ember-computed-properties/public/robots.txt: -------------------------------------------------------------------------------- 1 | # http://www.robotstxt.org 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /ember-computed-properties/testem.json: -------------------------------------------------------------------------------- 1 | { 2 | "framework": "qunit", 3 | "test_page": "tests/index.html?hidepassed", 4 | "disable_watching": true, 5 | "launch_in_ci": [ 6 | "PhantomJS" 7 | ], 8 | "launch_in_dev": [ 9 | "PhantomJS", 10 | "Chrome" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "predef": [ 3 | "document", 4 | "window", 5 | "location", 6 | "setTimeout", 7 | "$", 8 | "-Promise", 9 | "define", 10 | "console", 11 | "visit", 12 | "exists", 13 | "fillIn", 14 | "click", 15 | "keyEvent", 16 | "triggerEvent", 17 | "find", 18 | "findWithAssert", 19 | "wait", 20 | "DS", 21 | "andThen", 22 | "currentURL", 23 | "currentPath", 24 | "currentRouteName" 25 | ], 26 | "node": false, 27 | "browser": false, 28 | "boss": true, 29 | "curly": true, 30 | "debug": false, 31 | "devel": false, 32 | "eqeqeq": true, 33 | "evil": true, 34 | "forin": false, 35 | "immed": false, 36 | "laxbreak": false, 37 | "newcap": true, 38 | "noarg": true, 39 | "noempty": false, 40 | "nonew": false, 41 | "nomen": false, 42 | "onevar": false, 43 | "plusplus": false, 44 | "regexp": false, 45 | "undef": true, 46 | "sub": true, 47 | "strict": false, 48 | "white": false, 49 | "eqnull": true, 50 | "esnext": true, 51 | "unused": true 52 | } 53 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/helpers/resolver.js: -------------------------------------------------------------------------------- 1 | import Resolver from 'ember/resolver'; 2 | import config from '../../config/environment'; 3 | 4 | var resolver = Resolver.create(); 5 | 6 | resolver.namespace = { 7 | modulePrefix: config.modulePrefix, 8 | podModulePrefix: config.podModulePrefix 9 | }; 10 | 11 | export default resolver; 12 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/helpers/start-app.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | import Application from '../../app'; 3 | import config from '../../config/environment'; 4 | 5 | export default function startApp(attrs) { 6 | var application; 7 | 8 | var attributes = Ember.merge({}, config.APP); 9 | attributes = Ember.merge(attributes, attrs); // use defaults, but you can override; 10 | 11 | Ember.run(function() { 12 | application = Application.create(attributes); 13 | application.setupForTesting(); 14 | application.injectTestHelpers(); 15 | }); 16 | 17 | return application; 18 | } 19 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | EmberComputedProperties Tests 7 | 8 | 9 | 10 | {{content-for 'head'}} 11 | {{content-for 'test-head'}} 12 | 13 | 14 | 15 | 16 | 17 | {{content-for 'head-footer'}} 18 | {{content-for 'test-head-footer'}} 19 | 20 | 21 | 22 | {{content-for 'body'}} 23 | {{content-for 'test-body'}} 24 | 25 | 26 | 27 | 28 | 29 | 30 | {{content-for 'body-footer'}} 31 | {{content-for 'test-body-footer'}} 32 | 33 | 34 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/integration/components/bear-list-test.js: -------------------------------------------------------------------------------- 1 | import { moduleForComponent, test } from 'ember-qunit'; 2 | import hbs from 'htmlbars-inline-precompile'; 3 | 4 | moduleForComponent('bear-list', 'Integration | Component | bear list', { 5 | integration: true 6 | }); 7 | 8 | test('it renders', function(assert) { 9 | assert.expect(2); 10 | 11 | // Set any properties with this.set('myProperty', 'value'); 12 | // Handle any actions with this.on('myAction', function(val) { ... }); 13 | 14 | this.render(hbs`{{bear-list}}`); 15 | 16 | assert.equal(this.$().text().trim(), ''); 17 | 18 | // Template block usage: 19 | this.render(hbs` 20 | {{#bear-list}} 21 | template block text 22 | {{/bear-list}} 23 | `); 24 | 25 | assert.equal(this.$().text().trim(), 'template block text'); 26 | }); 27 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/test-helper.js: -------------------------------------------------------------------------------- 1 | import resolver from './helpers/resolver'; 2 | import { 3 | setResolver 4 | } from 'ember-qunit'; 5 | 6 | setResolver(resolver); 7 | -------------------------------------------------------------------------------- /ember-computed-properties/tests/unit/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/tests/unit/.gitkeep -------------------------------------------------------------------------------- /ember-computed-properties/tests/unit/routes/application-test.js: -------------------------------------------------------------------------------- 1 | import { moduleFor, test } from 'ember-qunit'; 2 | 3 | moduleFor('route:application', 'Unit | Route | application', { 4 | // Specify the other units that are required for this test. 5 | // needs: ['controller:foo'] 6 | }); 7 | 8 | test('it exists', function(assert) { 9 | var route = this.subject(); 10 | assert.ok(route); 11 | }); 12 | -------------------------------------------------------------------------------- /ember-computed-properties/vendor/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-computed-properties/vendor/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "bower_components", 3 | "analytics": false 4 | } 5 | -------------------------------------------------------------------------------- /ember-fundamentals/.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent 2 | # coding styles between different editors and IDEs 3 | # editorconfig.org 4 | 5 | root = true 6 | 7 | 8 | [*] 9 | end_of_line = lf 10 | charset = utf-8 11 | trim_trailing_whitespace = true 12 | insert_final_newline = true 13 | indent_style = space 14 | indent_size = 2 15 | 16 | [*.js] 17 | indent_style = space 18 | indent_size = 2 19 | 20 | [*.hbs] 21 | insert_final_newline = false 22 | indent_style = space 23 | indent_size = 2 24 | 25 | [*.css] 26 | indent_style = space 27 | indent_size = 2 28 | 29 | [*.html] 30 | indent_style = space 31 | indent_size = 2 32 | 33 | [*.{diff,md}] 34 | trim_trailing_whitespace = false 35 | -------------------------------------------------------------------------------- /ember-fundamentals/.ember-cli: -------------------------------------------------------------------------------- 1 | { 2 | /** 3 | Ember CLI sends analytics information by default. The data is completely 4 | anonymous, but there are times when you might want to disable this behavior. 5 | 6 | Setting `disableAnalytics` to true will prevent any data from being sent. 7 | */ 8 | "disableAnalytics": false 9 | } 10 | -------------------------------------------------------------------------------- /ember-fundamentals/.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | 7 | # dependencies 8 | /node_modules 9 | /bower_components 10 | 11 | # misc 12 | /.sass-cache 13 | /connect.lock 14 | /coverage/* 15 | /libpeerconnection.log 16 | npm-debug.log 17 | testem.log 18 | -------------------------------------------------------------------------------- /ember-fundamentals/.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "predef": [ 3 | "document", 4 | "window", 5 | "-Promise" 6 | ], 7 | "browser": true, 8 | "boss": true, 9 | "curly": true, 10 | "debug": false, 11 | "devel": true, 12 | "eqeqeq": true, 13 | "evil": true, 14 | "forin": false, 15 | "immed": false, 16 | "laxbreak": false, 17 | "newcap": true, 18 | "noarg": true, 19 | "noempty": false, 20 | "nonew": false, 21 | "nomen": false, 22 | "onevar": false, 23 | "plusplus": false, 24 | "regexp": false, 25 | "undef": true, 26 | "sub": true, 27 | "strict": false, 28 | "white": false, 29 | "eqnull": true, 30 | "esnext": true, 31 | "unused": true 32 | } 33 | -------------------------------------------------------------------------------- /ember-fundamentals/.travis.yml: -------------------------------------------------------------------------------- 1 | --- 2 | language: node_js 3 | node_js: 4 | - "0.12" 5 | 6 | sudo: false 7 | 8 | cache: 9 | directories: 10 | - node_modules 11 | 12 | before_install: 13 | - export PATH=/usr/local/phantomjs-2.0.0/bin:$PATH 14 | - "npm config set spin false" 15 | - "npm install -g npm@^2" 16 | 17 | install: 18 | - npm install -g bower 19 | - npm install 20 | - bower install 21 | 22 | script: 23 | - npm test 24 | -------------------------------------------------------------------------------- /ember-fundamentals/.watchmanconfig: -------------------------------------------------------------------------------- 1 | { 2 | "ignore_dirs": ["tmp"] 3 | } 4 | -------------------------------------------------------------------------------- /ember-fundamentals/README.md: -------------------------------------------------------------------------------- 1 | # Ember.js Fundamentals 2 | 3 | > [https://www.youtube.com/watch?v=53OpEYA4zPQ](https://www.youtube.com/watch?v=53OpEYA4zPQ) 4 | 5 | Install [Node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app and `http://localhost:4200` to view. 11 | 12 | ## Further Reading / Useful Links 13 | 14 | * [ember.js](http://emberjs.com/) 15 | * [ember-cli](http://www.ember-cli.com/) 16 | * Development Browser Extensions 17 | * [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi) 18 | * [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/) 19 | -------------------------------------------------------------------------------- /ember-fundamentals/app/app.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | import Resolver from 'ember/resolver'; 3 | import loadInitializers from 'ember/load-initializers'; 4 | import config from './config/environment'; 5 | 6 | var App; 7 | 8 | Ember.MODEL_FACTORY_INJECTIONS = true; 9 | 10 | App = Ember.Application.extend({ 11 | modulePrefix: config.modulePrefix, 12 | podModulePrefix: config.podModulePrefix, 13 | Resolver: Resolver 14 | }); 15 | 16 | loadInitializers(App, config.modulePrefix); 17 | 18 | export default App; 19 | -------------------------------------------------------------------------------- /ember-fundamentals/app/components/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/components/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/app/components/bear-list.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | 3 | export default Ember.Component.extend({ 4 | bears: [], 5 | actions: { 6 | addBear: function () { 7 | let bearName = this.get('bearName'); 8 | this.get('bears').pushObject(bearName); 9 | }, 10 | saveBears: function () { 11 | this.sendAction('action', this.get('bears')); 12 | } 13 | } 14 | }); 15 | -------------------------------------------------------------------------------- /ember-fundamentals/app/controllers/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/controllers/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/app/controllers/application.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | 3 | export default Ember.Controller.extend({ 4 | }); 5 | -------------------------------------------------------------------------------- /ember-fundamentals/app/helpers/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/helpers/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | EmberFundamentals 7 | 8 | 9 | 10 | {{content-for 'head'}} 11 | 12 | 13 | 14 | 15 | {{content-for 'head-footer'}} 16 | 17 | 18 | {{content-for 'body'}} 19 | 20 | 21 | 22 | 23 | {{content-for 'body-footer'}} 24 | 25 | 26 | -------------------------------------------------------------------------------- /ember-fundamentals/app/models/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/models/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/app/router.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | import config from './config/environment'; 3 | 4 | var Router = Ember.Router.extend({ 5 | location: config.locationType 6 | }); 7 | 8 | Router.map(function() { 9 | }); 10 | 11 | export default Router; 12 | -------------------------------------------------------------------------------- /ember-fundamentals/app/routes/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/routes/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/app/routes/application.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | 3 | export default Ember.Route.extend({ 4 | model: function () { 5 | return $.get('bears.json'); 6 | }, 7 | actions: { 8 | storeTheBears: function (bears) { 9 | $.post('/api/bears', bears); 10 | } 11 | } 12 | }); 13 | -------------------------------------------------------------------------------- /ember-fundamentals/app/styles/app.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/styles/app.css -------------------------------------------------------------------------------- /ember-fundamentals/app/templates/application.hbs: -------------------------------------------------------------------------------- 1 | {{bear-list bears=model action="storeTheBears"}} 2 | -------------------------------------------------------------------------------- /ember-fundamentals/app/templates/components/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/app/templates/components/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/app/templates/components/bear-list.hbs: -------------------------------------------------------------------------------- 1 | {{input value=bearName}} 2 | 3 |
    4 | {{#each bears as |bear|}} 5 |
  • {{bear}}
    • 6 | {{/each}} 7 |
8 | 9 | 10 | -------------------------------------------------------------------------------- /ember-fundamentals/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ember-fundamentals", 3 | "dependencies": { 4 | "ember": "1.13.7", 5 | "ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3", 6 | "ember-cli-test-loader": "ember-cli-test-loader#0.1.3", 7 | "ember-data": "1.13.8", 8 | "ember-load-initializers": "ember-cli/ember-load-initializers#0.1.5", 9 | "ember-qunit": "0.4.9", 10 | "ember-qunit-notifications": "0.0.7", 11 | "ember-resolver": "~0.1.18", 12 | "jquery": "^1.11.3", 13 | "loader.js": "ember-cli/loader.js#3.2.1", 14 | "qunit": "~1.18.0" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /ember-fundamentals/config/environment.js: -------------------------------------------------------------------------------- 1 | /* jshint node: true */ 2 | 3 | module.exports = function(environment) { 4 | var ENV = { 5 | modulePrefix: 'ember-fundamentals', 6 | environment: environment, 7 | baseURL: '/', 8 | locationType: 'auto', 9 | EmberENV: { 10 | FEATURES: { 11 | // Here you can enable experimental features on an ember canary build 12 | // e.g. 'with-controller': true 13 | } 14 | }, 15 | 16 | APP: { 17 | // Here you can pass flags/options to your application instance 18 | // when it is created 19 | } 20 | }; 21 | 22 | if (environment === 'development') { 23 | // ENV.APP.LOG_RESOLVER = true; 24 | // ENV.APP.LOG_ACTIVE_GENERATION = true; 25 | // ENV.APP.LOG_TRANSITIONS = true; 26 | // ENV.APP.LOG_TRANSITIONS_INTERNAL = true; 27 | // ENV.APP.LOG_VIEW_LOOKUPS = true; 28 | } 29 | 30 | if (environment === 'test') { 31 | // Testem prefers this... 32 | ENV.baseURL = '/'; 33 | ENV.locationType = 'none'; 34 | 35 | // keep test console output quieter 36 | ENV.APP.LOG_ACTIVE_GENERATION = false; 37 | ENV.APP.LOG_VIEW_LOOKUPS = false; 38 | 39 | ENV.APP.rootElement = '#ember-testing'; 40 | } 41 | 42 | if (environment === 'production') { 43 | 44 | } 45 | 46 | return ENV; 47 | }; 48 | -------------------------------------------------------------------------------- /ember-fundamentals/ember-cli-build.js: -------------------------------------------------------------------------------- 1 | /* global require, module */ 2 | var EmberApp = require('ember-cli/lib/broccoli/ember-app'); 3 | 4 | module.exports = function(defaults) { 5 | var app = new EmberApp(defaults, { 6 | // Add options here 7 | }); 8 | 9 | // Use `app.import` to add additional libraries to the generated 10 | // output files. 11 | // 12 | // If you need to use different assets in different 13 | // environments, specify an object as the first parameter. That 14 | // object's keys should be the environment name and the values 15 | // should be the asset to use in that environment. 16 | // 17 | // If the library that you are including contains AMD or ES6 18 | // modules that you would like to import into your application 19 | // please specify an object with the list of modules as keys 20 | // along with the exports of each module as its value. 21 | 22 | return app.toTree(); 23 | }; 24 | -------------------------------------------------------------------------------- /ember-fundamentals/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ember-fundamentals", 3 | "version": "0.0.0", 4 | "description": "Small description for ember-fundamentals goes here", 5 | "private": true, 6 | "directories": { 7 | "doc": "doc", 8 | "test": "tests" 9 | }, 10 | "scripts": { 11 | "build": "ember build", 12 | "start": "ember server", 13 | "test": "ember test" 14 | }, 15 | "repository": "", 16 | "engines": { 17 | "node": ">= 0.10.0" 18 | }, 19 | "author": "", 20 | "license": "MIT", 21 | "devDependencies": { 22 | "broccoli-asset-rev": "^2.1.2", 23 | "ember-cli": "1.13.8", 24 | "ember-cli-app-version": "0.5.0", 25 | "ember-cli-babel": "^5.1.3", 26 | "ember-cli-content-security-policy": "0.4.0", 27 | "ember-cli-dependency-checker": "^1.0.1", 28 | "ember-cli-htmlbars": "0.7.9", 29 | "ember-cli-htmlbars-inline-precompile": "^0.2.0", 30 | "ember-cli-ic-ajax": "0.2.1", 31 | "ember-cli-inject-live-reload": "^1.3.1", 32 | "ember-cli-qunit": "^1.0.0", 33 | "ember-cli-release": "0.2.3", 34 | "ember-cli-sri": "^1.0.3", 35 | "ember-cli-uglify": "^1.2.0", 36 | "ember-data": "1.13.8", 37 | "ember-disable-proxy-controllers": "^1.0.0", 38 | "ember-export-application-global": "^1.0.3" 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /ember-fundamentals/public/bears.json: -------------------------------------------------------------------------------- 1 | ["polar", "grizzly", "brown"] 2 | -------------------------------------------------------------------------------- /ember-fundamentals/public/crossdomain.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 15 | 16 | -------------------------------------------------------------------------------- /ember-fundamentals/public/robots.txt: -------------------------------------------------------------------------------- 1 | # http://www.robotstxt.org 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /ember-fundamentals/testem.json: -------------------------------------------------------------------------------- 1 | { 2 | "framework": "qunit", 3 | "test_page": "tests/index.html?hidepassed", 4 | "disable_watching": true, 5 | "launch_in_ci": [ 6 | "PhantomJS" 7 | ], 8 | "launch_in_dev": [ 9 | "PhantomJS", 10 | "Chrome" 11 | ] 12 | } 13 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "predef": [ 3 | "document", 4 | "window", 5 | "location", 6 | "setTimeout", 7 | "$", 8 | "-Promise", 9 | "define", 10 | "console", 11 | "visit", 12 | "exists", 13 | "fillIn", 14 | "click", 15 | "keyEvent", 16 | "triggerEvent", 17 | "find", 18 | "findWithAssert", 19 | "wait", 20 | "DS", 21 | "andThen", 22 | "currentURL", 23 | "currentPath", 24 | "currentRouteName" 25 | ], 26 | "node": false, 27 | "browser": false, 28 | "boss": true, 29 | "curly": true, 30 | "debug": false, 31 | "devel": false, 32 | "eqeqeq": true, 33 | "evil": true, 34 | "forin": false, 35 | "immed": false, 36 | "laxbreak": false, 37 | "newcap": true, 38 | "noarg": true, 39 | "noempty": false, 40 | "nonew": false, 41 | "nomen": false, 42 | "onevar": false, 43 | "plusplus": false, 44 | "regexp": false, 45 | "undef": true, 46 | "sub": true, 47 | "strict": false, 48 | "white": false, 49 | "eqnull": true, 50 | "esnext": true, 51 | "unused": true 52 | } 53 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/helpers/resolver.js: -------------------------------------------------------------------------------- 1 | import Resolver from 'ember/resolver'; 2 | import config from '../../config/environment'; 3 | 4 | var resolver = Resolver.create(); 5 | 6 | resolver.namespace = { 7 | modulePrefix: config.modulePrefix, 8 | podModulePrefix: config.podModulePrefix 9 | }; 10 | 11 | export default resolver; 12 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/helpers/start-app.js: -------------------------------------------------------------------------------- 1 | import Ember from 'ember'; 2 | import Application from '../../app'; 3 | import config from '../../config/environment'; 4 | 5 | export default function startApp(attrs) { 6 | var application; 7 | 8 | var attributes = Ember.merge({}, config.APP); 9 | attributes = Ember.merge(attributes, attrs); // use defaults, but you can override; 10 | 11 | Ember.run(function() { 12 | application = Application.create(attributes); 13 | application.setupForTesting(); 14 | application.injectTestHelpers(); 15 | }); 16 | 17 | return application; 18 | } 19 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | EmberFundamentals Tests 7 | 8 | 9 | 10 | {{content-for 'head'}} 11 | {{content-for 'test-head'}} 12 | 13 | 14 | 15 | 16 | 17 | {{content-for 'head-footer'}} 18 | {{content-for 'test-head-footer'}} 19 | 20 | 21 | 22 | {{content-for 'body'}} 23 | {{content-for 'test-body'}} 24 | 25 | 26 | 27 | 28 | 29 | 30 | {{content-for 'body-footer'}} 31 | {{content-for 'test-body-footer'}} 32 | 33 | 34 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/integration/components/bear-list-test.js: -------------------------------------------------------------------------------- 1 | import { moduleForComponent, test } from 'ember-qunit'; 2 | import hbs from 'htmlbars-inline-precompile'; 3 | 4 | moduleForComponent('bear-list', 'Integration | Component | bear list', { 5 | integration: true 6 | }); 7 | 8 | test('it renders', function(assert) { 9 | assert.expect(2); 10 | 11 | // Set any properties with this.set('myProperty', 'value'); 12 | // Handle any actions with this.on('myAction', function(val) { ... }); 13 | 14 | this.render(hbs`{{bear-list}}`); 15 | 16 | assert.equal(this.$().text().trim(), ''); 17 | 18 | // Template block usage: 19 | this.render(hbs` 20 | {{#bear-list}} 21 | template block text 22 | {{/bear-list}} 23 | `); 24 | 25 | assert.equal(this.$().text().trim(), 'template block text'); 26 | }); 27 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/test-helper.js: -------------------------------------------------------------------------------- 1 | import resolver from './helpers/resolver'; 2 | import { 3 | setResolver 4 | } from 'ember-qunit'; 5 | 6 | setResolver(resolver); 7 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/unit/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/tests/unit/.gitkeep -------------------------------------------------------------------------------- /ember-fundamentals/tests/unit/controllers/application-test.js: -------------------------------------------------------------------------------- 1 | import { moduleFor, test } from 'ember-qunit'; 2 | 3 | moduleFor('controller:application', { 4 | // Specify the other units that are required for this test. 5 | // needs: ['controller:foo'] 6 | }); 7 | 8 | // Replace this with your real tests. 9 | test('it exists', function(assert) { 10 | var controller = this.subject(); 11 | assert.ok(controller); 12 | }); 13 | -------------------------------------------------------------------------------- /ember-fundamentals/tests/unit/routes/application-test.js: -------------------------------------------------------------------------------- 1 | import { moduleFor, test } from 'ember-qunit'; 2 | 3 | moduleFor('route:application', 'Unit | Route | application', { 4 | // Specify the other units that are required for this test. 5 | // needs: ['controller:foo'] 6 | }); 7 | 8 | test('it exists', function(assert) { 9 | var route = this.subject(); 10 | assert.ok(route); 11 | }); 12 | -------------------------------------------------------------------------------- /ember-fundamentals/vendor/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/ember-fundamentals/vendor/.gitkeep -------------------------------------------------------------------------------- /essential-es6-es2015/README.md: -------------------------------------------------------------------------------- 1 | # Essential ES6 / ES2015 JavaScript 2 | 3 | > [http://youtu.be/CozSF5abcTA](http://youtu.be/CozSF5abcTA) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `devDependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /essential-es6-es2015/index.js: -------------------------------------------------------------------------------- 1 | /* 2 | * let 3 | */ 4 | // let type = 'grizzly' 5 | // 6 | // while (true) { 7 | // let type = 'polar' 8 | // console.log(type) 9 | // break 10 | // } 11 | // 12 | // console.log(type) 13 | 14 | 15 | /* 16 | * const 17 | */ 18 | // const PI = Math.PI 19 | // PI = 123 20 | 21 | // const moment = require('moment') 22 | 23 | 24 | /* 25 | * class, extends, super 26 | */ 27 | // class Bear { 28 | // constructor () { 29 | // this.type = 'bear' 30 | // } 31 | // says (say) { 32 | // console.log(this.type + ' says ' + say) 33 | // } 34 | // } 35 | // 36 | // class Grizzly extends Bear { 37 | // constructor () { 38 | // super() 39 | // this.type = 'grizzly' 40 | // } 41 | // } 42 | // 43 | // let bear = new Grizzly() 44 | // bear.says('growl') 45 | 46 | 47 | /* 48 | * arrow functions 49 | */ 50 | // let bears = ['polar', 'koala'].filter((bear) => { 51 | // return bear !== 'koala' 52 | // }) 53 | // console.log(bears) 54 | 55 | // class Bear { 56 | // constructor () { 57 | // this.type = 'bear' 58 | // } 59 | // says (say) { 60 | // setTimeout(() => { 61 | // console.log(this.type + ' says ' + say) 62 | // }, 1000) 63 | // } 64 | // } 65 | // var bear = new Bear() 66 | // bear.says() 67 | 68 | 69 | /* 70 | * multiline strings 71 | */ 72 | // let bears = ` 73 | // grizzly 74 | // polar 75 | // ` 76 | 77 | 78 | /* 79 | * template strings 80 | */ 81 | // let bear = 'grizzly' 82 | // let says = 'growl' 83 | // console.log(`The ${bear} says ${says}`) 84 | 85 | 86 | /* 87 | * destructuring 88 | */ 89 | // let bear = 'grizzly' 90 | // let says = 'growl' 91 | // let zoo = { bear, says } 92 | // //console.log(zoo) 93 | // 94 | // let grizzly = { type: 'grizzly', many: 2 } 95 | // let { type, many } = grizzly 96 | // console.log(many, type) 97 | 98 | 99 | /* 100 | * default arguments 101 | */ 102 | function bear (type='grizzly') { 103 | console.log(type) 104 | } 105 | //bear() 106 | 107 | 108 | /* 109 | * rest arguments 110 | */ 111 | function bears (...types) { 112 | console.log(types) 113 | } 114 | bears('polar', 'grizzly', 'brown') 115 | -------------------------------------------------------------------------------- /essential-es6-es2015/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "essential-es6-es2015", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "babel": "^5.4.7", 13 | "babelify": "^6.1.2" 14 | }, 15 | "browserify": { 16 | "transform": [ 17 | "babelify" 18 | ] 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /getting-started-with-browserify/README.md: -------------------------------------------------------------------------------- 1 | # Getting Started with Browserify 2 | 3 | > [http://youtu.be/CTAa8IcQh1U](http://youtu.be/CTAa8IcQh1U) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm run build` to build or `npm run watch` to build as you edit files. 11 | -------------------------------------------------------------------------------- /getting-started-with-browserify/app.js: -------------------------------------------------------------------------------- 1 | var $ = require('jquery') 2 | 3 | var button = require('./buttons/button.js') 4 | 5 | $('body').append(button) 6 | -------------------------------------------------------------------------------- /getting-started-with-browserify/buttons/button.js: -------------------------------------------------------------------------------- 1 | var $ = require('jquery') 2 | 3 | var button = $('` 22 | css(el, { 23 | 'border-radius': 10 24 | }) 25 | return el 26 | } 27 | 28 | var bears = ['Polar', 'Brown', 'Grizzly'] 29 | var element = list(bears, function onadd () { 30 | bears.push('Black') 31 | yo.update(element, list(bears, onadd)) 32 | }) 33 | document.body.appendChild(element) 34 | -------------------------------------------------------------------------------- /learn-to-yo-yo/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "learn-to-yo-yo", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js", 8 | "test": "node test.js" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT", 12 | "devDependencies": { 13 | "budo": "^11.2.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /learning-js-functions/README.md: -------------------------------------------------------------------------------- 1 | # Learning JavaScript Functions 2 | 3 | > [https://www.youtube.com/watch?v=jEx9V4uUcg0](https://www.youtube.com/watch?v=jEx9V4uUcg0) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `devDependencies`. 9 | 10 | Then run `npm start` to start up a development server on `http://localhost:9966` 11 | -------------------------------------------------------------------------------- /learning-js-functions/index.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | var context = { 4 | type: 'grizzly', 5 | says: 'grr' 6 | } 7 | 8 | bear = bear.bind(context) 9 | 10 | //var says = bear.apply(context, ['grr', 'grizzly']) 11 | var says = bear() 12 | console.log(says) 13 | 14 | // var bear = function() { 15 | // return 'The ' + arguments[0] + ' bear says: ' + arguments[1] 16 | // } 17 | 18 | function bear() { 19 | console.log(this) 20 | return 'The ' + this.type + ' bear says: ' + this.says 21 | } 22 | -------------------------------------------------------------------------------- /learning-js-functions/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "learning-js-functions", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live-plugin" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "budo": "^2.1.2", 13 | "watchify": "^3.1.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /mastering-callbacks/README.md: -------------------------------------------------------------------------------- 1 | # Mastering JavaScript Callbacks 2 | 3 | > [https://www.youtube.com/watch?v=qN0dkXj7jc0](https://www.youtube.com/watch?v=qN0dkXj7jc0) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `node index.js` to run the node examples and `npm start` to run the browser examples. 11 | -------------------------------------------------------------------------------- /mastering-callbacks/bears.dictionary: -------------------------------------------------------------------------------- 1 | grizzly 2 | polar 3 | brown 4 | -------------------------------------------------------------------------------- /mastering-callbacks/bears.txt: -------------------------------------------------------------------------------- 1 | grizzly 2 | polar 3 | brown 4 | koala 5 | cheetah 6 | -------------------------------------------------------------------------------- /mastering-callbacks/brown.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/mastering-callbacks/brown.jpg -------------------------------------------------------------------------------- /mastering-callbacks/grizzly.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/mastering-callbacks/grizzly.jpg -------------------------------------------------------------------------------- /mastering-callbacks/index.js: -------------------------------------------------------------------------------- 1 | // Callback Chain 2 | var fs = require('fs') 3 | 4 | function getBears (filepath, done) { 5 | fs.readFile(filepath, function (err, bears) { 6 | if (err) return done(err) 7 | 8 | fs.readFile('bears.dictionary', function (err, dict) { 9 | if (err) return done(err) 10 | 11 | compareBears(bears, dict) 12 | }) 13 | }) 14 | 15 | function compareBears (bears, dict) { 16 | dict = dict.toString().split('\n') 17 | bears = bears.toString().split('\n').filter(function (bear) { 18 | return dict.indexOf(bear) !== -1 19 | }) 20 | done(null, bears) 21 | } 22 | } 23 | 24 | getBears('bears.txt', function (err, bears) { 25 | console.log(bears) 26 | }) 27 | 28 | // Callback Chunks 29 | // var bears = ['grizzly', 'polar', 'brown'] 30 | // var count = bears.length 31 | // 32 | // bears = bears.map(function (bear) { 33 | // var img = new Image() 34 | // img.onload = function () { 35 | // next() 36 | // } 37 | // img.src = bear + '.jpg' 38 | // return img 39 | // }) 40 | // 41 | // function next() { 42 | // count-- 43 | // if (count < 1) { 44 | // bears.forEach(function (bear) { 45 | // console.log(bear.width) 46 | // document.body.appendChild(bear) 47 | // }) 48 | // } 49 | // } 50 | 51 | // Callback Series 52 | // var bears = ['grizzly', 'polar', 'brown'] 53 | // var images = [] 54 | // 55 | // function loadBears () { 56 | // var bear = bears.shift() 57 | // if (!bear) { 58 | // console.log('All bears are done', images) 59 | // return 60 | // } 61 | // var img = new Image() 62 | // img.onload = function () { 63 | // loadBears() 64 | // } 65 | // img.src = bear + '.jpg' 66 | // images.push(img) 67 | // } 68 | // 69 | // loadBears() 70 | -------------------------------------------------------------------------------- /mastering-callbacks/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "mastering-callbacks", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js --live" 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "budo": "^11.2.0" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /mastering-callbacks/polar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/mastering-callbacks/polar.jpg -------------------------------------------------------------------------------- /multi-window-electron-desktop-app/README.md: -------------------------------------------------------------------------------- 1 | # Multi Window Electron Desktop Apps 2 | 3 | > [http://youtu.be/K-H2amwQ_pU](http://youtu.be/K-H2amwQ_pU) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app. 11 | -------------------------------------------------------------------------------- /multi-window-electron-desktop-app/app.js: -------------------------------------------------------------------------------- 1 | const {app, BrowserWindow, ipcMain} = require('electron') 2 | 3 | app.on('ready', function () { 4 | var mainWindow = new BrowserWindow({ 5 | width: 800, 6 | height: 600 7 | }) 8 | mainWindow.loadURL('file://' + __dirname + '/main.html') 9 | mainWindow.openDevTools() 10 | 11 | var prefsWindow = new BrowserWindow({ 12 | width: 400, 13 | height: 400, 14 | show: false 15 | }) 16 | prefsWindow.loadURL('file://' + __dirname + '/prefs.html') 17 | 18 | ipcMain.on('toggle-prefs', function () { 19 | if (prefsWindow.isVisible()) 20 | prefsWindow.hide() 21 | else 22 | prefsWindow.show() 23 | }) 24 | 25 | }) -------------------------------------------------------------------------------- /multi-window-electron-desktop-app/main.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Main 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /multi-window-electron-desktop-app/main.js: -------------------------------------------------------------------------------- 1 | const {remote, ipcRenderer} = require('electron') 2 | const {Menu, MenuItem} = remote 3 | 4 | const menu = new Menu() 5 | 6 | menu.append(new MenuItem( 7 | { 8 | label: 'Electron', 9 | submenu: [ 10 | { 11 | label: 'Prefs', 12 | click: function () { 13 | ipcRenderer.send('toggle-prefs') 14 | } 15 | } 16 | ] 17 | }) 18 | ) 19 | 20 | Menu.setApplicationMenu(menu) -------------------------------------------------------------------------------- /multi-window-electron-desktop-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "create-multi-window-electron-app", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "app.js", 6 | "scripts": { 7 | "start": "electron ." 8 | }, 9 | "author": "Kyle Robinson Young (http://dontkry.com)", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "electron-prebuilt": "^0.28.3" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /multi-window-electron-desktop-app/prefs.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Prefs 7 | 17 | 18 | -------------------------------------------------------------------------------- /node-process-child-process/README.md: -------------------------------------------------------------------------------- 1 | # Node.js Process and Child Process 2 | 3 | > [http://youtu.be/9o8B3L0-d9c](http://youtu.be/9o8B3L0-d9c) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Run `node index.js` to run the example. 8 | -------------------------------------------------------------------------------- /node-process-child-process/index.js: -------------------------------------------------------------------------------- 1 | var spawn = require('child_process').spawn 2 | 3 | var bears = 0 4 | 5 | bears += 1 6 | 7 | if (process.argv[2] === 'child') { 8 | var net = require('net') 9 | var pipe = new net.Socket({ fd: 3 }) 10 | pipe.write('killme') 11 | //console.log('child', bears) 12 | } else { 13 | var child = spawn(process.execPath, [__filename, 'child'], { 14 | stdio: [null, null, null, 'pipe'] 15 | }) 16 | child.stdio[3].on('data', function (data) { 17 | if (data.toString() === 'killme') { 18 | console.log('RIP') 19 | child.kill() 20 | } 21 | }) 22 | //console.log('parent', bears) 23 | //child.stdout.pipe(process.stdout) 24 | } 25 | -------------------------------------------------------------------------------- /node-process-child-process/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "node-process-child-process", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js", 8 | "test": "node test.js" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT" 12 | } 13 | -------------------------------------------------------------------------------- /node-streams/README.md: -------------------------------------------------------------------------------- 1 | # Node.js / io.js Stream Primer 2 | 3 | > [http://youtu.be/yOSNQZm3Trw](http://youtu.be/yOSNQZm3Trw) 4 | 5 | Install [io.js](https://iojs.org/en/index.html) or [node.js](https://nodejs.org/). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app. 11 | -------------------------------------------------------------------------------- /node-streams/actualbears.txt: -------------------------------------------------------------------------------- 1 | grizzly 2 | brown 3 | polar 4 | panda 5 | -------------------------------------------------------------------------------- /node-streams/bears.txt: -------------------------------------------------------------------------------- 1 | grizzly 2 | brown 3 | polar 4 | koala 5 | panda 6 | -------------------------------------------------------------------------------- /node-streams/index.js: -------------------------------------------------------------------------------- 1 | var fs = require('fs') 2 | var Transform = require('stream').Transform 3 | var inherits = require('util').inherits 4 | 5 | function ActualBears () { 6 | Transform.call(this) 7 | } 8 | inherits(ActualBears, Transform) 9 | 10 | ActualBears.prototype._transform = function (chunk, enc, done) { 11 | chunk = chunk.toString().split('\n').filter(function (bear) { 12 | return (bear !== 'koala') 13 | }).join('\n') 14 | this.push(chunk) 15 | done() 16 | } 17 | 18 | var read = fs.createReadStream('bears.txt') 19 | var write = fs.createWriteStream('actualbears.txt') 20 | 21 | read.pipe(new ActualBears()).pipe(write) 22 | -------------------------------------------------------------------------------- /node-streams/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "streams", 3 | "version": "0.1.0", 4 | "description": "A primer on node.js streams ", 5 | "main": "index.js", 6 | "author": "Kyle Robinson Young (http://dontkry.com)", 7 | "license": "MIT", 8 | "scripts":{ 9 | "start":"node ./index.js" 10 | }, 11 | "devDependencies": { 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /nodejs-cli/README.md: -------------------------------------------------------------------------------- 1 | # Creating a Node.js CLI 2 | 3 | > [https://www.youtube.com/watch?v=C9xGEJ80jjs](https://www.youtube.com/watch?v=C9xGEJ80jjs) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Run `./cli.js` to run the example. 8 | -------------------------------------------------------------------------------- /nodejs-cli/bear.txt: -------------------------------------------------------------------------------- 1 | ˁ˚ᴥ˚ˀ 2 | -------------------------------------------------------------------------------- /nodejs-cli/bears.txt: -------------------------------------------------------------------------------- 1 | ʕ•ᴥ•ʔ 2 | ˁ˚ᴥ˚ˀ 3 | ʕ·͡ᴥ·ʔ 4 | óÔÔò 5 | (●￣(ｴ)￣ ●) 6 | ⊂(・(ェ)・)⊃ 7 | ʕ•͡ ᴥ•͡ ʔ 8 | ʕ•͡ᴥ•ʔ 9 | (●｀･(ｴ)･ ´●) 10 | ʕノ•ᴥ•ʔノ ︵ ┻━┻ 11 | -------------------------------------------------------------------------------- /nodejs-cli/cli.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | 3 | var fs = require('fs'); 4 | var path = require('path'); 5 | 6 | fs.readFile(path.resolve(__dirname, 'bears.txt'), function (err, data) { 7 | var bears = data.toString().split('\n'); 8 | var bear = bears[Math.floor(Math.random() * bears.length)]; 9 | console.log(bear); 10 | }); 11 | -------------------------------------------------------------------------------- /nodejs-cli/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "bearme", 3 | "version": "1.1.0", 4 | "description": "", 5 | "main": "cli.js", 6 | "bin": { 7 | "bearme": "cli.js" 8 | }, 9 | "scripts": { 10 | "start": "budo index.js", 11 | "test": "node test.js" 12 | }, 13 | "author": "Kyle Robinson Young (http://dontkry.com)", 14 | "license": "MIT" 15 | } 16 | -------------------------------------------------------------------------------- /nodejs-server/README.md: -------------------------------------------------------------------------------- 1 | # Running a Node.js Server Forever 2 | 3 | > [http://youtu.be/P4mT5Tbx_KE](http://youtu.be/P4mT5Tbx_KE) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Then run `node server.js` to run the app. 8 | -------------------------------------------------------------------------------- /nodejs-server/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nodejs-server", 3 | "version": "0.1.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "budo index.js", 8 | "test": "node test.js" 9 | }, 10 | "author": "Kyle Robinson Young (http://dontkry.com)", 11 | "license": "MIT" 12 | } 13 | -------------------------------------------------------------------------------- /nodejs-server/server.js: -------------------------------------------------------------------------------- 1 | var http = require('http'); 2 | 3 | var server = http.createServer(function (request, response) { 4 | if (request.url === '/') { 5 | response.setHeader('Content-Type', 'text/html'); 6 | response.end('obligatory bear!'); 7 | } 8 | }); 9 | 10 | server.listen(8080, function () { 11 | console.log('Im listening on port 8080'); 12 | }); 13 | -------------------------------------------------------------------------------- /p2p-video-chat-webrtc/README.md: -------------------------------------------------------------------------------- 1 | # P2P Video Chat with JavaScript / WebRTC 2 | 3 | > [https://www.youtube.com/watch?v=ieBtXwHvoNk](https://www.youtube.com/watch?v=ieBtXwHvoNk) 4 | 5 | Install [io.js](https://iojs.org/en/index.html). 6 | 7 | Within this folder run the terminal command `npm install` to install the 8 | `dependencies` and `devDependencies`. 9 | 10 | Then run `npm start` to run the app. 11 | -------------------------------------------------------------------------------- /p2p-video-chat-webrtc/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 |
11 |
12 | 13 |
14 | 15 |
16 | 17 | 18 | 

19 | 
20 |     
21 |   
22 | 
23 | 


--------------------------------------------------------------------------------
/p2p-video-chat-webrtc/index.js:
--------------------------------------------------------------------------------
 1 | var getUserMedia = require('getusermedia')
 2 | 
 3 | getUserMedia({ video: true, audio: false }, function (err, stream) {
 4 |   if (err) return console.error(err)
 5 | 
 6 |   var Peer = require('simple-peer')
 7 |   var peer = new Peer({
 8 |     initiator: location.hash === '#init',
 9 |     trickle: false,
10 |     stream: stream
11 |   })
12 | 
13 |   peer.on('signal', function (data) {
14 |     document.getElementById('yourId').value = JSON.stringify(data)
15 |   })
16 | 
17 |   document.getElementById('connect').addEventListener('click', function () {
18 |     var otherId = JSON.parse(document.getElementById('otherId').value)
19 |     peer.signal(otherId)
20 |   })
21 | 
22 |   document.getElementById('send').addEventListener('click', function () {
23 |     var yourMessage = document.getElementById('yourMessage').value
24 |     peer.send(yourMessage)
25 |   })
26 | 
27 |   peer.on('data', function (data) {
28 |     document.getElementById('messages').textContent += data + '\n'
29 |   })
30 | 
31 |   peer.on('stream', function (stream) {
32 |     var video = document.createElement('video')
33 |     document.body.appendChild(video)
34 | 
35 |     video.src = window.URL.createObjectURL(stream)
36 |     video.play()
37 |   })
38 | })
39 | 


--------------------------------------------------------------------------------
/p2p-video-chat-webrtc/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "p2p-video-chat-webrtc",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js:bundle.js"
 8 |   },
 9 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
10 |   "license": "MIT",
11 |   "devDependencies": {
12 |     "budo": "^4.1.0"
13 |   },
14 |   "dependencies": {
15 |     "getusermedia": "^1.3.5",
16 |     "simple-peer": "^5.11.4"
17 |   }
18 | }
19 | 


--------------------------------------------------------------------------------
/packaging-distributing-electron-apps/Icon.icns:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/shama/letswritecode/3102a79da3b7289dd2a6dd70f57b7dcb50b53d9d/packaging-distributing-electron-apps/Icon.icns


--------------------------------------------------------------------------------
/packaging-distributing-electron-apps/README.md:
--------------------------------------------------------------------------------
 1 | # Packaging and Distributing Electron Apps
 2 | 
 3 | > [http://youtu.be/dz5SnmBzBXc](http://youtu.be/dz5SnmBzBXc)
 4 | 
 5 | Install [io.js](https://iojs.org/en/index.html).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the
 8 | `dependencies` and `devDependencies`.
 9 | 
10 | Then run `npm start` to run the app and `npm run build` to build the distributable.
11 | 


--------------------------------------------------------------------------------
/packaging-distributing-electron-apps/index.html:
--------------------------------------------------------------------------------
1 | 
2 |   
3 |     
4 |   
5 |   
6 |     Look at this amazing app!
7 |   
8 | 
9 | 


--------------------------------------------------------------------------------
/packaging-distributing-electron-apps/index.js:
--------------------------------------------------------------------------------
 1 | var app = require('app')
 2 | var BrowserWindow = require('browser-window')
 3 | 
 4 | app.on('ready', function() {
 5 |   var mainWindow = new BrowserWindow({
 6 |     width: 800,
 7 |     height: 600
 8 |   })
 9 |   mainWindow.loadUrl('file://' + __dirname + '/index.html')
10 | })
11 | 


--------------------------------------------------------------------------------
/packaging-distributing-electron-apps/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "packaging-distributing-electron-apps",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "electron .",
 8 |     "package": "asar pack MyApp.app/Contents/Resources/app MyApp.app/Contents/Resources/app.asar",
 9 |     "build": "electron-packager . MyApp --ignore=node_modules/electron-* && cp Icon.icns MyApp.app/Contents/Resources/atom.icns"
10 |   },
11 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
12 |   "license": "MIT",
13 |   "devDependencies": {
14 |     "asar": "^0.6.1",
15 |     "electron-packager": "^3.2.0",
16 |     "electron-prebuilt": "^0.25.2"
17 |   }
18 | }
19 | 


--------------------------------------------------------------------------------
/simple-p2p-with-webrtc/README.md:
--------------------------------------------------------------------------------
 1 | # P2P Signaling for WebRTC
 2 | # I MADE A WEBRTC MISTAKE
 3 | 
 4 | > [https://youtu.be/jY9k4rfXwEI](https://youtu.be/jY9k4rfXwEI)
 5 | 
 6 | > UPDATED with WebRTC: [https://www.youtube.com/watch?v=IqPJb6o_S1Q](https://www.youtube.com/watch?v=IqPJb6o_S1Q)
 7 | 
 8 | Install [Node.js](https://nodejs.org/).
 9 | 
10 | Within this folder run the terminal command `npm install` to install the
11 | `dependencies` and `devDependencies`.
12 | 
13 | Then run `npm start` to run the app viewable on `http://localhost:9966`.
14 | 


--------------------------------------------------------------------------------
/simple-p2p-with-webrtc/index.js:
--------------------------------------------------------------------------------
 1 | navigator.mediaDevices.getUserMedia({ video: true, audio: true }).then(function (stream) {
 2 | 
 3 |   const signalhub = require('signalhub')
 4 |   const createSwarm = require('webrtc-swarm')
 5 |   const hub = signalhub('my-game', [
 6 |     'http://localhost:8080'
 7 |   ])
 8 |   const swarm = createSwarm(hub, {
 9 |     stream: stream
10 |   })
11 | 
12 |   const Player = require('./player.js')
13 |   const you = new Player()
14 |   you.addStream(stream)
15 | 
16 |   const players = {}
17 |   swarm.on('connect', function (peer, id) {
18 |     if (!players[id]) {
19 |       players[id] = new Player()
20 |       peer.on('data', function (data) {
21 |         data = JSON.parse(data.toString())
22 |         players[id].update(data)
23 |       })
24 |       players[id].addStream(peer.stream)
25 |     }
26 |   })
27 | 
28 |   swarm.on('disconnect', function (peer, id) {
29 |     if (players[id]) {
30 |       players[id].element.parentNode.removeChild(players[id].element)
31 |       delete players[id]
32 |     }
33 |   })
34 | 
35 |   // hub.subscribe('update').on('data', function (data) {
36 |   //   if (data.color === you.color) return
37 |   //   if (!players[data.color]) {
38 |   //     players[data.color] = new Player(data)
39 |   //   }
40 |   //   players[data.color].update(data)
41 |   //   //console.log(data)
42 |   // })
43 | 
44 |   setInterval(function () {
45 |     //hub.broadcast('update', window.location.hash)
46 |     you.update()
47 |     //hub.broadcast('update', you)
48 |     const youString = JSON.stringify(you)
49 |     swarm.peers.forEach(function (peer) {
50 |       peer.send(youString)
51 |     })
52 |   }, 100)
53 | 
54 |   document.addEventListener('keypress', function (e) {
55 |     const speed = 16
56 |     switch (e.key) {
57 |       case 'a':
58 |         you.x -= speed
59 |         break
60 |       case 'd':
61 |         you.x += speed
62 |         break
63 |       case 'w':
64 |         you.y -= speed
65 |         break
66 |       case 's':
67 |         you.y += speed
68 |         break
69 |     }
70 |   }, false)
71 | 
72 | })
73 | 
74 | 


--------------------------------------------------------------------------------
/simple-p2p-with-webrtc/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "simple-p2p-with-webrtc",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js",
 8 |     "signalhub": "signalhub listen -p 8080"
 9 |   },
10 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
11 |   "license": "MIT",
12 |   "devDependencies": {
13 |     "budo": "^11.2.0"
14 |   },
15 |   "dependencies": {
16 |     "signalhub": "^4.9.0",
17 |     "webrtc-swarm": "^2.9.0"
18 |   }
19 | }
20 | 


--------------------------------------------------------------------------------
/simple-p2p-with-webrtc/player.js:
--------------------------------------------------------------------------------
 1 | module.exports = Player
 2 | 
 3 | function Player (data) {
 4 |   data = data || {}
 5 |   this.color = data.color || randomColor()
 6 |   this.x = 0
 7 |   this.y = 0
 8 |   this.element = document.createElement('video')
 9 |   Object.assign(this.element.style, {
10 |     width: '64px',
11 |     height: '64px',
12 |     position: 'absolute',
13 |     top: '0px',
14 |     left: '0px',
15 |     backgroundColor: this.color
16 |   })
17 |   document.body.appendChild(this.element)
18 | }
19 | 
20 | Player.prototype.addStream = function (stream) {
21 |   this.element.srcObject = stream
22 |   this.element.play()
23 | }
24 | 
25 | Player.prototype.update = function (data) {
26 |   data = data || {}
27 |   this.x = data.x || this.x
28 |   this.y = data.y || this.y
29 |   Object.assign(this.element.style, {
30 |     top: this.y + 'px',
31 |     left: this.x + 'px'
32 |   })
33 | }
34 | 
35 | function randomColor () {
36 |   return '#' + Math.random().toString(16).substr(-6)
37 | }


--------------------------------------------------------------------------------
/tagged-template-literals/README.md:
--------------------------------------------------------------------------------
 1 | # ES6 Tagged Template Literals
 2 | 
 3 | > [https://www.youtube.com/watch?v=c9j0avG5L4c](https://www.youtube.com/watch?v=c9j0avG5L4c)
 4 | 
 5 | Install [Node.js](https://nodejs.org/).
 6 | 
 7 | Then run `node index.js` to run the example.
 8 | 
 9 | Or `npm start` and go to http://localhost:9966 in the browser.
10 | 


--------------------------------------------------------------------------------
/tagged-template-literals/index.js:
--------------------------------------------------------------------------------
 1 | // var polar = false
 2 | // var bears = `
 3 | // ${polar ? 'Polar' : ''}
 4 | // Brown
 5 | // Grizzly
 6 | // `
 7 | // var out = `Bears: ${bears.split('\n').join(', ')}`
 8 | // console.log(out)
 9 | 
10 | // var bears = ['Polar', 'Brown', 'Grizzly']
11 | // var html = `
    
12 | //   ${bears.map(function (bear) {
13 | //     return `
  • ${bear}
    • `
14 | //   }).join('')}
15 | // 
`
16 | // console.log(html)
17 | 
18 | var bear = 'Grizzly'
19 | var createElement = html`
${bear}
`
20 | 
21 | function html (strings, expr1, expr2, expr3) {
22 |   return function () {
23 |     var el = document.createElement('div')
24 |     el.textContent = expr1
25 |     return el
26 |   }
27 | }
28 | 
29 | document.body.appendChild(createElement())
30 | 
31 | 


--------------------------------------------------------------------------------
/tagged-template-literals/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "tagged-template-literals",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js",
 8 |     "test": "node test.js"
 9 |   },
10 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
11 |   "license": "MIT",
12 |   "devDependencies": {
13 |     "budo": "^8.3.0"
14 |   }
15 | }
16 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
2 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/.travis.yml:
--------------------------------------------------------------------------------
 1 | language: node_js
 2 | node_js:
 3 |   - '0.12'
 4 |   - 'iojs'
 5 | script: npm run ci
 6 | addons:
 7 |   sauce_connect: true
 8 | env:
 9 |   global:
10 |     - secure: PTDi7UrASZKjXckDSHkMS6ele+T7t27BcjDYnryU10ppxcTbBGl01VXqvmvmrnGrMQZiAdrm8UtsA+ce1X1k+zCS50z1noGOnS+PbZ6+/5omuZKly5Nx0NdIJvQIR5yTV4NNqADTsfWN1MHB4NmDnidIC3AY3m0R3LLBWjQbmQ7cRkwHJPDb3g6ze0vWfGStjj6c7SEVG/jhU75YQtbRI6EkzWtu7FKv7WLOK7qPTPeg84mvxmTwexuPHlE6NoVBwuSTaK4nUkEPHxHU7M5UuTL00HExxc7vI6fpw1DuVaCItIrlheFq14N5yi/eBn0s8fK6DvLVF64fA4tlB2DnFj1mDcfzA06YKqea9T4IaYMSnifPZL3XjlJM2UbGN+4FuX2U/cl6PIn/CxS34tKdNcIS8bY/XZpZLxtWfQnO4YUFbCSIKLm4d3oETHTIfZJ1q/840tgYVTfM7/kOEKqi4UtodAJVuGuWVZLXyL0LYDzlu121OeUiRLITR9UmPmfjUQtRW6VLGaBKbIm/pL9IANLFtg63MPB27GbRyOplmLk4fboRnsgg08TBBKMYsX7R/EKQ5JxgJDd/gLRhYot61nx+cdhaka6w68EHqpgsmIDjyibNQXZkDKFEqeh0AV+pZtbgBYXHUiPffEdVUFJ9rIQFLARS2I9twNwY/FN5FAo=
11 |     - secure: AmE9PJkhoVibQhxQx2fsevuQkOn0XJF85uiSdPuKwF3OxXX7SjDmr26C6ejPIrCCDqaAYrWmMR7pcwoM5pfapnqq4cTgFgA8g6Jgl9XkGZyAJTzYJ4TsnIb1jVdpWfsvVFuobDQ4VhzVGh8sUYqUS2a8zvk8SWZ9KZAXeZJrV6k8QslqE/EKzirU66fubQRY2md3TgtSSPJtU7pUg4mKOPzhwTRx7RVYdubldRUUW5DSQ+aKMrrWCxoLUFXrHKcgNT3H3NrU2jkwJexE83XUX1lmEdwWojbcIB8enuLVXiEXDfsIFVl5pPk9rcqwjEFAmHImH1g864umnmcuMHKggn02s4YcnzrN2kFm2fTJknQBzM7QC/hEt8C6Lwy/IqlA3X12P5NPFo0he1sSgx4FbWiHYwqmtK1pC9esQ2YtK7xlw2chN33gyQYOglbr2OIihFQ+PyNiylAj+FZP4odw7ZBFal5kjJ9awPWlvlrzlKOcOU49o2D4LuNsfOBkWfXez31lK9vtZbOcaeZ02Et7G71eSwD2jJ9Sg9tD4Yqj7fUwD05fbFlvjwwVJFnB1GgtV6xPLoil3ro2l1qsgkbilBiUiLPKYd+9AbmUH8F5tjZWKx6OaFONeWhUKkiziMVNGp80aiD+NoWzD35fX+4fesIsIa9P23q2JUJNmb4T1Qc=
12 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/.zuul.yml:
--------------------------------------------------------------------------------
1 | ui: tape
2 | browsers:
3 |   - name: chrome
4 |     version: latest
5 |   - name: firefox
6 |     version: latest
7 |     
8 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/README.md:
--------------------------------------------------------------------------------
 1 | # Testing Client/Server JavaScript
 2 | 
 3 | > [http://youtu.be/lLqCXLYCqTI](http://youtu.be/lLqCXLYCqTI)
 4 | 
 5 | Install [io.js](https://iojs.org/en/index.html).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the `devDependencies`.
 8 | 
 9 | Then run `npm test` to test the code locally.
10 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/index.js:
--------------------------------------------------------------------------------
1 | module.exports = Bear
2 | 
3 | function Bear (type) {
4 |   this.type = type || 'any'
5 | }
6 | Bear.prototype.growl = function (says) {
7 |   return 'The ' + this.type + ' bear says ' + (says || 'grrr')
8 | }
9 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "testing-client-server-javascript",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "test": "node test.js && zuul --local 9966 -- test.js",
 8 |     "ci": "node test.js && zuul -- test.js"
 9 |   },
10 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
11 |   "license": "MIT",
12 |   "devDependencies": {
13 |     "tape": "^4.0.0",
14 |     "zuul": "^3.1.0"
15 |   }
16 | }
17 | 


--------------------------------------------------------------------------------
/testing-client-server-javascript/test.js:
--------------------------------------------------------------------------------
 1 | var Bear = require('./index.js')
 2 | var test = require('tape')
 3 | 
 4 | test('should growl', function (assert) {
 5 |   var bear = new Bear()
 6 |   var result = bear.growl()
 7 |   assert.equal(result, 'The any bear says grrr')
 8 |   assert.end()
 9 | })
10 | 


--------------------------------------------------------------------------------
/transform-your-bundles-with-browserify/README.md:
--------------------------------------------------------------------------------
 1 | # Transform Your Bundles With Browserify
 2 | 
 3 | > [http://youtu.be/Uk2bgp8OLT8](http://youtu.be/Uk2bgp8OLT8)
 4 | 
 5 | Install [io.js](https://iojs.org/en/index.html).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the
 8 | `dependencies` and `devDependencies`.
 9 | 
10 | Then run `npm run build` to build or `npm start` to build as you edit files.
11 | 


--------------------------------------------------------------------------------
/transform-your-bundles-with-browserify/bears.txt:
--------------------------------------------------------------------------------
1 | grizzly
2 | polar
3 | brown
4 | 


--------------------------------------------------------------------------------
/transform-your-bundles-with-browserify/bundle.js:
--------------------------------------------------------------------------------
1 | (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o (http://dontkry.com)",
11 |   "license": "MIT",
12 |   "devDependencies": {
13 |     "brfs": "^1.4.0",
14 |     "browserify": "^10.2.3",
15 |     "budo": "^4.0.0",
16 |     "through2": "^0.6.5"
17 |   },
18 |   "browserify": {
19 |     "transform": [
20 |       "./transform.js"
21 |     ]
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/transform-your-bundles-with-browserify/transform.js:
--------------------------------------------------------------------------------
 1 | var through = require('through2')
 2 | module.exports = function (file) {
 3 |   var entireFile = []
 4 |   return through(function (part, enc, next) {
 5 |     entireFile.push(part)
 6 |     next()
 7 |   }, function (done) {
 8 |     entireFile = entireFile.join('')
 9 | 
10 |     entireFile = entireFile.replace(/hi/g, 'hello')
11 |     this.push(entireFile)
12 |     done()
13 |   })
14 | }
15 | 


--------------------------------------------------------------------------------
/two-d-animations-with-canvas-javascript/README.md:
--------------------------------------------------------------------------------
 1 | # 2D Animations with Canvas and JavaScript
 2 | 
 3 | > [https://www.youtube.com/watch?v=TpRYLEFu4Mc](https://www.youtube.com/watch?v=TpRYLEFu4Mc)
 4 | 
 5 | Install [io.js](https://iojs.org/en/index.html).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the
 8 | `devDependencies`.
 9 | 
10 | Then run `npm start` to start up a development server on `http://localhost:9966`
11 | 


--------------------------------------------------------------------------------
/two-d-animations-with-canvas-javascript/index.js:
--------------------------------------------------------------------------------
 1 | var canvas = document.createElement('canvas')
 2 | document.body.appendChild(canvas)
 3 | 
 4 | canvas.width = window.screen.width
 5 | canvas.height = window.screen.height
 6 | 
 7 | var context = canvas.getContext('2d')
 8 | 
 9 | //context.fillStyle = 'red'
10 | //context.fillRect(0, 0, 100, 100)
11 | 
12 | // context.fillStyle = 'green'
13 | // context.fillRect(200, 0, 100, 100)
14 | 
15 | var x = 0
16 | var y = 0
17 | window.requestAnimationFrame(function loop() {
18 |   //x += 1
19 |   //y += .5
20 | 
21 |   context.clearRect(0, 0, canvas.width, canvas.height)
22 | 
23 |   context.fillStyle = 'red'
24 |   context.fillRect(x, 0, 100, 100)
25 | 
26 |   context.fillStyle = 'green'
27 |   context.fillRect(200, y, 100, 100)
28 | 
29 |   window.requestAnimationFrame(loop)
30 | })
31 | 
32 | 
33 | document.addEventListener('mousedown', function(event) {
34 |   if (event.button === 0) {
35 |     x += 10
36 |   }
37 |   if (event.button === 2) {
38 |     y += 10
39 |   }
40 | })
41 | 


--------------------------------------------------------------------------------
/two-d-animations-with-canvas-javascript/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "my-project",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js --live"
 8 |   },
 9 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
10 |   "license": "MIT",
11 |   "devDependencies": {
12 |     "budo": "^3.0.4",
13 |     "watchify": "^3.1.0"
14 |   },
15 |   "dependencies": {
16 |   }
17 | }
18 | 


--------------------------------------------------------------------------------
/vuejs-computed-properties/App.vue:
--------------------------------------------------------------------------------
 1 | 
12 | 
13 | 


--------------------------------------------------------------------------------
/vuejs-computed-properties/README.md:
--------------------------------------------------------------------------------
 1 | # Vue.js Computed Properties
 2 | 
 3 | > [https://www.youtube.com/watch?v=8antoF7LyIo](https://www.youtube.com/watch?v=8antoF7LyIo)
 4 | 
 5 | Install [Node.js](https://nodejs.org/).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the
 8 | `dependencies` and `devDependencies`.
 9 | 
10 | Then run `npm start` to run the app viewable on `http://localhost:9966`.
11 | 


--------------------------------------------------------------------------------
/vuejs-computed-properties/index.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | 
 4 |   
 5 |   Document
 6 | 
 7 | 
 8 |   

 9 |   
10 | 
11 | 


--------------------------------------------------------------------------------
/vuejs-computed-properties/index.js:
--------------------------------------------------------------------------------
 1 | const Vue = require('vue')
 2 | const App = require('./App.vue')
 3 | 
 4 | const beardb = {
 5 |   'bear1': {
 6 |     name: 'Oliver',
 7 |     type: 'grizzly'
 8 |   },
 9 |   'bear3': {
10 |     name: 'Sheryl',
11 |     type: 'brown'
12 |   },
13 |   'bear55': {
14 |     name: 'Frank',
15 |     type: 'polar'
16 |   },
17 | }
18 | 
19 | new Vue({
20 |   el: '#app',
21 |   render: function (h) {
22 |     return h(App, {
23 |       props: {
24 |         beardb: beardb
25 |       }
26 |     })
27 |   }
28 | })


--------------------------------------------------------------------------------
/vuejs-computed-properties/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "vuejs-computed-properties",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js:bundle.js -- -t vueify",
 8 |     "test": "node test.js"
 9 |   },
10 |   "browser": {
11 |     "vue": "vue/dist/vue.common.js"
12 |   },
13 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
14 |   "license": "MIT",
15 |   "devDependencies": {
16 |     "budo": "^11.2.0",
17 |     "vueify": "^9.4.1"
18 |   },
19 |   "dependencies": {
20 |     "vue.js": "^0.3.2"
21 |   }
22 | }
23 | 


--------------------------------------------------------------------------------
/what-is-async-javascript/README.md:
--------------------------------------------------------------------------------
 1 | # What is Async JavaScript?
 2 | 
 3 | > [https://www.youtube.com/watch?v=y8xPMYwQ0U8](https://www.youtube.com/watch?v=y8xPMYwQ0U8)
 4 | 
 5 | Install [Node.js](https://nodejs.org/).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the
 8 | `devDependencies`.
 9 | 
10 | Run `node index.js` to run the script through the server side.
11 | 
12 | Then run `npm start` to start up a development server on `http://localhost:9966`
13 | and run the scripts through the client side.
14 | 
15 | Use the `node-debug` command by installing [node-inspector](https://www.npmjs.com/package/node-inspector)
16 | 


--------------------------------------------------------------------------------
/what-is-async-javascript/index.js:
--------------------------------------------------------------------------------
 1 | var nets = require('nets')
 2 | 
 3 | nets('one.bear', function (err, resp, one) {
 4 |   console.log(one.toString())
 5 |   done()
 6 | })
 7 | nets('two.bear', function (err, resp, two) {
 8 |   console.log(two.toString())
 9 |   done()
10 | })
11 | nets('three.bear', function (err, resp, three) {
12 |   console.log(three.toString())
13 |   done()
14 | })
15 | 
16 | var count = 0
17 | function done () {
18 |   count++
19 |   if (count >= 3) {
20 |     console.log('All done')
21 |   }
22 | }
23 | 
24 | 
25 | // var fs = require('fs')
26 | //
27 | // fs.readFile('one.bear', function (err, one) {
28 | //   console.log(one)
29 | // })
30 | // fs.readFile('two.bear', function (err, two) {
31 | //   console.log(two)
32 | // })
33 | // fs.readFile('three.bear', function (err, three) {
34 | //   console.log(three)
35 | // })
36 | 


--------------------------------------------------------------------------------
/what-is-async-javascript/one.bear:
--------------------------------------------------------------------------------
1 | one
2 | 


--------------------------------------------------------------------------------
/what-is-async-javascript/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "what-is-async-javascript",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js",
 8 |     "test": "node test.js"
 9 |   },
10 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
11 |   "license": "MIT",
12 |   "devDependencies": {
13 |     "budo": "^7.1.0"
14 |   },
15 |   "dependencies": {
16 |     "nets": "^3.2.0"
17 |   }
18 | }
19 | 


--------------------------------------------------------------------------------
/what-is-async-javascript/three.bear:
--------------------------------------------------------------------------------
1 | three
2 | 


--------------------------------------------------------------------------------
/what-is-isomorphic-javascript/README.md:
--------------------------------------------------------------------------------
 1 | # What is Isomorphic JavaScript?
 2 | 
 3 | > [http://youtu.be/Q6TAMCH0lL0](http://youtu.be/Q6TAMCH0lL0)
 4 | 
 5 | Install [io.js](https://iojs.org/en/index.html).
 6 | 
 7 | Within this folder run the terminal command `npm install` to install the
 8 | `devDependencies`.
 9 | 
10 | Run `node index.js` to run the script through the server side.
11 | 
12 | Then run `npm start` to start up a development server on `http://localhost:9966` and run the scripts through the client side.
13 | 


--------------------------------------------------------------------------------
/what-is-isomorphic-javascript/bears.txt:
--------------------------------------------------------------------------------
1 | polar
2 | grizzly
3 | brown
4 | black
5 | 


--------------------------------------------------------------------------------
/what-is-isomorphic-javascript/fake-fs.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   readFile: function (name, done) {
3 |     // JSON API
4 |     done(null, 'polar\ngrizzly')
5 |   }
6 | }
7 | 


--------------------------------------------------------------------------------
/what-is-isomorphic-javascript/index.js:
--------------------------------------------------------------------------------
 1 | // var fs = require('fs')
 2 | // function upperCaseRead (filename, done) {
 3 | //   fs.readFile(filename, function (err, file) {
 4 | //     done(null, file.toString().toUpperCase())
 5 | //   })
 6 | // }
 7 | //
 8 | // upperCaseRead('bears.txt', function (err, file) {
 9 | //   console.log(file)
10 | // })
11 | 
12 | var document = require('global/document')
13 | 
14 | var ul = document.createElement('ul')
15 | var bears = ['grizzly', 'polar']
16 | 
17 | bears.forEach(function (bear) {
18 |   var li = document.createElement('li')
19 |   li.innerText = bear
20 |   ul.appendChild(li)
21 | })
22 | 
23 | //document.body.appendChild(ul)
24 | 
25 | console.log(ul.toString())
26 | 


--------------------------------------------------------------------------------
/what-is-isomorphic-javascript/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "what-is-isomorphic-javascript",
 3 |   "version": "0.1.0",
 4 |   "description": "",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "start": "budo index.js --live -- --require ./fake-fs.js:fs"
 8 |   },
 9 |   "author": "Kyle Robinson Young  (http://dontkry.com)",
10 |   "license": "MIT",
11 |   "devDependencies": {
12 |     "browserify": "^10.2.1",
13 |     "budo": "^4.0.0"
14 |   },
15 |   "dependencies": {
16 |     "global": "^4.3.0"
17 |   }
18 | }
19 | 


--------------------------------------------------------------------------------