Vite: The Complete Developer'S Guide
Published 3/2023
MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz
Language: English | Size: 1.52 GB | Duration: 1h 27m
Published 3/2023
MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz
Language: English | Size: 1.52 GB | Duration: 1h 27m
This course will show you everything you need to be able to build web applications in Vite
What you'll learn
Build a web application in Vite using Typescript and React
Create and configure a new Vite application in any frontend framework
Be able to make an informed choice between Webpack and Vite
Understand the architecture and fundamentals of Vite
Requirements
Comfortable running terminal commands and using npm
Familiarity with Typescript
Familiarity with React
Basic understanding of CSS
Description
Vite is a fast and efficient JavaScript framework that has been designed to enhance the developer experience. This video course is a complete guide to Vite and will teach you how to use this powerful tool to create and deploy fast, responsive, and dynamic web applications. In this course, you will learn how to use Vite to configure your project, import static assets, create dynamic imports, and add multiple routes. You will also add styles to your app using native CSS modules, CSS variables, and the postcss nesting plugin for more legible selectors. Lastly, you will learn how to build your application for production and publish it as a static website to Netlify.This course is designed for developers who want to learn how to use Vite to speed up their development experience. It is suitable for beginners who have some knowledge of TypeScript, CSS, and React. This course is also suitable for experienced developers who want to learn how to use Vite to create and deploy fast, responsive, and dynamic web applications.Although you will be using React for the majority of this course, we will also touch on how to use Vite for both VueJS and Svelte applications.Alongside instructional course videos you will also find fun quizzes to test your understanding of Vite as you progress through this course.
Overview
Section 1: Introduction
Lecture 1 Course Overview
Lecture 2 What You Need
Lecture 3 What is Vite?
Lecture 4 Vite vs Webpack
Section 2: Getting Started
Lecture 5 Creating a new vite project
Lecture 6 New project overview
Lecture 7 Vite Config
Lecture 8 Developing and HMR demonstration
Lecture 9 Framework Support
Section 3: Developing with Vite
Lecture 10 Using Static Assets
Lecture 11 Creating Multiple Routes
Lecture 12 Advanced Imports
Section 4: Styling Your Vite Application
Lecture 13 Using Modern CSS Features in Vite
Lecture 14 Adding Nesting With PostCSS
Section 5: Publishing Your Vite Application
Lecture 15 Building for Production
Lecture 16 Publishing To Netlify
Lecture 17 Environment Variables
Section 6: Advanced Features
Lecture 18 Using & Creating Plugins
Lecture 19 Course Summary
Frontend web developers who are interested in using Vite to build modern web applications in React