Configurando y agregando jQuery

Clase 4 de 61 • Curso de JavaScript y jQuery 2015

Clase anteriorSiguiente clase

Almudena Guerras

student•

**¿Por qué merece la pena utilizar jQuery en nuestros proyectos?

jQuery hace muy bien 4 cosas:**

1- Interactuar con el DOM
2- Manejar animaciones
3- Manejar eventos
4- Manejar AJAX

Además evita incompatibilidades con navegadores y nos ofrece un código simplificado.

Por otro lado, jQuery tiene otros subproyectos muy interesantes como son:

JQuery UI (jQuery User Interface)
JQuery Mobile
QUnit (Test Unitarios)
Sizzle

Alexander Valencia

student•

hoy en 2019 ya vanilla javascript hace todo eso y mejor :)

Alfredo Olmedo

student•

Si, es correcto, pero hoy todavía en el 2019 existen muchas paginas que son antiguas y que todavía dependen de JQuery, aunque sea como mantenimiento

Jonathan Emmanuel Pumares Chab

student•

Una de las maneras de agregar jQuery a nuestro documento HTML es a través de un CDN, que nos trae la librería desde un servidor externo más cercano a nuestra ubicación dando así una respuesta más rápida.

Abdel Mateos

student•

Usar los archivos CDN y lo digo por experiencia, puede suponer que tu app, cargue muchisimo mas lenta o incluso no cargue en determinados lugares del mundo, o cuando la conectividad del cliente, tenga problemas, con lo que CDN le entrega como IP mas cercana. Yo vivo en Marruecos, y en desarrollo jamas uso CDN pues puedo perder horas y horas en las esperas.

Jose Carlo Rojas Mora

student•

Completamente de acuerdo creo que eso dependerá mucho de la conectividad del cliente, mas que todo si estamos desarrollando apps para uso empresarial o mejor dicho apps para una empresa a nivel interno lo cual se da mucho, obviamente si es una pagina web si puede ser lo mejor ya que es un entorno donde siempre necesitara conectividad.

Cesar David Ramírez Dimaté

student•

Pienso lo mismo y es libre decisión de cada desarrollador. Yo prefiero tener mi librería en mi servidor y no resulte que en el sitio oficial la quiten o incluso la hackeen.

Hebert lughi villafuerte ccacala

student•

vale la pena usar jquery en el 2018???

Diego Forero

Team Platzi•

Creo que lo mejor es usar React, Vue o Angular, si tu proyecto es demasiado pequeño puedes buscar librerías para hacer funciones especificas, ya muchas de estas librerías no necesitan de JQuery.

Alexander Valencia

student•

En 2019 NOOOO jajajj unos años tarde la respuesta jajjaj

Cesar David Ramírez Dimaté

student•

jQuery

Alexander Valencia

student•

muy bueno

Jonathan Emmanuel Pumares Chab

student•

La versión sin minificar se usa para desarrollo.

Jonathan Emmanuel Pumares Chab

student•

Y otra manera de incluir jQuery es descargando el archivo desde algún servidor y guardarlo en nuestro disco duro y agregarlo a nuestro documento HTML desde donde se guardo.

Jonathan Emmanuel Pumares Chab

student•

Podemos comprobar que se agrego jQuery a nuestro documento HTML a través de la consola del navegador escribiendo jQuery o el atajo de $.

Joel Buenrostro

student•

Hasta hoy se lo que significa el signo $ en las paginas

Cesar David Ramírez Dimaté

student•

Más que todo en jQuery. Este símbolo también se utiliza bastante en Php.

Jonathan Emmanuel Pumares Chab

student•

La versión minificada se usa para producción.

Alexander Valencia

student•

yes

Edwin Ortiz Llamccaya

student•

He estado viendo que , hay algunos atajos que usa en Sublime Text, pero no los encuentro en emmet, tanto para lin, y scrip? alguien sabe que plugin adicional es

Roberto Hernández Capistran

student•

cuando hice este paso agregaron estos parametros saben que beneficios tiene:

"The integrity and crossorigin attributes ..."

Alejandro Sanabria

Team Platzi•

Ayuda a verificar que el script que traes del CDN no a sido alterado de forma maliciosa

Andrei bolaños

student•

Dejo este código aquí, el de Sasha no me funciono, tal vez a alguien le sirva.

Noe Mikhael Huaccharaque Ruiz

student•

cual es la diferencia entre jQuery Core vs. jQuery UI??

Diego Forero

Team Platzi•

jQuery Core es la librería base donde se encuentran las utilidades generales.
jQuery UI es un librería que ya tiene widgets como calendarios o acordeones que se pueden usar de manera rápida.

La verdad jQuery no es necesario hoy en día gracias a librerías y frameworks como React, VueJS o Angular.

Josue Baloy Melendez

student•

mmmmm no se al parecer no es lo que esperaba de estos cursos.

Cesar David Ramírez Dimaté

student•

Hasta ahora está empezando, es bueno criticar por lo menos cuando hayas culminado alguno.

Raúl Segura Nabarret

student•

Otra manera de insertar jQuery en nuestro proyecto es usando npm o usando bower

npm install jquery

bower install jquery

Alejandro Sanabria

Team Platzi•

Es la mejor si usas algo como webpack o browserify para compilar tu código

Christopher Guzman Reyes

student•

No me carga el alert, tengo que instalar alguna librearia? Ya estuve revisando el llamado de los archivos y el css lo carga sin problema no se por que el .js no funciona

Inno

student•

Hola, prueba revisando donde guardaste el archivo .js y luego revisa el atributo src del script que llamas en el index.html

Andrea Angélica Fernández Villa

student•

Es mejor usar jQuery a través de un CDN o de manera local en nuestro proyecto? Cual de las dos sería mas eficiente?

Diego Forero

Team Platzi•

Es algo relativo, por estabilidad de tu aplicación es mejor que lo tengas en tu servidor, ya que el CDN puede fallar o cambiar la versión y romper tu sitio web.

Cesar David Ramírez Dimaté

student•

Todos los archivos en la carpeta tvify

index.html

<!DOCTYPE html>

<html>

    <head>

        <title>TVify</title>

        <link rel="stylesheet" type="text/css" href="index.css">

</head>

    <body>

        <script type="text/javascript" src="index.js"></script>

        <!-- code.jquery.com / CDN -->

        <script type="text/javascript" src="http://code.jquery.com/jquery-2.2.4.min.js"></script>

        <!-- Descargar el js en nuestro proyecto -->

        <!--<script type="text/javascript" src="jquery-2.2.4.min.js"></script>-->

    </body>

</html>

index.css

body {

    background-color: #bdc3c7;

    margin: 0;

index.js

alert('Hola Platzi');

Jaime Giraldo

student•

En la versión Uncomprees el código es legible y organizado.
Se debe utilizar en desarrollo.
En la versión minified el javascript está comprimido. (Pesa mucho menos el archivo) se debe utiliza en producción.
CDN resuelve el tiempo de carga de los archivos javascript.
$ es igual a Jquery