How To Develop Websites with Vue.js

11.9k views

This series provides a starting point for building websites with the front-end JavaScript framework Vue.js. Created in 2014 by Evan You (formally of Google), Vue.js is often described as a combination of React and Angular, borrowing the prop-driven development of React and the templating power of Angular. By the end of this series, you will have the tools to develop websites that focus on traditional HTML and CSS, while still taking advantage of the robustness and scalability of a front-end framework.

  • Vue.js is a popular JavaScript framework for creating user interfaces, often described as a combination of React and Angular, borrowing the prop-driven development of React and the templating of Angular. In this tutorial, you will use the Vue CLI vue create command to create a new Vue application, then try it out by building some single-file components.
  • In web development with the JavaScript framework Vue.js, developers often create the frontend of their application before the backend is ready. For a temporary backend, you can use Node.js to create a mock data layer for your application. This tutorial shows how to use environment variables to provide data for different modes of your Vue.js project.
  • With single-page applications, every page or view is rendered within one HTML page. User interface (UI) frameworks like Vue.js render these pages and components when needed through the use of a Virtual DOM. In Vue.js, you can create several views using the first-party library Vue Router. This router makes an association with a view to a URL. In this tutorial, you are going to learn how to add the Vue Router library, integrate it into your project, and create dynamically generated routes.
  • When creating a web application using Vue.js, it's a best practice to construct your application in small, modular blocks of code. You can gain this modularity with Single-File Components. In this tutorial, you are going to create a SFC and use props to pass data down and slots to inject content between tags. By the end of this tutorial, you will have a general understanding of what SFCs are and how to approach code re-usability.