Inicio » Cursos » VUE.JS CRUD en PHP y MYSQL

Vincular Vue.js y Axios en una página web | Curso VUE.JS CRUD en PHP y MYSQL

Para vincular las librerías JS debemos de obtener las Urls y ponerlas dentro de la etiqueta head de nuestra web, luego debemos verificar su carga correcta

Lección 1: Vincular Vue.js y Axios en una página web

En la primera lección solo debemos integrar las librerías de Vue.js y Axios.js en el head de nuestra página web o documento html. Trataremos de responder las siguiente preguntas que cualquiera que empieza, se haria:

  1. ¿Cómo integrar Vue.js en una página web?
  2. ¿Cómo integrar Axios.js en una página web?
  3. ¿Cómo se que se ha cargado correctamente la librería Vue.js o Axios.js?

Existen dos formar de integrar varias formas, maneras y matices de integrar librerías en una aplicación web. En esta ocasión  usaremos la forma más sencilla, la cual consiste en tomar las url del repositorio de JS o el CDN. El código es el siguiente:

CÓDIGO PARA INTEGRAR VUE.JS Y AXIOS.JS

<!DOCTYPE html>
<html>
<head>
	<title>Integrando VUE.JS Y AXIOS</title>
	<meta charset="UTF-8">		
	<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.18/vue.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>	
</head>
<body>
</body>
</html>

VERIFICAR LA CARGA CORRECTA DE LAS LIBRERÍAS

Ahora vamos a verificar si al menos carga correctamente vue.js con el código de ejemplo que tiene en su plataforma oficial.

Agregamos una capa div con el id #app y dentro una etiqueta párrafo todo ello dentro  del tag body quedando asi

<div id="app">
  <p>Hola {{mensaje}}</p>
</div>

Creamos un script al final del párrafo agregado

<script>
var app=new vue({
   el:"#app",
   data:{
     mensaje:" Arequipa, La blanca ciudad "
   }
})
</script>

Si todo funciona correctamente nos debe mostrar el mensaje  "Hola Arequipa, La blanca ciudad". Con esto estamos verificando que se ha cargado Vue.js correctamente y tenemos todas las funcionalidades para el desarrollo de nuestro aplicación web.

 


4523 visitas

Curso VUE.JS CRUD en PHP y MYSQL

Curso VUE.JS CRUD en PHP y MYSQL

Descarga el código fuente del proyecto

GRATIS 0.00


COMPRAR CURSO

Codea App
Codea App FullStack

Perú, México, Colombia, España, Venezuela, Argentina, Bolivia

You Fb Tik Pin

© Todos los derechos reservados Codea App | Cursos de programación | 2020 - 2022