Course Work Overview
•Development Overview
•IMPORTANT – Course updates – don’t skip!
•What is JavaScript?
•Development Environment
•Variables
•Variables Coding Exercise
•Variables – Let and Const
•Let and Const Coding Exercise
•Basic Operations
•Basic Operations Coding Exercise
•Iteration and Math
•Iteration and Math Coding Exercise
•String Concatenation and Interpolation
•String Concatenation and Interpolation Exercise
•If and Equality
•Return the right numbers
•Functions
•Functions Coding Exercise
•Function Return Statements
•Return the right message
•Objects
•Class Extends
•The this Property
•Make the bird fly
•Modules and Require
•Module imports and exports
•The Document
•Event Handlers
•Change the message
•Password Strength Checker – Introduction
•Password Strength Checker – Adding JavaScript
•Password Strength Checker – Adding Rules
•Password Strength Checker – The Completed Project
•Password Strength Checker – Code Repository
•Ruby on Rails crash course
•Ruby on Rails – Introduction to the section
•Local Installation: Install Ruby on Rails on a Mac (Optional)
•Local Installation: Install Ruby on Rails on Windows (Optional)
•Start new rails app, run server – both local and cloud-IDE example
•App structure, MVC and root route
•Naming conventions – Convention over configuration
•Add routes
•Explore the layout file and erb
•Start styling the app
•Add front-end framework and navigation
•Create a sticky footer
•Add dropdown feature and hamburger menu
•Work on the content layout view – Courses
•CRUD from the back-end and courses resource
•Front-end display and validations
•Learn how to use partials
•Create students resource
•Create students resource – Text follow-up instructions and resources
•Students index
•Create a new student form
•Create students and work with errors
•Add flash messages and errors
•Student show page
•Edit student functionality
•DRY your code – extract redundancies
•Add secure password
•Update forms to accept passwords and modify styling
•Authentication system – build routes and form
•Create and destroy sessions – add auth methods
•Restrict actions, views and clean up layout
•Create association from rails console
•Add associations from front-end
•React Basics
•React Basics – Text Instructions
•Setup React App – HTML
•Setup React App – HTML – Text Instructions
•Setup React App – JavaScript
•Setup React App – JavaScript – Text Instructions
•Optional – Backup Your Code to GitHub
•Create Todo Component
•Create Todo Component – Text Instructions
•Create Todo Component Continued
•Create Todo Component Continued – Text Instructions
•React Component State
•React Component State – Text Instructions
•React Event Handlers
•React Event Handlers – Text Instructions
•React Handle Change
•React Handle Change – Text Instructions
•TodoList Component
•TodoList Component – Text Instructions
•New Todo
•New Todo – Text Instructions
•Styling the Todolist
•Styling the Todolist – Text Instructions
•Node.js Introduction – Todo App REST API
•Node.js Hello World
•Node.js Hello World – Text Instructions
•Node.js REST API
•Node.js REST API – Text Instructions
•Node.js REST API Continued
•Node.js REST API Continued – Text Instructions
•Create Todo API
•Create Todo API – Text Instructions
•Testing the Create Todo API
•Testing the Create Todo API – Text Instructions
•Update Todo API
•Update Todo API – Text Instructions
•Integrating React Todo App with Node.js REST API
•Overview
•Overview – Text Instructions
•Integrating TodoList
•Integrating TodoList – Text Instructions
•Connecting the Create Todo Call
•Connecting the Create Todo Call – Text Instructions
•Serve the React App from the Node.js App
•Serve the React App from the Node.js App – Text Instructions
•Deploy the Todo App to Heroku
•Deploy the Todo App to Heroku – Text Instructions
•Source Code and Helpful Links
•Coming Soon – Authentication!
•React with Rails
•Rails Basics
•GitHub Repository Information – Please read before starting!
•React – Introduction
•Getting Started with Alpha Blog
•Getting Started with Alpha Blog – Text Directions and Code
•Installing Webpacker and React
•Installing Webpacker and React – Text Directions and Code
•React on Rails Intro
•React-Rails and Pushing to GitHub
•React-Rails and Pushing to GitHub – Text Directions and Code
•Webpacker, React, and Yarn – Layout and Configuration
•Try React
•React With Rails – The Article Component
•React – How It Works
•Starting the Article Component
•Starting the Article Component – Text Directions and Code
•Article Component continued
•Article Component continued – Text Directions and Code
•Finishing Article Component
•Finishing Article Component – Text Directions and Code
•Reviewing the Article Component Build
•Adding a Timestamp Component
•Adding a Timestamp Component – Text Directions and Code
•Timestamp Component continued
•Timestamp Component continued – Text Directions and Code
•Timestamp Component Review
•React Component LifeCycle – ComponentDidMount
•React Component LifeCycle – Component DidMount – Text Directions and Code
•React Component LifeCycle – ComponentDidUnmount
•React Component LifeCycle – ComponentDidUnmount – Text Directions and Code
•React Components Review
•React with Rails – The Colorpicker Component
•Colorpicker Component Introduction
•Colorpicker Component Introduction – Text Directions and Code
•Creating the Colorpicker
•Creating the Colorpicker – Text Directions and Code
•Rails Model Review
•Adding Color to Users
•Adding Color to Users – Text Directions and Code
•Adding Colorpicker to the Form
•Adding Colorpicker to the Form – Text Directions and Code
•Creating the Colorpicker Constructor
•Creating the Colorpicker Constructor – Text Directions and Code
•Colorpicker Quiz
•The handleChange Function
•The handleChange Function – Text Directions and Code
•Improving the handleChange Function
•Improving the handleChange Function – Text Directions and Code
•Wiring the Component to the Form Field
•Wiring the Component to the Form Field – Text Directions and Code
•Colorpicker Quiz 2
•Updating the App to Use Preferred Color
•Updating the App to Use Preferred Color – Text Directions and Code
•Cleaning Up and Nice to Haves
•Cleaning Up and Nice to Haves – Text Directions and Code
•Review and Summary
•React – Assignment
•Angular with Rails – My Portfolio
•Finance Tracker Updates (Please Read – Important!)
•Application Overview
•Find the right object
•Adding AngularJS to the App
•Adding AngularJS to the App – Text Directions and Code
•Starting the Angular App
•Starting the Angular App – Text Directions and Code
•Creating the Repo and Pushing to GitHub
•Creating the Repo and Pushing to GitHub – Text Directions and Code
•Starting to Change Stock Lookup
•Angular concepts
•Setting Up Stocks Controller
•Setting Up StocksController – Text Directions and Code
•Changing the Form to Plain HTML
•Changing the Form to Plain HTML – Text Directions and Code
•The Lookup Function
•The Lookup Function – Text Directions and Code
•Binding the Results to the Lookup Function
•Binding the Results to the Lookup Function – Text Directions and Code
•Angular concepts 2
•Changing the Results Partial from Rails to Angular
•Changing the Results Partial from Rails to Angular – Text Directions and Code
•Moving the Results Partial Back into My Portfolio
•Moving the Results Partial Back into My Portfolio – Text Directions and Code
•Turning the Rails Controller into an API
•Turning the Rail