CSCI-432 Client-side Development

This course covers the design and development of rich reactive web UI's using front-end JavaScript frameworks such as Bootstrap, Angular.js, React.js and Vue.js.

Course Administration
Resources
Assignments
All assignments are due before the next class unless specified.
Jan 6
Setting Up a Development Environment
Jan 9
Deploy an Static Web Site on Azure
Jan 11
Build a Vue App Using the Vue CLI ⟡ App 1
Jan 13
Create a Vite-based Vue Project ⟡ App 2
Jan 18
Removing Unwanted Vite Assets and Components ⟡ Component Basics ⟡ App 3 ⟡ Demo code
Template Syntax
Jan 20
Reactivity ⟡ App 4 ⟡ Demo code
Reactivity Fundamentals
Jan 23
Using Reactive Data in Templates ⟡ App 5 ⟡ Demo code ⟡ Homework
Class and Style Bindings ⟡ Event Handling ⟡ Computed Properties
Jan 25
Delayed opening - In class work day
Jan 27
Using Reactive Data in Templates, continued Homework
Jan 30
Reviewing HTML Forms ⟡ App 6 ⟡ Homework
Feb 1
Binding Reactive Data to Form Elements ⟡ App 7 ⟡ Demo code ⟡ Homework
Form Input Bindings
Feb 3
Binding Reactive Data to Form Elements, continued
Feb 6
Using Watchers and Lifecycle Hooks ⟡ App 8 ⟡ Demo code ⟡ Homework
Watchers ⟡ Lifecycle Hooks
Feb 10
App 10 ⟡ Demo code ⟡ Homework
Template Refs
Feb 13
Template Ref Experiments ⟡ App 11 ⟡ Demo code
Feb 15
App 12 ⟡ Demo code
Conditional Rendering ⟡ List Rendering
Feb 17
App 13 ⟡ Demo code ⟡ Homework
Props ⟡ Emitters ⟡ <audio>
Feb 20
App 14 ⟡ Demo code
Component v-model
Feb 24
App 15 ⟡ App 16 ⟡ App15 code ⟡ App16 code
Slots
Mar 6
Homework
Mar 10
App 17 ⟡ App17 code
Fallthrough Attributes
Mar 13
App 18 ⟡ App18 code ⟡ Homework
Provide and Inject
Mar 15
App 19 ⟡ App19 code
Vue Router - Getting Started ⟡ Dynamic Route Matching
Mar 17
App 20 ⟡ App20 code ⟡ Homework
Nested Routes ⟡ Programmatic Navigation ⟡ Dynamic Routing
Mar 27
App 21 ⟡ App21 Code ⟡ Homework
Pinia Core Concepts
Mar 29
App 22 ⟡ App22 Code ⟡ Homework
Pinia State

© 2023 n0code.net