Section 1: Installation

100 Days of VueJS

Day 1

Section 2: Exploration

100 Days of VueJS

Day 1

Section 3:

The Home Page (Listing Videos)

100 Days of VueJS

Day 1

Section 4:

Video Watch Page

100 Days of VueJS

Day 1

Section 5:

Playing Video

100 Days of VueJS

Day 1

  • Connecting to a REST API

  • Loading Server data in VueX

  • Switching to JSON API

  • JSON API Relationships

  • Tags Page

  • Our First Reusable Component

VueX

Section 1:

Connecting to a REST Server

100 Days of VueJS

Day 2

Section 2:

Putting server data into VueX

100 Days of VueJS

Day 2

Section 3:

JSON API

100 Days of VueJS

Day 2

Section 4:

Data Relationships

100 Days of VueJS

Day 2

Section 5:

The Tags Page

100 Days of VueJS

Day 2

Thanks for Watching!

Section 1:

What is Vuetify?

100 Days of VueJS

Days 3-4

Section 2:

Installing Vuetify

100 Days of VueJS

Days 3-4

Section 3:

Fixing the video list

100 Days of VueJS

Days 3-4

Section 4:

Fixing the video watch page

100 Days of VueJS

Days 3-4

Section 1:

Displaying Played status from localstorage

Buiding an app in VueJS

Part 4

Section 2:

Saving Played status

to localstorage

Buiding an app in VueJS

Part 4

Section 3:

Using FontAwesome

Buiding an app in VueJS

Part 4

Section 4:

Detecting End of

Video Playback

Buiding an app in VueJS

Part 4

Section 5:

Showing Played Status on Video Lists

Buiding an app in VueJS

Part 4

Section 1:

Our First Text Input

Buiding an app in VueJS

Part 5

Section 2:

The Create Video Form

Buiding an app in VueJS

Part 5

Section 3:

Creating the Video

Buiding an app in VueJS

Part 5

Section 4:

Using Vuetify Inputs

Buiding an app in VueJS

Part 5

Section 5:

Review

Buiding an app in VueJS

Part 5

1.  Admin Page:

Vue Filters + CSS Grid

Buiding an app in VueJS

Part 6

3. Edit Page: VueX

2. Delete Button:

VueX + Confirm Modal

Section 1

Admin Page

 

Buiding an app in VueJS

Part 6

Section 2

Delete Button

Buiding an app in VueJS

Part 6

Section 3

Edit Page

Buiding an app in VueJS

Part 6

Section 4

Review

Buiding an app in VueJS

Part 6

1. Validating Inputs

Buiding an app in VueJS

Part 7

3. Refactor to an EditForm Component

2. Validating Forms

Section 1

Validating Inputs

Buiding an app in VueJS

Part 7

Section 2

Validating Forms

Buiding an app in VueJS

Part 7

Section 3

Refactoring to an EditForm Component

Buiding an app in VueJS

Part 7

Section 4

Review

Buiding an app in VueJS

Part 7

1. Setting currentUser

Buiding an app in VueJS

Part 8

2. Login Flow

3. Registration Flow

  • Displaying Users

  • Setting currentUser
  • Saving currentUser in localstorage
  • Basic Flow

  • Hide/show password

  • Validations
  • Abstract the form

  • Registration Flow

  • Cleanup

Section 1.1

Displaying Users

Buiding an app in VueJS

Part 8

Section 1.2

Setting currentUser

Buiding an app in VueJS

Part 8

Section 1.3

Saving currentUser
using localstorage

Buiding an app in VueJS

Part 8

Section 2.1

Basic Login Flow

Buiding an app in VueJS

Part 8

Section 2.2

Hide/Show Password

Buiding an app in VueJS

Part 8

Section 2.3

Login Page Validations

Buiding an app in VueJS

Part 8

Section 3.1

UserAuthForm Component

Buiding an app in VueJS

Part 8

Section 3.2

Registration Flow

Buiding an app in VueJS

Part 8

Section 3.3

Cleanup

Buiding an app in VueJS

Part 8

Section 4

Review

Buiding an app in VueJS

Part 8

Thanks for Watching!

1.  Navigation Guards:

beforeEnter + next

Buiding an app in VueJS

Part 9

3. Token Authentication

2. Admin Section:

Nested Routes

Section 1

Navigation Guards

beforeEnter + next

Buiding an app in VueJS

Part 9

Section 2

Admin Section

Nested Routes

Buiding an app in VueJS

Part 9

Section 3

Token Authentication

Buiding an app in VueJS

Part 9

Section 4

Review

Buiding an app in VueJS

Part 9

Thanks for Watching!

Buiding an app in VueJS

Part 9

1.  Desirability of Target (motivation)

Risk Factors

3. Insufficient Security

2. Breadth of User Access (attack surface)

1.  Credit Card numbers

Motivation

3. Powerful rivals

2. Political Content

1.  What can an average signed-in user do?

User Access

2b. How many admins?

2a. What can an admin do?

1.  How much does your site need?

Insufficient Security

2. What tradeoffs are you willing to make?

1.  Use AT LEAST token authentication

My recommendations

2.  XSS precautions on user-generated content

3.  Don't store credit card #s

4.  If you're a high-value target, beef up your security. Maybe hire an expert.

5.  Have a damage mitigation plan

Building a screencast app in VueJS 1-9.1

By Jeffrey Biles

Building a screencast app in VueJS 1-9.1

  • 705