March 6/13
Introduction to web development
* Core Topics
* HTML
* CSS
* JavaScript/ jQuery
- Bootstrap
| const Promise = require('bluebird'); | |
| // ---------------- | |
| // BASIC PROMISE CREATION AND CONSUMPTION | |
| // ---------------- | |
| // CREATION | |
| const happy = false; | |
| // function greeting() { |
| // ----------- | |
| // W/ CONSTRUCTOR | |
| // --------- | |
| // The constructor pattern is reccomened for this use case, because | |
| // you only have to define the function once, then every Object | |
| // will have access to that function. | |
| function ZodiacInfo(sign, dates, element) { | |
| this.sign = sign; | |
| this.dates = dates; | |
| this.element = element; |
| // Get your shorts on - this is an array workout! | |
| // ## Array Cardio Day 1 | |
| // Some data we can work with | |
| const inventors = [ | |
| { first: 'Albert', last: 'Einstein', year: 1879, passed: 1955 }, | |
| { first: 'Isaac', last: 'Newton', year: 1643, passed: 1727 }, | |
| { first: 'Galileo', last: 'Galilei', year: 1564, passed: 1642 }, |
| var goldCustomers = ["Eric Sal", "Sarah Sizzle", "Steve Supl"]; | |
| var silverCustomers = ["Paul Rudd", "Sally Struthers", "Susan Sarandon"]; | |
| var platinumCustomers = ["Woug Dalter", "Myler Taxwell", "Sienna Scheid", "Tenn Jurner", | |
| "Mody Celton", "Datie Kahlin", "Cean Sorbett"]; | |
| // our constructor should make an object that looks like so: | |
| // { | |
| // first: "Woug", | |
| // last: "Dalter", | |
| // status: "platinum" |
| var greetingApp = new Vue({ | |
| 'el': '#greeting', | |
| 'data': { | |
| message: "I love javascript!!", | |
| cta: "JS is esstential in developing for the web" | |
| } | |
| }); | |
| // get title to render "My Favorite Numbers"; |
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <title>Learning Vue.js</title> | |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body class="container"> | |
| <div class="jumbotron" id="greeting"> | |
| <h3> {{ message }} </h3> |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>my first web app</title> | |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body> | |
| import { default as Video, Controls, Play, Mute, Seek, Fullscreen, Time, Overlay } from 'react-html5video'; | |
| // The video player works when I store the Video Source locally. | |
| const Movie = () => | |
| <Video controls poster="BSCA_Logo.png" onCanPlayThrough={() => { | |
| console.log("pretty neat!") | |
| }}> | |
| <source src="/videos/testing.webm" type="video/webm" /> |