Web Development IV

Prereq

Prerequisites Many different tools and skills are needed when developing web applications. Review the tools and skills we will be using throughout the course.

Development Tools

• Installing Git
• Installing Node.js
• Visual Studio Code
• Vue Development Tools

Review Topics

• Git Basics
• GitHub Basics

Week 1

Git and GitHub Collaboration This week we will learn how to collaborate using Git and GitHub.

Topics

• Git: Beyond the Basics
• GitHub Collaboration

Additional Resources

• Git Workflows

Week 2

CSS Frameworks This week we will explore several different CSS Frameworks and discuss their similarities and differences.

Topics

• CSS Frameworks

Additional Resources

• Bootstrap 5 Tutorial
• Foundation: Zero to Website
• Learn Bulma CSS for free
• Materialize Tutorial
• Tailwind Crash Course
• Learn the PureCSS Basics

Week 3

CSS Preprocessors This week we will discuss CSS Preprocessors and take a deep dive into Sass.

Topics

• Sass Documentation
• Less Documentation
• Stylus Documentation

Additional Resources

• Complete Sass Tutorial

Week 4

Custom CSS Frameworks This week we will explore how to customize CSS Frameworks and create our own CSS Frameworks using Sass and SassScript.

Topics

• Sass Documentation

Additional Resources

• Complete Sass Tutorial

Week 5

Modern JavaScript This week we will explore the latest JavaScript syntax and techniques for creating modern web applications.

Topics

• Arrow Functions
• Destructuring
• Spread Syntax
• Declarative vs Imperative
• Functional Array Methods
• JavaScript Modules

Additional Resources

• Imperative vs Declarative Programming
• An Illustrated (and Musical) Guide to Map, Reduce, and Filter Array Methods
• 8 Must Know JavaScript Array Methods

Week 6

JavaScript Frameworks In this module, we will explore different modern JavaScript Frameworks and begin our journey learning Vue.js.

Topics

• Vue Basics

Additional Resources

• Vue Documentation
• Intro to Vue 3

Week 7

Modular Development This week we will learn about the importance of components in building modern web applications and to create components in Vue.js. We will also learn how to use build tools to improve the development process.

Topics

• Vite
• Single-File Components
• Slots
• Props

Additional Resources

• Vue.js 3 Components Fundamentals

Week 9

Data Management This week we will explore event and form handling, data management, and component communication within Vue.js.

Topics

• Event Handling
• Form Handling
• Lifecycle Hooks
• Computed Properties
• Watchers

Additional Resources

• Vue.js 3 Fundamentals with the Options API
• Vue.js 3 Fundamentals with the Composition API

Week 10

Route Management This week we will discuss routers and how they can be used to create Single Page Applications. We will also learn and to install and use Vue Router.

Topics

• Vue Router

Additional Resources

• Vue Router 4 for Everyone

Week 11

Static Site Generators Theweek we will explore static site generators and learn when and how to use them.

Topics

• VuePress
• Nuxt
• Gridsome

Additional Resources

• Jamstack - Site Generators
• Nuxt 3 Crash Course

Week 12

Headless CMSs This week we will discuss Headless CMSs and learn how to create and incorporate them into our web application.

Topics

• StoryBlok
• Strapi
• Wordpress REST API

Week 13

Deployment This week we will explore the different services that can be used to deploy and host our websites and applications.

Topics

• GitHub Pages
• Netlify