javascript archivos - Instituto FOC | Informática ONLINE | FP Informática ONLINE

Especialistas en Informática

¿Conoces los fraudes más comunes en Internet?

Desde el nacimiento de internet es indudable la gran cantidad de oportunidades y ventajas que nos ha proporcionado, pero no todo son ventajas y oportunidades, en ocasiones podemos vernos con situaciones de fraude no deseadas.

El supuesto anonimato que ofrece internet, pero sobre todo la capacidad de operar desde cualquier lugar del mundo, hace que se convierta en una oportunidad ideal para la realización de fraudes de todo tipo.

5

Los fraudes más comunes son los siguientes:

  • En las compras ONLINE.
    • Productos falsificados.
    • Cargan importes superiores a los indicados en el producto.
    • Plazos de envío superiores a los indicados.
    • No tienen un teléfono de reclamaciones, solo formularios de contacto de los que nunca tienes respuesta.
  • El Phishing o robo de datos personales, credenciales de acceso a servicios online o los más buscados, información bancaria. Se basa en enviar mails suplantando a la entidad de la cual quieren robar tus credenciales, con la finalidad de que a través de este correo, siguiendo un enlace adjunto, te dirijas a una web que suplanta a la original y en ella introduzcas tus credenciales.
  • Falsos prestamos, a través de las redes sociales estos delincuentes ofrecen préstamos a muy bajo interés. Aprovechándose de la desesperación de la gente, con el engaño de un tipo de interés tan bajo, reclaman dinero por adelantado, para gastos de gestión y una vez recibido el dinero desaparecen.
  • Encontrar pareja por internet. Es este caso lo que más se usa la suplantación de identidad, creando perfiles falsos en redes sociales, con fotos y videos de carácter sexual o comprometedor. Una vez conseguida la confianza de la víctima solicitan cantidades de dinero por cualquier motivo.
  • Falsos alquileres o ventas de vehículos. Consiste en ofrecer alquileres de inmuebles o coches muy baratos. En ambos casos, el engaño suele ser similar: propietarios que se encuentran en el extranjero, y que no pueden salir del país en el que residen por el alto coste que supondría venir a realizar la operación de venta o alquiler. Además alegan que ya no volverán y por lo tanto no tienen interés en seguir residiendo o haciendo uso del bien en cuestión, y que por ese motivo lo alquilan o venden. El resultado siempre es el mismo, no hay inmueble que alquilar ni vehículo que vender.

Con esta información solo queremos dar a conocer estos fraudes a los usuarios de Internet  y que puedan eludirlos y a ser posible denunciarlos.

Los alumnos del certificado de profesionalidad IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web, y el IFCD0110 Confección y publicación de páginas web, son capaces de detectar algunos de estos fraudes y eludirlos.

Los desarrolladores siguen prefiriendo Linux.

Aunque Microsoft ha dado un gran salto en el intento de agradar a los desarrolladores, con el lanzamiento de Windows 10.

Otros sistemas de Microsoft no gustaron mucho a los desarrolladores, pero Windows 10 con la incorporación de subsistemas Linux, empieza a tener cada vez más seguidores.

 

Pero Linux sigue teniendo mucho que decir en cuanto a su uso como plataforma de desarrollo de software y mantiene una serie de atractivos que le hacen retener a los desarrolladores.

Para realizar una comparación justa en igualdad de condiciones, necesitamos de la colaboración de los grandes del software que se niegan a portar o editar su software para Linux.

En cualquier caso la plataforma del pingüino mantiene una serie de ventajas muy visibles que le permiten mantener gran número de seguidores entre los desarrolladores de software.

Bajo mi punto de vista las ventajas de Linux son:

  • Es libre y gratuito, lo que le aporta flexibilidad y coste 0,00€ en licencias.
  • Recursos, permite la optimización del sistema para la compilación o para las herramientas de desarrollo que uses.
  • Es sencillo, aunque tiene fama de complejo, no es complicado de usar y gestionar.
  • Tiene soporte para múltiples lenguajes de programación como C, C++,PHP, HTML, CSS, JavaScript, Perl, Java, Python, etc.

Pero seguro que los desarrolladores que siguen en Linux tienen muchas más razones para trabajar con Linux, en el desarrollo de sus proyectos.

Entre por los alumnos del certificado de profesionalidad IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web, y el IFCD0110 Confección y publicación de páginas web, tenemos partidarios de uno y otro sistema.

¿Cómo medir la velocidad de carga de mi página web?

Para conseguir una buena experiencia entre los usuarios de nuestra página web, tenemos que conseguir que la carga de la página sea lo más rápida posible y conseguir que el tiempo de respuesta sea adecuado. Estas técnicas para la mejora de la experiencia de los usuarios web, son estudiadas por los alumnos del certificado de profesionalidad IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web, y el IFCD0110 Confección y publicación de páginas web.

Para saber qué velocidad de carga tiene nuestra web y su tiempo de respuesta podemos usar dos herramientas gratuitas.

  • Para medir la velocidad, la herramienta de Google denominada PageSpeeds Insights.
  • Para medir el tiempo de carga web, utilizaremos Pingdom.

La herramienta PageSpeeds Insights analiza la página web que le indiquemos, ofreciendo todo tipo de destalles con respecto a las mejoras necesarias para aumentar la velocidad de la página web, para ello mide el rendimiento de las páginas para dispositivos móviles y para ordenadores, puntuando de 0 a 100. De forma que  si una página tiene 90 puntos es que está muy bien optimizada su velocidad. En el ejemplo de abajo vemos justamente lo contrario, solo 38 puntos de 100.

PageSpeed01

 

Para medir el tiempo de carga usaremos Pingdom. Es muy sencillo de usar, solo tenemos que indicar la web a chequear y nos ofrece los resultados.

pingdown01

El resumen de resultados es el siguiente, en el que te indica el tiempo de carga (Load Time), que como podemos ver es muy alto, ya que Google recomienda 1,5 S.

pingdown02

Es muy importante tener presente que el tiempo de carga y la velocidad de respuesta de una página web, pueden ser factores determinantes para el éxito o el fracaso de una página web.

 

Tipos de hojas de estilos que podemos aplicar en nuestra página web.

Las hojas de estilos CSS en inglés Cascading Style Sheets (en español Hojas de Estilo en Cascada), permiten el control total sobre la presentación de las páginas web.

css

Con las  hojas de estilos CSS, puede colocar y definir con precisión la apariencia de los elementos de una página web.

Una hoja de estilos CSS puede ser:

  • Externa
  • Interna
  • En línea

El orden de prioridad de las hojas de estilos es la siguiente:

  1. La hoja de estilos en línea frente a la externa e interna
  2. La hojas de estilos interna frente a la externa

Además debemos tener presente que una página web puede usar uno o varios de estos tipos de CSS a la vez.

Para que sirven los distintos tipos de hojas de estilos.

  • Las CSS externas sirven para aplicar de forma coherente los mismos estilos a un proyecto web. De esta forma una modificación en un estilo se aplica a todas las web de un proyecto, de forma automática.
  • Las CSS internas o también conocidas como incrustadas, sirven para aplicar estilos a una sola web y también para modificar los estilos de heredados de una CSS externa. Las CSS internas se incluyen entre las etiquetas <head> de las páginas web.
  • Las CSS en línea sirven para aplicar las propiedades de las hojas de estilos en cascada a elementos individuales de una página sin tener que reutilizar el estilo. Los estilos en línea se definen dentro de las etiquetas iniciales de los elementos HTML de páginas web.

Por ejemplo:

<div id=»reloj» style=»font-family: ‘DS-Digital’; width: 450px; background-color: black;font-size:100px;color: green ; text-align: center «></div>

En el artículo de la semana pasada, usamos Javascript para aplicar estilos al reloj digital propuesto, mediante estilos en línea. Estos mismos estilos los podemos aplicar mediante:

  • CSS interna, de la siguiente manera:
  1. <script type=»text/javascript»>
  2. function startTime(){
  3. today=new Date();
  4. h=today.getHours();
  5. m=today.getMinutes();
  6. s=today.getSeconds();
  7. m=checkTime(m);
  8. s=checkTime(s);
  9. document.getElementById(‘reloj’).innerHTML=h+»:»+m+»:»+s;
  10. t=setTimeout(‘startTime()’,500);}
  11. function checkTime(i)
  12. {if (i<10) {i=»0″ + i;}return i;}
  13. window.onload=function(){startTime();}
  14. </script>
  15. <div id=»reloj» ></div>
  16. <head>
  17. <style type=»text/css»>
  18. #reloj { font-family: ‘DS-Digital’;
  19.         width: 450px;
  20.                                background-color: black;
  21.                                font-size:100px;
  22.                                color: green ;
  23.                                text-align: center;
  24.                                }
  25.      </style>
  26. </head>
  • CSS externa, de la siguiente manera:

Contenido fichero externo con los estilos CSS. Lo llamaremos estilos_reloj.css.

  1. #reloj {
  2.                                font-family: ‘DS-Digital’;
  3.         width: 450px;
  4.                                background-color: black;
  5.                                font-size:100px;
  6.                                color: green ;
  7.                                text-align: center;
  8. }

Contenido fichero con el código principal:

  1. <script type=»text/javascript»>
  2. function startTime(){
  3. today=new Date();
  4. h=today.getHours();
  5. m=today.getMinutes();
  6. s=today.getSeconds();
  7. m=checkTime(m);
  8. s=checkTime(s);
  9. document.getElementById(‘reloj’).innerHTML=h+»:»+m+»:»+s;
  10. t=setTimeout(‘startTime()’,500);}
  11. function checkTime(i)
  12. {if (i<10) {i=»0″ + i;}return i;}
  13. window.onload=function(){startTime();}
  14. </script>
  15. <div id=»reloj» ></div>
  16. <head>
  17. <meta http-equiv=»Content-Type» content=»text/html; charset=iso-8859-1″ />
  18. <title>Ejemplo de estilos CSS en un archivo externo</title>
  19. <link rel=»stylesheet» type=»text/css» href=»estilos_reloj.css» media=»screen» />
  20. </head>

Animo a lector a desarrollar sus estilos para este reloj digital y publicar el código. Es un ejercicio muy gratificante.

Todos nuestros alumnos  que han cursado el certificado de profesionalidad IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web, y el IFCD0110 Confección y publicación de páginas web, conocen bien todos estos aspectos de las CSS y saben como aplicarlas según los requerimientos de la web que estén programando.

 

Como mostrar la fecha y hora actual en nuestra página web usando Javascripts.

Todos nuestros alumnos  que han cursado el certificado de profesionalidad IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web,  conocen que Javascripts es un lenguaje que se ejecuta en el lado del cliente. Permitiendo esto una serie de funcionalidades que hacen que la página cambie su contenido sin necesidad de llamadas al servidor, es decir, cambia de aspecto en el navegador de nuestro ordenador. Una de estas funcionalidad es la de mostrar el fecha y hora actual en nuestra web.

Hay muchos programas de edición web y CMS que permiten añadir esta funcionalidad a nuestras webs, pero para los que buscamos profundizar un poco más, nos gusta saber como hacerlo manualmente, y así aportar nuestro toque personal. Para ello también podemos usar CSS.

Las funciones más usadas para esta funcionalidad son:

Función Descripción
getDate() Devuelve el día del mes (entre el 1 y el 31)
getDay() Devuelve el día de la semana (entre el 0 y el 6)
getMonth() Devuelve el mes (entre el 0 y el 11)
getFullYear() Devuelve el año (en formato de 4 dígitos)
getHours() Devuelve la hora (entre el 0 y el 24)
getMinutes() Devuelve los minutos (desde 0 a 59)
getSeconds() Devuelve los segundos (desde 0 a 59)
getTime() Devuelve el número de milisegundos desde el 01/ Enero /1970
getTimezoneOffset() Devuelve la diferencia de horario en minutos entre la hora local y GMT (Meridiano de Greenwich)
getUTCHours() Devuelve la hora de acuerdo a UTC (Tiempo Universal Coordinado)

Para usar estas funciones, es tan sencillo como crear una variable con new Date() para definir la fecha y hora actual y luego pintar en pantalla los datos que deseemos. En el ejemplo siguiente, pintamos el día del mes en el que estamos.

<script type=»text/javascript»>

var d = new Date();

document.write(d.getDate());

</script>

Si queremos que nos diga la hora, podemos escribir el siguiente código:

<script type=»text/javascript»>

var d = new Date();

document.write(d.getHours());

</script>

Para conseguir que nos de toda la información sobre le fecha y hora, podemos encadenar las funciones de fecha y hora, mediante el siguiente código:

<script type=»text/javascript»>

var d = new Date();

document.write(‘Fecha: ‘+d.getDate(),'<br>Dia de la semana: ‘+d.getDay(),'<br>Mes (0 al 11): ‘+d.getMonth(),'<br>Año:’+d.getFullYear(),'<br>Hora:’+d.getHours(),'<br>HoraUTC: ‘+d.getUTCHours(),'<br>Minutos: ‘+d.getMinutes(),'<br>Segundos: ‘+d.getSeconds());

</script>

Obteniendo un resultado en pantalla como el siguiente:

Fecha: 18

Día de la semana: 5

Mes (0 al 11): 7

Año: 2017

Hora: 9

Hora UTC: 7

Minutos: 15

Segundos: 51

Pero esto hay que adaptarlo a nuestro formato de fecha, de forma que sea el usado habitualmente en nuestro país. Por ejemplo el siguiente código, nos muestra la fecha en formato día/mes/año. Ejemplo 22/08/2017.

<div style=»float:left;»>

<script type=»text/javascript»>

var  today = new Date();

var m = today.getMonth() + 1;

var mes = (m < 10) ? ‘0’ + m : m;

document.write(‘Fecha: ‘+today.getDate(),’/’ +mes,’/’+today.getFullYear());

</script></div>

En muchas publicaciones encontraras ejemplos de códigos para pintar de forma correcta la fecha y hora en tus webs. Aconsejamos al lector que busque y pruebe los ejemplos de código propuestos.

En el siguiente ejemplo tienes el código básico para poner en tu web un reloj digital. A este código le puedes aplicar tantos formatos que como desees para personalizarlo.

 <script type=»text/javascript»>

function startTime(){

today=new Date();

h=today.getHours();

m=today.getMinutes();

s=today.getSeconds();

m=checkTime(m);

s=checkTime(s);

document.getElementById(‘reloj’).innerHTML=h+»:»+m+»:»+s;

t=setTimeout(‘startTime()’,500);}

function checkTime(i)

{if (i<10) {i=»0″ + i;}return i;}

window.onload=function(){startTime();}

</script>

<div id=»reloj» style=»font-family: ‘DS-Digital’; width: 450px; background-color: black;font-size:100px;color: green ; text-align: center «></div>

¿Podrás aplicar estilos a este reloj digital hasta conseguir el siguiente aspecto?

Reloj-Digital

Una vez conseguida esta presentación, te animo a publicar el código, es un ejercicio muy gratificante.

 

¿Qué son las supercomputadoras cuánticas?

Las computadoras cuánticas, están basadas en la mecánica cuántica y no tanto en la electrónica y por tanto tienen el potencial de ser más poderosas que las tradicionales, basadas en el sistema binario, es decir, unos y ceros que representan estados como «on/off» y «verdadero/falso».

BINARIO-TEXTO-1

Las computadoras cuánticas, contienen qubits, que pueden ser tanto 0 como 1 al mismo tiempo, un estado conocido como superposición.

Las partículas subatómicas (los electrones, fotones e iones) pueden ser manipulados para que se comporten de este modo tan misterioso. Este comportamiento tan excepcional, creen que puede hacer, que un computador cuántico, llegue teóricamente, a resolver tres millones de cálculos por segundo.

Desgraciadamente, hoy en día esta tecnología no está totalmente desarrolla y requiere de ciertas condiciones especiales para su funcionamiento. Una de ellas es que necesita que el procesador esté justamente por encima del cero absoluto (unos -273.15 en la escala de Celsius), además debe estar alejado de cualquier interferencia electromagnética.

Sin embargo, un sector tan pudiente como el de las finanzas está interesado en este tipo de computación, por la capacidad de calcular miles de escenario posibles, estudiarlos y elegir aquellos más viables a largo plazo. Pero también este mismo sector se plantea que esta capacidad del cálculo tan impresionante, será capaces de romper los códigos de encriptación de las transacciones financieras y las encriptaciones de cualquier otro tipo de sistema de seguridad implantado en los sistemas informáticos anteriores, a las supercomputadoras cuánticas.

Es decir, esta capacidad de cálculo que puede llegar a tener las supercomputadoras cuánticas  romperá la seguridad informática, hasta la fecha implantada, comprometiendo gravemente, toda la seguridad de los sistemas financieros, gobiernos, ejércitos, etc.

Robo de password

Por lo que cabe concluir que necesitamos, “una fórmula matemática que cree un lenguaje encriptado imposible de quebrar». Según, Marco López de Prado, ejecutivo de la firma Guggenheim Partners.

Teniendo en cuenta que la capacidad de procesamiento de cada generación cuántica, es cada vez mayor, el tiempo apremia para conseguir esa fórmula matemática. De lo contrario, la seguridad de los sistemas informáticos, anteriores a la computación cuántica, se puede ver drásticamente comprometida.

Todos estos conceptos le son muy familiares a los alumnos del certificado de profesionalidad IFCT0210 Operación de Sistemas Informáticos ya que forma parte de su formación en ordenadores tradicionales.

 

Linux en Windows. Quién lo hubiera dicho hace una década!!!!.

Aunque en noviembre del 2016, ya anunciamos en este blog que  Microsoft era nuevo miembro de platino en “Linux Fundation”. Si !!! ¿Increíble pero cierto?

Efectivamente, Microsoft  tiene un lugar privilegiado junto a  Cisco, Fujitsu, HPE, Huawei, IBM, Intel o Samsung en la fundación del pingüino. Es decir,  Microsoft  entra a las claras y sin tapujos en la casa madre de Linux.

Linux-Amor-Windows

Para muchos ha supuesto una verdadera sorpresa. ¿Los dos eternos rivales, ahora colaboran juntos? Pues sí, en especial desde que Satya Nadella está al frente de Microsoft.

Ahora Windows y Linux ya trabajan juntos. Desde esta semana es posible descargar la distribución Ubuntu desde la tienda de aplicaciones de Microsoft en ordenadores  equipados con Windows 10.

No es una distribución completa de Ubuntu, pero atención, se anuncia que habrá nuevas posibilidades de descarga de SUSE y Fedora.

Con esta nueva estrategia, Windows pretende consolidarse como la plataforma mar versátil, para desarrolladores y así disuadir a los usuarios más avanzados, en la instalación de un segundo Sistema Operativo.

Para todos los alumnos de los certificados de profesionalidad que disponemos, tanto los de desarrollo, como los de Sistemas, no supone un gran cambio; ya que suelen trabajar con ambos sistemas operativos.

Lo dicho,  QUIEN LO HUBIERA DICHO HACE UNA DÉCADA, QUE NOS LO HAGA SABER. Le felicitaremos, por ser el mejor visionario.

¿Cumple tu página web con las normas básicas de accesibilidad?

El concepto de accesibilidad es muy conocido por nuestros alumnos del certificado de profesionalidad IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web, ya que forma parte del temario del curso.

Este concepto indica la facilidad con la que algo puede ser accedido por todas las personas, especialmente por aquellas que poseen algún tipo de discapacidad. Busca la igualdad de acceso a la web para todos los usuarios.1

Los usuarios  con discapacidad tienen los siguientes problemas para acceder a la web:

  • Acceso a los contenidos web: problemas en visión, audición y/o movilidad.
  • Manipulación de periféricos: dificultades en el uso del teclado y/o ratón.
  • Interacción con los interfaces de usuario: dificultades en la navegación y/o comprensión.

Pero hay otros problemas de accesibilidad que no debemos olvidar y que son provocados por el idioma, la edad, conocimientos previos, conectividad, etc..

El máximo organismo dentro de la jerarquía de internet que se encarga de promover la accesibilidad es el World Wide Web Consortium (W3C), en especial su grupo de trabajo Iniciativa de Accesibilidad en la Web (WAI).

La accesibilidad web la podemos definir como la “posibilidad de que un sitio o servicio web pueda ser visitado y utilizado de forma satisfactoria por el mayor número posible de personas, independientemente de las limitaciones personales que tengan o aquellas derivadas del entorno que las rodea”.

El W3C, dispone de esta herramienta https://validator.w3.org/ en que todos los programadores web deben chequear el nivel de accesibilidad de las páginas desarrolladas.

El objetivo a cumplir es que este validador no reporte ni errores ni warning en la accesibilidad de nuestras web, aunque es por todos conocido, que es muy difícil.

Abajo adjunto el resultado de chequear la web de la Universidad de Granada (www.urg.es). Web con de gran importancia y visitada por un amplio abanico de usuarios a diario y que como podéis comprobar no está exenta de problemas de accesibilidad.

validator-w3-ugr

Beneficios que tiene para nuestra web al cumplir con las normas de accesibilidad:

  1. Aumentar el número de usuarios visitantes del sitio web, al posibilitar que los usuarios con discapacidad, de edad avanzada, baja alfabetización, etc..
  2. Disminución de costes y mantenimiento. Una página web accesible también permite la reutilización del contenido, al ser independiente del dispositivo de acceso.
  3. Reduce tiempos de carga de las páginas web y del servidor
  4. Consigue mejorar los resultados en los motores de búsqueda.

En certificado profesionalidad  IFCD0210-Desarrollo de Aplicaciones con Tecnologías Web, se estudia con detalle todos los aspectos de la accesibilidad web, permitiendo que los alumnos sean capaces de desarrollar webs accesibles.

El motor de la tecnología AJAX

AJAX (Asynchronous Javascrip y XML) es una técnica de desarrollo web que permite crear aplicaciones web interactivas. Estas aplicaciones se ejecutan del lado del cliente y permite mantener la comunicación asíncrona con el servidor en segundo plano permitiendo así realizar cambios sobre las páginas sin necesidad de recargarlas.

En este post nos vamos a centrar en conocer el motor de la tecnología AJAX, es decir nos vamos a centrar en ver cómo funciona realmente y cuál es el “motor” que mueve toda la maquinaría de AJAX.

Aunque HTML+CSS nos proporciona el medio para presentar los contenidos mediante páginas Web y XML nos ofrece un medio estandarizado para transmitir la información, es la tecnología JavaScript la que verdaderamente nos aporta la posibilidad de crear la comunicación asíncrona de la que hacíamos referencia en el apartado de ventajas. Por este motivo, podemos afirmar que el verdadero motor de AJAX es JavaScript.

Comparando esta tecnología con un automóvil, podríamos decir que HTML+CSS representa el chasis del coche,  XML el combustible y JavaScript es el motor que mueve todo.

JavaScript es un lenguaje de programación (scripting language) en el que normalmente se efectúan las funciones de llamada de Ajax mientras que el acceso a los datos se realiza mediante XMLHttpRequest. Este objeto está disponible en los navegadores actuales y es el eje central de AJAX, por lo que todos los navegadores que no lo contemplen no permitirán trabajar con AJAX.

El objeto XMLHttpRequest es un API implementado en el navegador Web, es decir, en la parte cliente, que puede ser invocado desde varios lenguajes de programación, entre los que se encuentra, como es obvio, JavaScript. Técnicamente, está desarrollado para crear un canal de comunicación independiente entre el servidor y la página Web que se está mostrando en el navegador.

La W3C, World Wide Web Consortium,  (organización internacional que crea los estándares de Internet) en  2006 creó la primera especificación completa para el objeto XMLHttpRequest. Dicha especificación marca las características mínimas que deben implementar los navegadores que afirmen que poseen la posibilidad de usar dicho objeto para que funcione perfectamente la aplicación Web.

AJAX-FOC

Podríamos indicar como principales características de AJAX que:

  • AJAX es una unión de tres tecnologías ya existentes: HTML+CSS, XML y DOM+XMLHttpRequest.

  • HTML+CSS nos proporcionan el medio para crear una página Web.

  • XML nos suministra una forma de enviar y recibir información en un formato estándar.

  • JavaScript, mediante DOM y el objeto XMLHttpRequest, nos da la posibilidad de acceder a los elementos de la página Web para su modificación y establece el camino de acceso al servidor.

  • La mayor ventaja de AJAX es que posibilita una comunicación asíncrona con el servidor.

  • Haciendo uso de AJAX vamos a conseguir crear aplicaciones Web interactivas que puedan cambiar y actualizarse sin necesidad de que la página deba ser recargada desde cero; sólo se tendrán que recargar partes de ella.

  • No todos los navegadores tienen soporte para AJAX o alguna de sus tecnologías por lo que una aplicación puede no funcionar.

  • El objeto XMLHttpRequest, encargado de la comunicación entre el navegador y el servidor, tiene su propia especificación, desarrollada por la W3C, con los requisitos mínimos que debe cumplir.

Por tanto de lo descrito aquí deducimos que un correcto manejo de AJAX nos obliga a conocer y controlar perfectamente el objeto XMLHttpRequest.

El uso de JQuery

JQuery es una biblioteca de funciones y utilidades escritas en JavaScript que permite simplificar el modo de interactuar con las web así como de presentar la información en la misma.

JQuery se ha desarrollado bajo la filosofía del software libre y de código abierto y no depende de ninguna tecnología. Eso quiere decir que podemos usarla tanto con aplicaciones programadas en PHP en servidores LINUX como con aplicaciones programadas en .NET en servidores Microsoft o en sistemas JSP con JAVA.

jqueryUI-FOC-pagina

Dentro de las razones por las que conviene el uso de JQuery, podemos indicar:

  • Fácil manejo del DOM usando selectores CSS, con algunos añadidos fuera del estándar por usar Sizzle.
  • Posibilidad de tomar el código de un servidor CDN. Si vas a usar este método, te recomiendo que uses el servidor de Google. Tienen varios datacenters repartidos por el mundo y es fácil que el usuario pueda establecer una conexión rápidamente. En esta página encontrarás el enlace a la última versión.
  • Fácil uso con ajax si necesitamos usar un modelo complejo y enviar recibir muchos parámetros. Es decir, enviar datos en formato JSON es mucho más sencillo que hacerlo a mano.
  • Animaciones muy sencillas: si queremos crear objetos animados (banners…) es muy útil Alternativa: Adobe Edge Animate.
  • Inicialización al cargar el árbol DOM, no la pagina entera. Aunque no sea complicado escribir una función window.ready, el uso de $(document).ready simplifica mucho las cosas, y es mucho más estable.
  • Manejo rápido de propiedades y css. Si tienes que cambiar más de 3 o 4 propiedades css de un elemento, el código que usarás será muy repetitivo. Con jQuery, hacer esto es simplemente pasar las propiedades a cambiar con sus respectivos valores en formato JSON.

Las razones por las que se podría desaconsejar el uso de JQuery podrían ser:

  • Ocupa mucho. Si nuestro código es pequeño (no sobrepasa las 100, 150, o incluso 200 líneas sin comprimir), no vale la pena usar ayuda. Piensa que jQuery tiene unas 9.000 líneas de código. El usuario pasará más tiempo descargando la librería que nuestro código.
  • Animaciones con CSS. Aún no están extendidas, algunos navegadores no las soportan… pero si la animación es puramente estética, vale la pena limitarse al css y pasar de JavaScript.
  • Interacción con el DOM.
  • Validación de formularios: con HTML5, le pones un atributo required a un input y él solito se valida. Esto que sería una ventaja se puede volver en nuestra contra al perder cierto control sobre cómo se realiza esa validación.

Existen muchos autores que desaconsejan el uso de JQuery puesto que todo lo que hace, lo podríamos implementar nosotros a traves de JavaScript.

Ahora bien, mi planteamiento está en que debemos reutilizar todo el software que podamos  y en ese sentido JQuery nos facilita la escritura de web.

Si deseáis más información podéis utilizar estos recursos:

fp-foc

Tiempo real para tu App mediante AJAX

Como sabemos Ajax no es una tecnología en sí mismo. En realidad, se trata de varias tecnologías independientes que se unen para conseguir un fin.

Las tecnologías que forman AJAX son:

  • XHTML y CSS, para crear una presentación basada en estándares.

  • DOM, para la interacción y manipulación dinámica de la presentación.

  • XML, XSLT y JSON, para el intercambio y la manipulación de información.

  • XMLHttpRequest, para el intercambio asíncrono de información.

  • JavaScript, para unir todas las demás tecnologías.

En esta sesión aprenderás a usar AJAX para interactuar en tiempo real con tu aplicación web para añadir una mayor fluidez en la experiencia de usuario.

Fecha y hora:

  • ? 16 de Junio de 2016
  • ⏰ 21:00 a 21:45 h

Objetivos:

  • Entender qué es AJAX y cómo funciona.
  • Aplicar AJAX a nuestras aplicaciones web.

modelo-AJAX-FOC

Contenidos:

Los contenidos que se verán a lo largo de la sesión son:

  • 1.Entender AJAX y cómo funciona.
  • 2. Conocer el modelo de documentos DOM.
  • 3. Realización de peticiones mediante AJAX.
  • 4. Procesado de peticiones mediante AJAX.
  • 5. Modificación de la apariencia de la aplicación web, de manera dinámica.

Lo mejor de todo es que, como siempre, es totalmente gratis para todos aquellos que quieran participar en el mismo. Os recordamos también las 2 modalidades de asistencia:

  • ✅ Asistente: para participar en directo de forma interactiva y poder hacer preguntas al profesor.
  • ❎ No asistente: si no puedes asistir en directo, grabamos la sesión para visualizarla posteriormente y te daremos acceso a la misma una vez finalizada, para que la veas cuando quieras.

Por último, no olvidéis que las plazas para asistir en directo son limitadas, así que… ¡corred a apuntaros! ?

[minti_button link=»https://www.foc.es/webinar/regConf/41.html» size=»large» target=»_blank» lightbox=»false» color=»orange»]Mas información y registro[/minti_button]

Efectos visuales para tu App Web mediante JQuery

JQuery es una biblioteca de funciones y utilidades escritas en JavaScript, que permite simplificar la manera de interactuar con los documentos HTML, manipulando el objeto DOM, manejando eventos, permitiendo desarrollar animaciones, etc. (Ver más).

En este webinar aprenderás de un modo práctico a usar la biblioteca de funciones JQuery y conocerás el funcionamiento de Jquery para dotar de impresionantes efectos visuales a tus aplicaciones web.

Fecha y hora de grabación:

  • ? 09 de Junio de 2016
  • ⏰ 21:00 a 21:45 h

Objetivos:

  • Entender qué es JQuery y cómo funciona.
  • Aplicar de un modo práctico JQuery a nuestra aplicaciones web.

jqueryUI-FOC-pagina

Contenidos:

Los contenidos que se verán a lo largo de la sesión son:

  • 1.Entender que es JQuery y cómo funciona.
  • 2. Modificación del estilo de nuestra web.
  • 3. Mostrar y ocultar elementos.
  • 4. Inclusión de diferentes efectos.
  • 5. Gestión de eventos para capturar la interacción del usuario con nuestra aplicación web.

¿Cual es el lenguaje de programación mas popular?

El pasado mes de septiembre desde la página de TIOBE nos mostraron un informe con los lenguajes de programación mas populares.

El resultado que obtuvieron fue el siguiente:

toplanguageprogramming

Podemos observar que el lenguaje mas popular sigue siendo el lenguaje de programación C. Un lenguaje de programación estructurado y no orientado a objetos.

Una de los lenguajes que ha cogido mas protagonismo es el Objective-C. Este lenguaje de programación es el utilizado para el desarrollo de aplicaciones para Mac, Ipad e Iphone. Las altas ventas de IPhone e IPad han echo que este lenguaje halla ganado mas popularidad.

En el articulo completo nos sacan mas estadisticas sobre la evolución de la popularidad de algunos lenguajes y otros informes que nos indican la evolución y uso de los distintos tipos de lenguajes.

Spain JS – Conferencia de JavaScript

Durante los días 5 y 6 de julio se celebra en la Universidad Pontifica de Salamanca (Campus Madrid) el Summer JavaScript Conference.

Destacamos la presencia profesionales en el campo como:

Martín Naumann – Desarrollador Web del que podemos destacar su colaboración en el Google accounts package in v0.5.3

Peter Christensen – En el que su blog dispone de unos interesantes artículos para el como autoprepararnos para aprender nuevas tecnologías.

Y también van asistir Tomas y José Pérez y Jozsef Ferenc Peng.

Para mas información el programa y los horarios los tenéis disponibles en la página oficial de SpainJS

¿Que es JSON?

JSON (JavaScript Object Notation)es un formato ligero de intercambio de datos muy presente en javascript aunque podemos ver que este tipo de formatos se puede extender a lenguajes como C, C++, C#, Java, Perl yPython.

Su principal características es las simplicidad que tenemos para leer y escribir información por parte de los des arrolladores y por parte de nuestras máquinas.

JSON esta formado por:

  • Una vector/colección formado por pares de nombre/valor. En algunos lenguajes este tipo de vector/colección se le conoce como array asociativo, diccionario o tabla hash.
  • Una lista ordenada de valores.

Por ejemplo vamos a diseñar un sistema en javascript para automatizar los mensajes de error de un formulario a través de JSON. Para ello vamos a crear las siguiente variable JSON:

var infPersonal={"edad" : "35",    "ciudad" : "Madrid, ES",    "genero" : "hombre"}

En el caso de que que queramos acceder a esa información solo tendriamos que hacer lo de la siguiente forma:

alert(infPresonal.edad);

Si os fijáis el acceso exactamente igual que cuando accedemos a un atributo publico en C# o Java.

Como en otros lenguajes realmente infPersonal es un array donde dentro podemos incluir cualquier otro tipo de objeto. Este tipo de formato nos va ayudar mucho para definir, sobre todo en javascript, constantes o elementos que vamos a utilizar para hacer nuestras páginas web dinámicas como representación de gráficas.

 

 

Accessibility Toolbar

¿Necesitas ayuda?