What is Polymer and Polymer LitElement
  • Course Intro
  • Section Introduction
  • What is Polymer
  • Introduction to Polymer LitElement
  • Project Preperation
  • Polymer LitElement - Create a Custom Element Part 1
  • Polymer LitElement - Create a Custom Element Part 2
  • Polymer LitElement - Custom Element Properties
  • Custom Elements Concepts
  • Polymer LitElement - Use a Custom Element build by Polymer - checkbox
  • Summary
  • What's next
Polymer LitElement Features
  • Introduction to Section
  • Shadow DOM Concept
  • Shadow DOM hands on part 1
  • Shadow DOM hands on part 2
  • Event Handling with Polymer LitElement
  • Event Handling - Hands on Lecture
  • Summary
Set up Development Environment for Polymer LitElement
  • Set up Development Environment for Polymer LitElement
Build a To Do Web App with Polymer 3 and LitElement
  • Introduction to Section
  • Initialize project using Polymer CLI
  • Install NPM packages - concurrently and browser-sync
  • Hello To Do App
  • Add To Do items
  • Event handling - on-keyup
  • Integrating localstorage to store our to do items
  • Add to do list to localstorage
  • List To Do items
  • List single To Do items
  • Trigger Custom Event to render new to do item
  • Trigger Custom Event to remove a to do item
  • Change to do item state (done <-> not done) Part 1
  • Change to do item state (done <-> not done) Part 2
  • More on Immutable objects
  • Style our To Do Web App - index.html
  • Style our To Do Web App - app.js
  • Style our To Do Web App - list-items.js
  • Style our To Do Web App - todo-items.js
  • Style our To Do Web App - add-item.js
  • Style our To Do Web App Footer - index.html
  • Summary
What is Polymer? (depreciated)
  • How are we going to learn Polymer
  • What is Polymer?
  • What is Polymer? Part 2
  • [QUIZ] Measure your knowledge with this section Quiz on Polymer
Use a Polymer Element from the Polymer Catalog (depreciated)
  • Use a Polymer Element: Intro
  • Chrome Dev Editor (CDE)
  • Use a Polymer Element: Google Map
  • Use a Polymer Element: Implement Google Map
  • Use a Polymer Element: Implement Google Map Attributes
  • Use a Polymer Element: Implement Google Map Bundle Elements
  • Polymer Element Catalog
  • [QUIZ] Measure your knowledge with this section Quiz on Polymer
Create a Custom Element with the Polymer Library (depreciated)
  • Register a custom element: Concept
  • Register an element: Coding
  • Add local DOM: Concept
  • Add local DOM: Coding
  • Compose with local DOM: Concept
  • Compose with local DOM: Coding
  • Use data binding: Concept
  • Use data binding: Coding
  • Declare a property: Concept
  • Declare a property: Coding
  • Bind to a property: Concept
  • Bind to a property: Coding
  • Create a Custom Element with Polymer: Summary
  • [QUIZ] Measure your knowledge with this section Quiz on Polymer
Learn and Build using Polymer 2 (depreciated)
  • Polymer 2 - Introducing New Content
  • Polymer 2 - What's New?
  • Polymer 2 - Polymer.Element Library and Elements
  • Polymer 2 - Tooling, PRPL pattern and App Toolbox
  • Polymer CLI (command-line interface) - The Swiss Army Knife
Build a Custom Element using Polymer 2 - Cryptocurrency Dashboard (depreciated)
  • Cryptocurrency Price Dashboard - Our Custom Element in Polymer 2
  • Visual Studio Code - Our Code Editor
  • Prepare Polymer CLI and Polymer IDE
  • Fundamentals of a Custom Element in Polymer 2 - Theory Lecture
  • Create an Polymer 2 Element Template using Polymer CLI
  • Analyzing details of a Polymer 2 Element Template
  • Roadmap - Building a Cryptocurrency Market Dashboard Custom Element in Polymer 2
  • Install Polymer 2 & Create a Basic Custom Element from scratch
  • Creating and using a Github repository for our Polymer 2 project
  • Theory Lecture: Using ready() - Custom Element Lifecycles in Polymer 2
  • How to use iron-ajax polymer element with coinbase api to get data
  • Using iron-ajax to get crypto data from coinbase
  • Using iron-ajax to get multiple crypto data from coinbase
  • Theory Lecture: Data Bindings and Observable Changes
  • Using Observable Changes to set currencies array with price data
  • Theory: Template Repeater - dom-repeat
  • Using template dom-repeat in our project
  • Using paper-spinner as loader