If you want to do front-end work in your Laravel php apps, Vue is what you're encouraged to use, and that has driven adoption to an extent. Vue is also used at places like MIT, NBC Sports, Trustpilot, among other large brands. The main attraction to me, though, is that Vue seems to be most popular with smaller businesses. It doesn't have the same degree of usage and popularity as React, but it's gaining, and the fact that it's so approachable makes it very popular for people working on smaller projects. Okay, so where does Vue work? Vue requires ECMAScript 5, which is pretty much any web browser these days, except for older versions of Internet Explorer.
Vue supports rendering components on the server using the library vue-server-renderer, so you can serve any page that uses Vue with its components fully rendered as html, letting the browser take over from there. There are also frameworks for building native apps with Vue. Weex and NativScript are the main ones as of this recording. This is one area where Vue is not quite as far along as React is with React Native, but there are some very large companies supporting these efforts, and I expect them to continue to mature. For our purposes today, though, we're mainly interested in running Vue in the browser. How do I work with Vue? Well, pretty much any way you want.
And you can also use static site generators, like VuePress, to create a Vue based site and prerender it to static html files, so you don't have to deal with running a node based web server. One more note is that web components are different. Web components are a set of web standards for creating reusable components, which are just starting to come together. Vue derives some of its inspiration from the nascent custom elements APIs, which are part of the web component standard for how it's built. But when we talk about Vue components, they're different from standard web components. You can check out the course Learning Web Components for more on this.
- Installing Vue.js and Vue devtools
- Creating interactive components
- Adding data to components
- Listening for events
- Scaffolding components
- Building and wiring forms
- Animating transitions
- Incorporating live data via REST APIs
- Adding third-party Vue components