Resources

Week 1

• Birth of WWW

• HTML tags

• HTML special characters

• W3schools-HTML

• Learn Emmet In 15 Minutes

• Emmet cheat-sheet

• csszengarden

• HTML Color Names

Week 2

• Awesome Icons Reference

• CSS cheat-sheet

• CSS cheat-sheet 2

• CSS Combinators

• Pseudo-classes

• Pseudo-classes vs. pseudo-elements

• CSS selector examples

• Media Query

Week 3

• CSS Grid

• CSS Flexbox

• docker.com

• Docker installation documentation

• Docker Hub

• Microsoft official Docker images

• Best practices for writing Dockerfiles

• All Docker commands

• Docker commands cheat-sheet

Week 4

• Visual Studio Code Extensions for Web Development

• The TypeScript Handbook

• TypeScript: Online PlayGround

  • https://typescriptlang.org/play

  • https://replit.com/languages/typescript

Week 5

• Web APIs

• Window APIs

• HTML DOM Events

• Java|Type scripte Array Operations

• Higher-order Functions

Week 6

• Type Aliases vs. Interfaces

• Midterm Exam

  • Guide

  • Exercises

  • script async vs defer attributes

Week 7

• HTTPS

Week 8

• vuejs.org

• vuemastery

• Online Playground

• vuejs-devtools

• 1-way Binding

• 2-way Binding

  • v-model: Input text

  • v-model: color and Date

  • v-model: Radio buttons & Dropdown List

    • with data array

  • v-model: Checkbox

    • with data array

• Event Handing

  • Event reference

  • Event Handling: Button Click and Mouse Activity

  • Event Modifiers

  • Passing Arguments to Event Handler

• Template Refs

  • demo 1

  • demo 2

• Vue3 Components

  • Defining and Passing “Argument”

  • Timer update speed vs. Timer update speed with default value

  • Stylish Timers

  • Lifecycle Functions

Week 9

• Computed Properties

Week 10

• Slots

• London Fog

  • Demo

  • Code

• Pinia State

  • Two-way Binding

  • v-for

• Pinia Actions

  • Two-way Binding

  • De-structure

• Pinia Getters

  • Getters

Week 11

• Promises

• Pinia

  • Subscribe to actions

  • Subscribe to the state

  • Patch

  • Shopping Cart Example

  • Refresh-proof your Pinia Stores

  • Online Doc

    • State

    • Getters

    • Actions

Week 12

• Vue Router

  • Offical Website

  • Weather App

    • Demo

    • Code

  • Random User App

    • Demo

    • Code

• Vueify

  • Offical Website

  • Online PlayGround

  • Material Colors

  • Components

  • npm trend: bootstrap-vue vs element-ui vs vuetify

  • Material Design Icons

  • v-app-bar

  • Navigation Drawer

  • Color Class Names

  • Input Field Validation

  • v-slider and v-range-slider

  • Date & Time Picker

  • v-autocomplete / v-combobox / v-select

  • v-radio-group & v-radio

  • v-checkbox / v-switch

  • Size Code and Media breakpoints

  • Bottom sheet

  • Buttons

  • Cards

  • Dialogs

  • v-data-table

Week 13

• Firebase Console

• Firestore offical Documentation

• await vs. .then()

Week 14

• Firebase CRUD Operations and Listener

• Firebase Authentication

Week 15

• Random Users Web Service

  • Documentation

  • Service Endpoint: https://randomuser.me/api

• Random Quotes

  • Documentation

  • Service Endpoint: https://api.quotables.io

• A gazillion more Web Services