Vite Crash Course – Frontend Build Tool

Become a lightning-fast developer with Vite, the speed-focussed build tool that makes working with modern frameworks smooth, efficient, and enjoyable.

✏️ Study this course interactively on Scrimba: https://scrimba.com/intro-to-vite-c03p6pbbdq?utm_source=youtube&utm_medium=video&utm_campaign=fcc-intro-to-vite

Code is available on the Scrimba course page for each lesson.

⚡️Want to build high-performance, modern web apps? Vite is your answer!
No matter the size of your project, Vite delivers a lightning-fast development experience with minimal setup and maximum efficiency.
🤔What is Vite?
Vite is a build tool that allows you to start up your project instantly and see changes you make immediately.
With Vite, there’s no more re-running your code all the time, wasting valuable seconds, which turn into minutes and hours. Instead, you immediately see the changes you make, no matter the size of your code base. The result: You become a faster, more efficient, and happier developer!
💡What are the use cases for Vite?
Vite is perfect for:
- Rapid frontend development with frameworks including React, Vue, and Svelte
- Applications that require optimized production builds with minimal configuration
- Developers who want a lightweight, efficient alternative to traditional bundlers such as Webpack

✨ Why this course?
This course is perfect for beginners who want a simple yet powerful way to streamline their development workflow.
If you're looking for a faster, more efficient alternative to traditional frontend tooling, this course will get you started with Vite in no time!

We'll cover:
- Building React apps with Vite
- Developing with Vite and TypeScript
- Using environment variables
- Working with static assets
- Building with Vite for production
- Configuring and extending Vite
- Explaining what makes Vite fast

Scrimba on YouTube: https://www.youtube.com/c/Scrimba

⭐️ Contents ⭐️
- 0:00:00 Welcome
- 0:02:48 Create your first React project with Vite
- 0:06:28 Experience fast development
- 0:12:32 Handle static assets
- 0:17:02 Use environment variables
- 0:21:55 Using Scrimba's built-in environment variables
- 0:22:56 TypeScript development with Vite
- 0:25:27 Build for production
- 0:27:25 Configure with options
- 0:30:12 Extend with plugins
- 0:35:39 Extra: Vite today, Vite tomorrow!
- 0:39:24 Outro

Видео Vite Crash Course – Frontend Build Tool канала freeCodeCamp.org