Lectures for Web Programming

• js_statements
• js_variables
• js_functions test yourself
• Scope js_scope
• Variable declared outside function, becomes GLOBAL.
  All scripts and functions on page can access it.
  
• Variables declared within a JavaScript function, become LOCAL to the function.
• Variables created without the keyword var, are always global, even if created inside a function.
  
• Global variables live as long as your application lives
  
• Local variables have short lives. They are created when the function is invoked, and deleted when the function is finished.
  

• js_events
• js_if_else
• js_arrays
• Debugging js_debugging
• Best Practices js_best_practices
• Avoid Global Variables ... Use local variables instead, and learn how to use closures.
  
• Always Declare Local Variables
  
• Declarations on Top
  
• Initialize Variables
  
• Never Declare Number, String, or Boolean Objects

• js_htmldom_methods
• js_htmldom_elements
• js_htmldom_html
• js_htmldom_css
• js_htmldom_events
• js_htmldom_eventlistener
• Reference: jsref/dom_obj_style

• Welcome (1:07)
• What you should know (0:34)
• Using the exercise files (0:16)

• Browsers and browser testing (5:42)
• Open the browser developer tools (2:10)
• Inspect HTML (1:58)
• Inspect CSS (4:51)
• Test mobile layouts (4:11)
• The browser JavaScript console (4:24)
• JavaScript breakpoints (4:09)
• Browser add-ons, extensions, and plugins (4:00)

• Text editors and IDEs (5:46)
• Code autocompletion (3:11)
• Code snippets (5:03)

• CSS reset style sheets (1:45)
• Front-end frameworks (6:52)
• CSS preprocessors (4:25)

• Workflow automation tools (1:34)
• Working with the command line (5:54)
• Automating with Grunt.js or Gulp.js (3:07)
• Git and version control (1:51)

• Next steps (0:44)

• Editing with Atom (0:45)
• Using the exercises for this course (0:54)

• Downloading and installing Atom (4:55)
• Introduction to the Atom interface (7:17)
• Files and the Command Palette (5:05)
• Managing tabs and panes (7:30)
• Symbols and bookmarks (3:37)
• Managing and folding content (3:55)

• Modifying content (4:17)
• Changing text (1:59)
• Selections and multiple cursors (6:00)
• Find and Replace (8:55)

• Modifying core preferences (10:31)
• Changing editor preferences (8:44)
• Using Keyboard Bindings (6:46)
• Customizing Atom packages (6:48)
• Using themes (4:17)
• Customizing themes (6:13)
• Creating your own snippet shortcuts (4:31)
• Snippets (8:30)

• Pair coding with Atom (3:58)
• Installing and configuring Atom IDE (3:28)
• Exploring the enhanced IDE features (4:54)
• Other useful packages (3:47)

• Creating a Git repository with Atom (6:25)
• Working with GitHub (6:49)
• Other Git and GitHub packages (2:02)

• Next steps (2:20)

• Use Git version control software to manage project code (1:07)

• Version control (2:57)
• The history behind Git (8:41)
• About distributed version control (5:03)

• Install Git on a Mac (4:20)
• Install Git on Windows (3:27)
• Install Git on Linux (1:43)
• Basic Git configuration (5:26)
• Git auto-completion (5:46)
• Git help (1:41)

• Initialize a repository (2:09)
• Where Git files are stored (2:09)
• Your first commit (2:16)
• Write a commit message (3:56)
• View the commit log (3:36)

• The three trees (3:02)
• Git workflows (2:16)
• Hash values (SHA-1) (3:27)
• The HEAD pointer (4:34)

• Add files (5:22)
• Edit files (5:09)
• View changes with diff (4:07)
• View only staged changes (3:11)
• Delete files (4:35)
• Move and rename files (4:22)

• The Explore California website (1:52)
• Initialize Git (4:06)
• View file edits (5:11)
• Stage and commit shortcut (2:13)
• View a commit (3:01)
• Compare commits (3:43)
• Multiline commit messages (3:48)
• Make atomic commits (7:49)
• Challenge: Client edits (2:33)
• Solution: Client edits (5:16)

• Undo working directory changes (2:47)
• Unstage files (2:50)
• Amend commits (5:49)
• Retrieve old versions (4:47)
• Revert a commit (2:58)
• Remove untracked files (3:34)

• Use .gitignore files (5:59)
• Ideas on what to ignore (2:23)
• Globally ignore files (1:35)
• Ignore tracked files (4:50)
• Track empty directories (3:59)

• Next steps (0:24)

• Welcome (1:07)
• How to use the exercise files (1:39)

• What is JavaScript? (2:38)
• How does JavaScript relate to Java? (2:00)
• Navigating the JavaScript landscape (3:49)

• Tools for JavaScript development (2:23)
• Introducing the browser console (10:31)
• Add inline JavaScript to a HTML document (4:47)
• Add JavaScript in an external file (4:57)
• How to write JavaScript: A crash course (4:24)

• Variables: The catch-all containers of JavaScript (6:11)
• Data types in JavaScript (4:03)
• Arithmetic operators and math (4:13)
• Working with strings and numbers (2:37)
• Conditional statements and logic (5:42)
• Advanced conditions and logic (3:27)
• Arrays (2:20)
• Properties and methods in arrays (7:56)

• Functions in JavaScript (3:28)
• Build a basic function (3:29)
• Add arguments to the function (2:30)
• Return values from a function (3:54)
• Anonymous functions (5:11)
• Immediately invoked funcitonal expressions (4:14)
• Variable scope (3:17)
• ES2015: let and const (6:12)
• Make sense of objects (3:19)
• Object constructors (6:16)
• Sidebar: Dot and bracket notation (2:44)
• Closures (8:11)

• DOM: The document object model (4:00)
• Target elements in the DOM with querySelector methods (5:52)
• Access and change elements (4:33)
• Access and change classes (3:45)
• Access and change attributes (4:53)
• Add DOM elements (6:56)
• Apply inline CSS to an element (6:32)

• Create an analog clock: Project breakdown (1:09)
• Use CSS to move clock hands (3:49)
• Use JavaScript to move clock hands (2:13)
• Get the current hour, minute, and second with the Date() object (1:33)
• Show the current time using fancy math (4:51)
• Make the clock move forward second by second (3:25)
• Solve the pesky "return to zero" problem (5:18)

• What are DOM events? (1:31)
• Some typical DOM events (1:59)
• Trigger functions with event handlers (5:15)
• Add and use event listeners (6:51)
• Pass arguments via event listners (4:30)

• Rundown of HTML markup (2:58)
• Use event listeners to detect typing (4:27)
• Build a count-up timer (5:56)
• Build a helper function for leading zeros (3:18)
• Detect spelling errors by matching strings (3:58)
• Stop the timer when the test is done (3:42)
• Add a reset button (5:03)

• Loops (3:37)
• Looping through arrays (4:07)
• Break and continue loops (7:09)

• Project breakdown (1:55)
• Rundown of project setup (3:26)
• Loop through all images in the document (3:51)
• Create function to generate srcset value (4:47)
• Create object containing different sizes values (4:34)
• Update img markup with srcset and sizes attributes (2:24)

• JavaScript validation and troubleshooting (1:30)
• Troubleshooting JavaScript (7:20)
• Send troubleshooting info to the console (7:42)
• Step through your JavaScript with browser tools (5:55)
• Online script linting (5:57)
• Automate script linting (8:24)
• Online script minification (2:50)
• Automate script minification (2:24)

• What are arrow functions (3:11)
• What do I learn first? Javascript? Typescript? (5:05)
• How do I write strings in ES2015? (2:31)
• What does the %symbol do? (3:47)
• Why use the querySelector() and querySelectorAll() methods? (2:48)

• Next Steps (1:55)

• Welcome (0:55)
• What you should know (0:37)
• Exercise files (1:02)

• Visual Studio Code, Chrome, and http-server (3:19)

• Access and use Chrome Developer Tools (3:10)
• Customize the display of Developer Tools (3:16)

• Inspect elements (3:55)
• Inspect styles (5:08)
• Use persistence to save changes (6:50)

• View Console messages (4:55)
• Log information to the Console (6:10)
• Use the Console command line (5:06)

• Open files in the developer tools (3:30)
• Work with breakpoints and the call stack (6:55)

• View HTTP request and response headers (5:26)
• Identify items that slow page loading (5:08)
• Emulate mobile connections (4:37)

• Next steps (0:35)

• Get Google Maps API Key (select Getting Started or Get API Key)
  
• Google Maps Embed API Pricing
• Create Google Map
• google.maps.Map class
  Constructor: Map(mapDiv:Element,opts?:MapOptions)
  var map1 = new google.maps.Map (
  document.getElementById('mapDiv'),
  objectLiteral);
• Google Maps Reference
• Change Center Point  need to know Geocode: lat & lng
  
• Create Geocode – http://www.gpsvisualizer.com/geocode 
  4 Huntington Street, New Brunswick, NJ
  
• Map Options | LatLng
  new google.maps.LatLng(40.505, -74.453)  or  {lat: 40.505, lng: -74.453}
• Change Map Type and Zoom Level.
• Google Maps Reference: MapTypeId  |  MapOptions Object (specify keys)
• Add Marker
  
• google.maps.Marker class
  Constructor: Marker(opts?:MarkerOptions)
  var marker1 = new google.maps.Marker (objectLiteral);
  
• Marker Reference
  

• Intro (1:19)
• What You Should Know (0:45)
• Using the Exercise Files (0:50)
• Challenges (0:37)
• Compatibility notes (1:22)

• What Is JavaScript? (1:48)
• Live examples (3:43)
• Anti-use Cases (1:31)

• Our friend, the Text Editor (5:15)
• Browsers and tools (3:21)
• Tools in action (6:50)
• Getting help (2:31)
• Jargon (4:42)
• Jargon: The DOM (2:14)

• Work with user info (4:16)
• Text fields (6:38)
• Select boxes (4:54)
• Radio buttons and checkboxes (5:05)
• Change submission with events (4:46)
• Start to validate input (5:05)
• Disable a field (6:49)
• Retrieve all the data from the cart (4:06)
• Total up a shopping cart (8:34)
• Explore and fix type errors (6:25)
• Get and set with innerHTML (6:20)
• Challenge: Add and use more fields (1:09)
• Solution: Add and use more fields (2:15)

• Use JS to tell time (4:13)
• Get pieces of time (4:49)
• Use timers to update the page (5:12)
• Polish the clock (5:06)
• Challenge: Add the date (0:51)
• Solution: Add the date (3:45)

• What is an API? (3:06)
• Create a map (7:18)
• Change the center point (2:25)
• Change the type and zoom level (8:19)
• Add a marker (3:08)
• Add a popup to the marker (3:40)
• Challenge: Modify the map (0:57)
• Solution: Modify the map (4:34)

• Next step: More about JavaScript (1:17)
• Next step: jQuery (0:46)
• Next step: JavaScript and Frameworks (0:55)

Create automateGeocodePlaceMarker (geocoderUse, locIndex, locArray, mapToUse)

geocoderUse.geocode({'address': locObjUse.address},

function(results, status) {

        if (status === 'OK') {

            // assign geocode to locObj + specify map to use + place marker

            // recursive function call   only if  locIndex + 1 < locArray.length

        } else {

            // Geocoder NOT OK because QUERY LIMIT triggered

            setTimeout(function(){automateGeocodePlaceMarker and use locIndex)

            https://www.w3schools.com/jsref/met_win_settimeout.asp

        }

• examples
• whereto
• syntax
• statements
• variables
• assignment
• datatypes
• functions
• objects
• scope
• events
• arrays
• array_methods
• if_else
• loop_for
• js-dom
• errors
• debugging
• best_practices
• mistakes
• Quiz

• Intro (1:19)
• What You Should Know (0:45)
• Using the Exercise Files (0:50)
• Challenges (0:37)
• Compatibility notes (1:22)

• What Is JavaScript? (1:48)
• Live examples (3:43)
• Anti-use Cases (1:31)

• Our friend, the Text Editor (5:15)
• Browsers and tools (3:21)
• Tools in action (6:50)
• Getting help (2:31)
• Jargon (4:42)
• Jargon: The DOM (2:14)

• Work with user info (4:16)
• Text fields (6:38)
• Select boxes (4:54)
• Radio buttons and checkboxes (5:05)
• Change submission with events (4:46)
• Start to validate input (5:05)
• Disable a field (6:49)
• Retrieve all the data from the cart (4:06)
• Total up a shopping cart (8:34)
• Explore and fix type errors (6:25)
• Get and set with innerHTML (6:20)
• Challenge: Add and use more fields (1:09)
• Solution: Add and use more fields (2:15)

• Use JS to tell time (4:13)
• Get pieces of time (4:49)
• Use timers to update the page (5:12)
• Polish the clock (5:06)
• Challenge: Add the date (0:51)
• Solution: Add the date (3:45)

• What is an API? (3:06)
• Create a map (7:18)
• Change the center point (2:25)
• Change the type and zoom level (8:19)
• Add a marker (3:08)
• Add a popup to the marker (3:40)
• Challenge: Modify the map (0:57)
• Solution: Modify the map (4:34)

• Next step: More about JavaScript (1:17)
• Next step: jQuery (0:46)
• Next step: JavaScript and Frameworks (0:55)

• Welcome (1:34)
• What you should know (0:46)
• Exercise files (0:38)

• Introducing our friend, the debugger (1:37)
• Important jargon and concepts (2:08)
• Debuggers in web browsers (3:15)
• The importance of a good editor and IDE (8:54)
• Why debugging AJAX can be tricky (2:18)

• Debugging without a debugger (5:16)
• Leverage more of the Console API (7:04)
• Stop and look around: Simple breakpoints (5:24)
• Explore other breakpoint options (7:47)
• Step into, over, and out of functions (5:48)
• Find out where you are using the call stack (4:34)
• Monitor variables with watches (5:16)
• Source maps to debug minified files (4:41)

• Debugging the use of a jQuery plugin (5:51)
• Debugging a React application in Chrome (9:00)
• Debugging on iOS using Simulator (6:45)
• Remote debugging on an Android device (3:23)
• Debugging a node application in WebStor:(11:31)
• Setting up the WordPress example (4:06)
• Debug a WordPress theme in Visual Studio Code (6:29)
• Use a debugger as a learning tool on a live site (6:31)

• Next steps (1:51)
• Extra JavaScript resources (3:36)

• Welcome (0:47)
• What you should know (0:29)
• Using the exercise files (0:45)

• What is ECMAScript 6? (1:29)
• ES6 browser support (1:14)
• Using ES6 now (1:06)

• Introduction to Babel (0:33)
• In-browser Babel transpiling (2:25)
• Transpiling with webpack (6:23)
• Migrating to webpack 3 (5:25)

• Let keyword (5:47)
• Const keyword (3:08)
• Template strings (5:09)
• Spread operators (2:17)
• Maps (5:09)
• Sets (4:24)
• The for ... of loop (4:37)

• Default function parameters (2:44)
• Enhancing object literals (4:27)
• Arrow functions (1:56)
• Arrow functions and the 'this' scope (5:00)
• Destructuring assignment (6:22)
• Generators (6:59)
• Symbols (3:39)
• Iterators (6:32)

• Intro to promises (6:39)
• Building promises (4:17)
• Loading data with fetch (5:15)
• Async and wait (4:28)
• Async with fetch (4:48)

• ES6 class syntax (2:37)
• Class inheritance (2:09)
• Getters and setters (4:52)

• Next steps (0:38)

• Installation: Basic or Advanced
• getbootstrap.com
• jquery.com
• Standard = CDN  vs  Customize = Download Source
• Grid System 12 columns - W3Schools
• Containers
• .container
• .container-fluid

• Learn the foundations of React development (0:35)
• What you should know (0:53)

• What is React? (0:57)
• Add React to an HTML page (1:38)
• Set up React Developer Tools (2:16)

• Create a React element (2:58)
• Render multiple React elements (In progress) (1:16)
• Using JSX (2:37)
• Other JSX features (2:20)

• Create a function component (2:50)
• Understanding React props (2:26)
• Composing components (1:51)
• Work with class components (1:00)
• Understanding React state (1:26)

• Using React events (2:35)
• Conditionally render components (3:20)
• Render components from a list (3:34)
• Render from a list of objects (3:04)

• Install create-react-app (2:58)
• Modularize the React application (3:19)
• Build a React project (2:26)

• Next steps (0:56)

• Using create-react-app (1:20)
• Generating a React project (2:52)

• Handling events (6:30)
• Adding state to the Note component (5:06)
• Using refs (1:27)
• Adding child elements (5:41)

• Updating notes (5:13)
• Removing notes (1:52)
• Adding notes (4:31)

• Overview of the component lifecycle (3:16)
• Updating components (2:28)
• Loading data (3:29)
• Style enhancements (7:18)
• Launching the Bulletin Board app (1:48)

• Create robust user interfaces with React.js (0:37)
• What you should know (0:44)
• Working with the exercise files (0:44)

• What is React? (0:59)
• Set up Chrome tools for React (0:57)
• Inspect React sites (1:31)

• Install create-react-app (1:28)
• Generate a project (3:02)
• Create React elements (4:20)
• Refactor elements using JavaScript as XML (JSX) (3:13)

• Create a React component (2:16)
• Add component properties (3:35)
• Create the SkiDayCounter component (5:16)
• Add custom methods (1:39)
• Create function components (3:53)

• Compose components (4:48)
• Display child components (4:42)
• Introducing state (3:30)
• Using setState (4:16)
• Pass state as props (2:58)
• Conditional rendering (3:05)

• Component life cycle (3:10)
• Fetching data (4:43)
• Accessibility (2:06)
• Forms (4:07)
• Default props (3:29)
• PropTypes (3:56)
• Modularizing code (3:58)
• Build the app (2:01)

• Next steps (0:36)

• Welcome (0:54)
• What you should know before watching this course (2:09)
• Using the exercise files (1:03)

• What is JSON? (2:54)
• Understanding objects and JSON (3:09)
• Creating simple data (2:42)
• Using JavaScript and JSON tools (5:48)

• Debugging JavaScript objects with your browser (4:03)
• Modifying Array objects in JavaScript (4:25)
• Looping through JavaScript objects (4:28)
• Accessing objects in arrays (4:32)

• Parsing JSON data with AJAX (4:37)
• Communicating across sites with JSONP (5:36)
• Using jQuery to parse JSON feeds (2:49)

• Setting up our HTML file (4:06)
• JavaScript templating with mustache.js (7:06)
• Rotating with jQuery Cycle (3:29)
• Styling our application (6:38)

• Next steps (1:37)

• Why you should learn Express (1:09)
• What you should know (1:40)
• Setting up and preparing the exercise files (0:50)

• Set up your development environment (2:54)

• The anatomy of an HTTP request (4:31)
• Creating a server with pure Node.js (8:30)
• Adding routes and logic to a pure Node.js server (9:55)
• Creating a server with Express (8:09)
• Understanding middleware, routes, and the request lifecycle (4:43)
• Handling errors in Express (5:54)
• Working with environments (3:35)

• Reviewing the provided HTML (1:25)
• Setting up the basic application structure (6:00)
• Creating the routes (8:55)
• Serving static files (5:04)

• Template engines in Express (2:26)
• Understanding Pug syntax (3:20)
• Adding Pug to our project (5:06)
• Creating a custom error page (11:56)
• Creating the index template (2:11)

• Creating reusable components with layouts and blocks (8:12)
• Using includes to factor out content (6:20)
• Creating the speakers list template (4:24)
• Creating the speakers detail template (6:11)
• Adding central configuration (3:29)
• Working with template variables (8:12)
• Adding dynamic data (15:48)
• Looping through data (15:59)
• Working with conditionals (11:22)
• Challenge: Finish the speakers detail page (0:49)
• Solution: Finish the speakers detail page (9:13)

• Creating a dynamic feedback page (9:44)
• Handling POST requests (6:23)
• Sanitizing user inputs and handling form errors (9:32)
• Storing data (3:22)

• Using Express generator (3:32)
• Next steps (0:46)

• Why you should learn Express (1:09)
• What you should know (1:40)
• Setting up and preparing the exercise files (0:50)

• Set up your development environment (2:54)

• The anatomy of an HTTP request (4:31)
• Creating a server with pure Node.js (8:30)
• Adding routes and logic to a pure Node.js server (9:55)
• Creating a server with Express (8:09)
• Understanding middleware, routes, and the request lifecycle (4:43)
• Handling errors in Express (5:54)
• Working with environments (3:35)

• Reviewing the provided HTML (1:25)
• Setting up the basic application structure (6:00)
• Creating the routes (8:55)
• Serving static files (5:04)

• Template engines in Express (2:26)
• Understanding Pug syntax (3:20)
• Adding Pug to our project (5:06)
• Creating a custom error page (11:56)
• Creating the index template (2:11)

• Creating reusable components with layouts and blocks (8:12)
• Using includes to factor out content (6:20)
• Creating the speakers list template (4:24)
• Creating the speakers detail template (6:11)
• Adding central configuration (3:29)
• Working with template variables (8:12)
• Adding dynamic data (15:48)
• Looping through data (15:59)
• Working with conditionals (11:22)
• Challenge: Finish the speakers detail page (0:49)
• Solution: Finish the speakers detail page (9:13)

• Creating a dynamic feedback page (9:44)
• Handling POST requests (6:23)
• Sanitizing user inputs and handling form errors (9:32)
• Storing data (3:22)

• Using Express generator (3:32)
• Next steps (0:46)

• Why you should learn Express (1:09)
• What you should know (1:40)
• Setting up and preparing the exercise files (0:50)

• Set up your development environment (2:54)

• The anatomy of an HTTP request (4:31)
• Creating a server with pure Node.js (8:30)
• Adding routes and logic to a pure Node.js server (9:55)
• Creating a server with Express (8:09)
• Understanding middleware, routes, and the request lifecycle (4:43)
• Handling errors in Express (5:54)
• Working with environments (3:35)

• Reviewing the provided HTML (1:25)
• Setting up the basic application structure (6:00)
• Creating the routes (8:55)
• Serving static files (5:04)

• Template engines in Express (2:26)
• Understanding Pug syntax (3:20)
• Adding Pug to our project (5:06)
• Creating a custom error page (11:56)
• Creating the index template (2:11)

• Creating reusable components with layouts and blocks (8:12)
• Using includes to factor out content (6:20)
• Creating the speakers list template (4:24)
• Creating the speakers detail template (6:11)
• Adding central configuration (3:29)
• Working with template variables (8:12)
• Adding dynamic data (15:48)
• Looping through data (15:59)
• Working with conditionals (11:22)
• Challenge: Finish the speakers detail page (0:49)
• Solution: Finish the speakers detail page (9:13)

• Creating a dynamic feedback page (9:44)
• Handling POST requests (6:23)
• Sanitizing user inputs and handling form errors (9:32)
• Storing data (3:22)

• Using Express generator (3:32)
• Next steps (0:46)

• Welcome (0:41)
• Use the exercise files (1:00)

• Understanding Node (0:52)
• Demo application overview (1:08)
• Download and install Node (1:28)
• Why is Javascript Node's language? (2:01)
• The benefits and features of Javascript (1:05)
• Asynchronous tasks and callbacks (3:47)

• Write your own module (2:18)
• Manage third-party packages with npm (3:52)
• What is the package.json file? (2:17)

• Read from files (4:31)
• Access directories (1:06)
• Write to a file (2:46)

• Node.js frameworks 1:23)
• Express (1:06)
• Socket.io (0:55)

• Static serving with Express (5:30)
• Create your browser app (8:43)
• Create a get messages service (5:28)
• Create a post messages service (9:27)
• Connect to Socket.io from the browser app (5:31)
• Create your Socket.io event (1:59)

• Types of data frameworks (2:02)
• Set up MongoDB (1:38)
• Mongoose (2:59)
• Saving data to MongoDB with Mongoose (3:54)

• Nested callbacks (3:27)
• Promises (7:14)
• Async/await (2:44)

• Try/catch (2:06)
• Finally (1:40)
• Editor debugging (4:14)

• Simple test with Jasmine (4:33)
• Async test with Jasmine (5:33)
• Introduction to test first development (5:28)

• Next steps (1:24)

• Learn the Node.js fundamentals (0:44)
• What you should know (0:38)

• Node.js history (1:01)
• How Node.js works (3:32)

• Using VS Code (1:58)
• Install Node.js (0:57)

• The global object (2:28)
• The require function (2:52)
• Argument variables with process.argv (6:29)
• Standard output (3:52)
• Standard input (6:09)
• Creating a delay with setTimeout (1:56)
• Incorporate setInterval (3:11)
• Report progress with setInterval (3:03)

• Core modules (5:18)
• Collect information with readline (2:02)
• Write a file (7:22)
• Export custom modules (4m 14)
• Create a module (4:54)
• Custom events with the EventEmitter (5:01)
• Improve a module with EventEmitter (4:41)

• List directory files (4:15)
• Read files (3:56)
• Write and append files (2:27)
• Directory creation (2:07)
• Append files (3:59)
• Rename and remove files (2:50)
• Rename and remove directories (2:45)

• Readable file streams (4:43)
• Writable file streams (4:41)
• Create child process with exec (3:31)
• Create child process with spawn (4:35)

• Next steps (0:45)

• React for full-stack solutions (1:03)
• What you should know (1:06)
• Installing Node.js and npm (1:48)

• Why React? (1:43)
• Setting up a React project (2:37)
• Creating the app component (6:37)
• Creating blog pages (4:33)
• Using react-router links (3:19)
• URL parameters with react-router (6:27)
• Creating and linking the articles list (4:34)
• Making the articles list modular (6:58)
• Creating a 404 page in React (4:23)

• Why Node.js? (1:01)
• Setting up an Express server (5:33)
• Testing an Express server with Postman (5:23)
• Route parameters in Express (3:19)
• Upvoting articles (3:58)
• Automatically updating with nodemon (2:30)
• Adding comments functionality (4:39)
• Adding comments (2:17)

• Why MongoDB? (1:16)
• Installing MongoDB (5:49)
• Adding MongoDB to Express (7:34)
• Rewriting the upvote endpoint (4:45)
• Rewriting the comments endpoint (8:33)

• The Fetch API (3:04)
• Adding React hooks (4:21)
• Calling useEffect at the right time (2:55)
• Adding Fetch to pages (4:57)
• Displaying comments (3:01)
• Adding an Upvote button (6:42)
• Adding an Add Comment form, part 1 (3:44)
• Adding an Add Comment form, part 2 (3:35)
• Adding an Add Comment form, part 3 (3:28)

• Preparing the app for release (4:57)
• Pushing code to GitHub (3:07)
• Creating and SSHing into an AWS instance (4:29)
• Setting up an AWS instance (4:12)
• Running a full-stack app on AWS (5:09)

• AWS resource teardown (0:51)
• Next steps (1:17)

• React for full-stack solutions (1:03)
• What you should know (1:06)
• Installing Node.js and npm (1:48)

• Why React? (1:43)
• Setting up a React project (2:37)
• Creating the app component (6:37)
• Creating blog pages (4:33)
• Using react-router links (3:19)
• URL parameters with react-router (6:27)
• Creating and linking the articles list (4:34)
• Making the articles list modular (6:58)
• Creating a 404 page in React (4:23)

• Why Node.js? (1:01)
• Setting up an Express server (5:33)
• Testing an Express server with Postman (5:23)
• Route parameters in Express (3:19)
• Upvoting articles (3:58)
• Automatically updating with nodemon (2:30)
• Adding comments functionality (4:39)
• Adding comments (2:17)

• Why MongoDB? (1:16)
• Installing MongoDB (5:49)
• Adding MongoDB to Express (7:34)
• Rewriting the upvote endpoint (4:45)
• Rewriting the comments endpoint (8:33)

• The Fetch API (3:04)
• Adding React hooks (4:21)
• Calling useEffect at the right time (2:55)
• Adding Fetch to pages (4:57)
• Displaying comments (3:01)
• Adding an Upvote button (6:42)
• Adding an Add Comment form, part 1 (3:44)
• Adding an Add Comment form, part 2 (3:35)
• Adding an Add Comment form, part 3 (3:28)

• Preparing the app for release (4:57)
• Pushing code to GitHub (3:07)
• Creating and SSHing into an AWS instance (4:29)
• Setting up an AWS instance (4:12)
• Running a full-stack app on AWS (5:09)

• AWS resource teardown (0:51)
• Next steps (1:17)

• Welcome (0:39)
• What you should know (0:27)
• Exercise files (0:57)
• Install MongoDB for Windows (2:41)
• Install MongoDB for OS X (2:37)
• Environment setup (2:38)

• Why Mongo? (3:37)
• Document-oriented data (3:42)
• Embed or reference? (3:31)
• Performance (4:08)

• Explore the Mongo shell (6:27)
• Import the data into the database (3:50)
• Mongo shell operations (5:31)
• Simple indexing (5:45)

• Node MongoDB setup (4:59)
• Add APIs for read requests in Hapi (5:34)
• Add APIs for write requests in Hapi (9:34)

• Unique indexes (4:34)
• Tune Mongo queries (5:00)
• Text indexes (4:49)
• Model your schema (6:46)
• Aggregation (3:08)
• Replication and sharding (4:06)

• Next steps (0:49)

• Why use a database? (1:04)
• What you should know (0:32)
• Understanding databases: Benefits of spreadsheets (2:11)
• Understanding databases: Benefits of structured data (2:09)

• Relational databases (2:12)
• Keys and unique values (2:25)
• Relationships (2:19)
• ACID and transactions (3:10)
• Basic SQL (3:54)

• Modeling and planning a database (2:23)
• Naming tables (1:36)
• Columns and data types (2:52)
• Numbers and other types (3:17)
• Primary and foreign keys (2:48)

• Creating relationships (1:04)
• One-to-many relationships (2:33)
• Many-to-many relationships (3:07)
• One-to-one relationships (1:33)
• Relationship rules and referential integrity (2:13)

• Normalization (1:05)
• First normal form (2:39)
• Second normal form (2:10)
• Third normal form (2:19)
• Denormalization (1:51)
  

• Creating a database (1:38)
• Creating tables (2:35)
• Writing SQL queries (2:37)
• Narrowing query results (3:25)
• Sorting results (1:53)
• Aggregate functions (2:30)
• Joining tables (3:20)
• Modifying data (4:11)

• Indexes, transactions, and stored procedures (2:56)
• Access control, compliance, and injection (3:01)
• Software options (2:38)

• Next steps (1:05)

• React for full-stack solutions (1:03)
• What you should know (1:06)
• Installing Node.js and npm (1:48)

• Why React? (1:43)
• Setting up a React project (2:37)
• Creating the app component (6:37)
• Creating blog pages (4:33)
• Using react-router links (3:19)
• URL parameters with react-router (6:27)
• Creating and linking the articles list (4:34)
• Making the articles list modular (6:58)
• Creating a 404 page in React (4:23)

• Why Node.js? (1:01)
• Setting up an Express server (5:33)
• Testing an Express server with Postman (5:23)
• Route parameters in Express (3:19)
• Upvoting articles (3:58)
• Automatically updating with nodemon (2:30)
• Adding comments functionality (4:39)
• Adding comments (2:17)

• Why MongoDB? (1:16)
• Installing MongoDB (5:49)
• Adding MongoDB to Express (7:34)
• Rewriting the upvote endpoint (4:45)
• Rewriting the comments endpoint (8:33)

• The Fetch API (3:04)
• Adding React hooks (4:21)
• Calling useEffect at the right time (2:55)
• Adding Fetch to pages (4:57)
• Displaying comments (3:01)
• Adding an Upvote button (6:42)
• Adding an Add Comment form, part 1 (3:44)
• Adding an Add Comment form, part 2 (3:35)
• Adding an Add Comment form, part 3 (3:28)

• Preparing the app for release (4:57)
• Pushing code to GitHub (3:07)
• Creating and SSHing into an AWS instance (4:29)
• Setting up an AWS instance (4:12)
• Running a full-stack app on AWS (5:09)

• AWS resource teardown (0:51)
• Next steps (1:17)