Great video, excellent style of explaining. your tutorials are the only ones that I felt completely understood each one, before going to the next one. please add more videos about laravel 8 .
This is the best introduction to Laravel Mix that I have seen. Have you thought about doing a part 2 where you get into more advanced Mix usage? It would be cool to learn how you could also use Mix outside of Laravel for other web projects.
Probably not, it's getting to the point where laravel mix is pretty outdated. I'd åctually recommend not using laravel mix anymore and instead using vite in its place.
@@CleanCodeStudio So I've seen a lot of people switching to Vite. I went through a tutorial and fail to see how it improves on what Mix already does. It feels overly complicated too, IMO. I currently use Mix on a few of my projects and once you get the main config file set up, it's really easy to use and scale. I would be curious to hear your thoughts on Vite and why it is a better solution than Mix?
@@davidlevin_ Instant Server Start: Vite leverages native ES modules, allowing the development server to start almost instantly, regardless of the size of your application. In contrast, Mix (which uses Webpack under the hood) can have longer startup times as your project grows. Hot Module Replacement (HMR): Vite offers extremely fast HMR, updating only the modules that have changed without a full reload. This leads to a smoother and more efficient development workflow. Modern Bundling: Vite uses Rollup for production builds, which is highly optimized for modern JavaScript. This results in smaller and more efficient bundles compared to Webpack-based builds. Code Splitting and Tree Shaking: Vite automatically handles code splitting and tree shaking out of the box, ensuring that your final bundles are as lean as possible. Minimal Configuration Needed: Vite's sensible defaults mean that you can get started with minimal configuration. While Laravel Mix simplifies Webpack configurations, Vite often requires even less setup, especially for modern JavaScript frameworks like Vue or React. Plugin Ecosystem: Vite has a robust and growing plugin ecosystem that makes it easy to extend its functionality without diving deep into complex configurations. Framework Agnostic: Vite is designed to work seamlessly with modern frameworks like Vue 3, React, Svelte, and others. It’s optimized for these environments, providing better integration and performance enhancements tailored to each framework’s needs. ESM Native: By embracing ES modules, Vite ensures better compatibility and performance with modern JavaScript standards, making it future-proof as the web ecosystem continues to evolve. Detailed Error Reporting: Vite provides more intuitive and detailed error messages, which can significantly speed up debugging and development. Built-in Features: Features like TypeScript support, CSS preprocessing, and asset handling are more streamlined in Vite, reducing the need for additional configurations or plugins. Growing Adoption: Vite has seen rapid adoption in the developer community, which means more resources, tutorials, and community support are available. This can make troubleshooting and learning new features easier. Future-Proofing: As the web development landscape shifts towards faster, more efficient tools, adopting Vite positions your projects to take advantage of ongoing innovations and optimizations. While Laravel Mix is a solid and reliable tool, especially for projects already deeply integrated with it, Vite offers significant performance improvements and a more modern development experience that can enhance productivity and scalability. Additionally, Laravel has officially embraced Vite as its primary front-end asset bundler starting from Laravel 9, indicating strong support and integration moving forward. Switching build tools can seem daunting at first, but the performance gains and improved developer experience that Vite offers can make it a worthwhile investment in the long run. At the end of the day however, it's all about choosing the right tool that aligns with your project's needs and your team's workflow. And then one last additional note, there's another build tool called turbopack. Underneath it is built in rust, there's a non zero percent chance likely hood that vite will someday be out dated with turbo pack because of its performance improvements, speed, and ultimately just using an over all more powerful systems level language under the hood that is rust. So to sum it up, vite offers a multitude of advantages over Laravel mix - the only thing you'll be losing is the fluent builder wrapper api that makes it familiar and easy to work with mix when that's what your familiar with. Vite is set up to be more configuration based and doesn't use a fluent builder pattern - but don't mistake that for it being some crazy hard thing to switch over to. Vite is a step into the direction of the future, and I know when I first switched several years back one of my main concerns was how it kind of looked like a webpack set up some ways which is extremely annoying and difficult to work with. I guarantee you that vite is not webpack, and although it uses a configurable way for setting itself up instead of a fluent builder pattern like laravel mix - vite is very enjoyable to work with. It's actually made by the same engineer who made vue.js. Vite is made by one of the very few engineers who I'd consider right there on the same level as taylor otwell (laravel's creator) in terms of how much they as a developer prioritize clean, readable code, and a high quality developer experience.
I agree, I actually recently shared this with a coworker who was about to do an event and said the exact same thing on it. Over cooked this one for sure
Your voice is so soothing and relaxing I wanna npm run chill
😊 thank you
i like how you explain things slowly. you have a nice voice
Thanks Patrick!
Great video, excellent style of explaining. your tutorials are the only ones that I felt completely understood each one, before going to the next one. please add more videos about laravel 8 .
You're very welcome, glad it helped!
The way you teach I like most.
Hey, hey we like to hear it - thanks Sailkat!
Finally i get to learn the difference between composer and npm. Thanks!
Great to hear Angel!
Thank you for this detailed explanation
Glad it was helpful!
This is the best introduction to Laravel Mix that I have seen. Have you thought about doing a part 2 where you get into more advanced Mix usage? It would be cool to learn how you could also use Mix outside of Laravel for other web projects.
Probably not, it's getting to the point where laravel mix is pretty outdated. I'd åctually recommend not using laravel mix anymore and instead using vite in its place.
@@CleanCodeStudio
So I've seen a lot of people switching to Vite. I went through a tutorial and fail to see how it improves on what Mix already does. It feels overly complicated too, IMO.
I currently use Mix on a few of my projects and once you get the main config file set up, it's really easy to use and scale.
I would be curious to hear your thoughts on Vite and why it is a better solution than Mix?
@@davidlevin_
Instant Server Start: Vite leverages native ES modules, allowing the development server to start almost instantly, regardless of the size of your application. In contrast, Mix (which uses Webpack under the hood) can have longer startup times as your project grows.
Hot Module Replacement (HMR): Vite offers extremely fast HMR, updating only the modules that have changed without a full reload. This leads to a smoother and more efficient development workflow.
Modern Bundling: Vite uses Rollup for production builds, which is highly optimized for modern JavaScript. This results in smaller and more efficient bundles compared to Webpack-based builds.
Code Splitting and Tree Shaking: Vite automatically handles code splitting and tree shaking out of the box, ensuring that your final bundles are as lean as possible.
Minimal Configuration Needed: Vite's sensible defaults mean that you can get started with minimal configuration. While Laravel Mix simplifies Webpack configurations, Vite often requires even less setup, especially for modern JavaScript frameworks like Vue or React.
Plugin Ecosystem: Vite has a robust and growing plugin ecosystem that makes it easy to extend its functionality without diving deep into complex configurations.
Framework Agnostic: Vite is designed to work seamlessly with modern frameworks like Vue 3, React, Svelte, and others. It’s optimized for these environments, providing better integration and performance enhancements tailored to each framework’s needs.
ESM Native: By embracing ES modules, Vite ensures better compatibility and performance with modern JavaScript standards, making it future-proof as the web ecosystem continues to evolve.
Detailed Error Reporting: Vite provides more intuitive and detailed error messages, which can significantly speed up debugging and development.
Built-in Features: Features like TypeScript support, CSS preprocessing, and asset handling are more streamlined in Vite, reducing the need for additional configurations or plugins.
Growing Adoption: Vite has seen rapid adoption in the developer community, which means more resources, tutorials, and community support are available. This can make troubleshooting and learning new features easier.
Future-Proofing: As the web development landscape shifts towards faster, more efficient tools, adopting Vite positions your projects to take advantage of ongoing innovations and optimizations.
While Laravel Mix is a solid and reliable tool, especially for projects already deeply integrated with it, Vite offers significant performance improvements and a more modern development experience that can enhance productivity and scalability.
Additionally, Laravel has officially embraced Vite as its primary front-end asset bundler starting from Laravel 9, indicating strong support and integration moving forward.
Switching build tools can seem daunting at first, but the performance gains and improved developer experience that Vite offers can make it a worthwhile investment in the long run. At the end of the day however, it's all about choosing the right tool that aligns with your project's needs and your team's workflow.
And then one last additional note, there's another build tool called turbopack. Underneath it is built in rust, there's a non zero percent chance likely hood that vite will someday be out dated with turbo pack because of its performance improvements, speed, and ultimately just using an over all more powerful systems level language under the hood that is rust.
So to sum it up, vite offers a multitude of advantages over Laravel mix - the only thing you'll be losing is the fluent builder wrapper api that makes it familiar and easy to work with mix when that's what your familiar with. Vite is set up to be more configuration based and doesn't use a fluent builder pattern - but don't mistake that for it being some crazy hard thing to switch over to.
Vite is a step into the direction of the future, and I know when I first switched several years back one of my main concerns was how it kind of looked like a webpack set up some ways which is extremely annoying and difficult to work with.
I guarantee you that vite is not webpack, and although it uses a configurable way for setting itself up instead of a fluent builder pattern like laravel mix - vite is very enjoyable to work with. It's actually made by the same engineer who made vue.js. Vite is made by one of the very few engineers who I'd consider right there on the same level as taylor otwell (laravel's creator) in terms of how much they as a developer prioritize clean, readable code, and a high quality developer experience.
Thank you for your comparison with the composer at 10:39. It makes me understand npm much better!
Thank you, your explanation is very slow and good for me who is not native English
You are welcome!
well done e very weird sense humor. Loved this stuff.
It's clear the effort that you putting here. Keep doing!
Glad you enjoyed it!
awesome tutorial, thank you dud
5 mins to explain a 15 secs concept embellishment to the next level
I agree, I actually recently shared this with a coworker who was about to do an event and said the exact same thing on it.
Over cooked this one for sure
Awesome explanation!
Much appreciated!
Great!!!!!!! Thanks!!!!!
Welcome!
very useful man, keep going .
Glad it was helpful!
this is the best video to explain what are the Laravel Mix is, and what is actually it does.. Fuck the documentations...
thank you,,
that ,,,
was good,,
Glad you liked it!
thanks man learned a lot!
Glad to hear it!
Great video! How do you compile node_modules dependencies to Vendor directory in public folder?
Thanks a lot 🙏
You're most welcome
wow..!
has any of this changed for Laravel 8?
Haven't been in the front-end parts of Laravel's eco-system for a solid minute, I'm honestly not sure.
I think you should work on your rhetorical
Awful expression of words! How even people understand what this guy is talking about?!!! Listen at 3:02 for example
Too Slowwww :((((
Agreed