This series will discuss both Vue’s Options API and Composition API, with a focus on the latter. (If you have no idea what this means, no worries, it will make sense later.)
In terms of prerequisites, this series assumes you’re comfortable with the following:
- HTML & CSS
- Working in command line and in a code editor
Everything else? We’ll cover as we get to it.
Digging in, let’s discuss how web sites are built to understand the role of Vue.js. First - let’s look broadly at the technologies used to build web sites:
In its simplest form, a web site is made up HTML that dictates the structure of the page and CSS to indicate the style. As we click links or submit forms, requests are made to a server to be processed by languages like PHP, Node.js, Java, Python, etc., and ultimately a new response of HTML/CSS is returned back to the browser where it’s rendered.
Depending on this “round trip” to the server to view different content/pages is a classic web model, and it’s great for delivering relatively static information to visitors. A good example of this classic model is something like Wikipedia. We can browse around from page to page, we can input some information via things like a search box, and that input can influence our results.
But now-a-days, we demand more of web sites. We expect the level of interactivity that rivals the kind of things we used to only be able to accomplish via desktop applications. And we want this interactivity to happen fast - we expect instant results - we don’t want to have to wait for the entire page to be refreshed from the server for every little interaction we take. For an example, think about how web applications like Google Docs has become just as powerful as desktop applications like Microsoft Word.
That being said, let’s highlight some Vue’s selling points:
- Approachable - Vue.js is beginner friendly while also powerful enough to grow with you and your applications.
- Versatile - Vue.js is flexible enough to be integrated into existing projects or it can be used to build a new application from the ground up.
- Performant - Vue.js is lightweight, allowing you to start with the core framework, pulling in additional features as you need them (e.g. routing, state management, server-side rendering, testing).