Getting started with Vue 3

- Andrés Cruz

En español

Getting started with Vue 3

Vue is a versatile framework used in creating SPA-type websites; It is a modular, component-based technology where a component can be seen as a small piece of code and we can group components together to create more complex components.

Vue is a small, simple and lightweight framework if we compare it with other frameworks like React or Angular, but its simplicity gives us windows like:

  • Less steep learning curve than your competition.
  • The framework is smaller than the competition (about 470 KB and 18 KB minified).
  • It is a versatile framework which means that it can be used together with other solutions such as typescript.
  • It is a reactive framework, which means that when your data model is updated the view is updated and vice versa.
  • Vue is a progressive framework, which means that we can extend it through other officially supported plugins such as Vuex, Router, Testing, among others.

This book is mostly practical, we will learn the basics of Vue, knowing its main features based on a small application that we will expand chapter after chapter.

 

Goal

 

Who is this book for

This book consists of 5 chapters, with which we will learn in detail the most important and basic features of Vue in version 3:

  1. Chapter 1: In this chapter we are going to learn about the basic features of Vue such as its main features, installation modes and project creation, we will make a hello world to present the main features of the web framework.
  2. Chapter 2: In this chapter we are going to learn about the 3 blocks of Vue, script block, template and style, in addition to creating small examples to present the main features of Vue.
  3. Chapter 3: In this chapter we are going to create our first CRUD type project using Vue and an existing CRUD type Rest Api; that is, a Rest Api with a limited scope using with Oruga UI as a component-based client-side web framework.
  4. Chapter 4: In this chapter we are going to create another CRUD type application in Vue using Naive UI instead of Oruga UI as a component-based web framework.
  5. Chapter 5: In this chapter we are going to create an application with Pinia and learn how to use this state manager and understand its components, which are the store, state, actions and getters.

 

 

 

 

Topics of the book

This book has a total of 5 chapters, it is recommended that you read in the order in which they are arranged and as we explain the experiments carried out, go directly to practice, replicate, test and modify the codes that we show in this book.

  1. Chapter 1: In this chapter we are going to review geometric transformations, translations and animations in CSS.
  2. Chapter 2: In this chapter, we are going to create many examples of CSS transitions applied to buttons, in these examples we will mainly apply geometric transformations, but we will also work with other CSS properties.
  3. Chapter 3: In this chapter, we are going to present different examples of CSS effects with the hover event; that is, we will continue using the CSS transitions as we did in the previous chapter; for these examples, we'll use any kind of HTML structure that won't be buttons like in the previous chapter.
  4. Chapter 4: In this chapter, we will create various effects using transitions, also, we will see their limitations through several examples that we will analyze in the next chapter using animations to achieve more complete animations.
  5. Chapter 5: In this chapter, we will present the use of animations, based on examples, we will see its possible variants, configurations and examples using animations and transitions.

This book has a practical approach, knowing the key aspects of the technology and moving into practice, gradually implementing small features of an application that has real scope.

To follow this book you need to have a computer with Windows, Linux or MacOS.

The book is currently in development…

Andrés Cruz

Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz En Udemy

Acepto recibir anuncios de interes sobre este Blog.