Los Temas más visitados de HTML

Listado de los Temas más visitados durante los últimos 30 días
sin imagen de perfil

.zipComo programar un videojuego en Blazor Webassembly.


402 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 19 de Marzo del 2024 por Horacio Aldo (Publicado el 24 de Diciembre del 2023)
1.250 visualizaciones desde el 24 de Diciembre del 2023
Si quiere iniciar un el diseño de un apasiónate video juego (video game), puede utilizar este desarrollo conceptual que utiliza una bicicleta controlada por el usuario, dándole la capacidad de moverla en forma lateral a través de un camino.

sin imagen de perfil

.zipEnlace de una y dos vías entre componentes Blazor.


71 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 10 de Diciembre del 2023 por Horacio Aldo (Publicado el 16 de Octubre del 2023)
887 visualizaciones desde el 16 de Octubre del 2023
Desarrolla los tipos de enlace de una y dos vías entre componentes Blazor. Tema más conocido en idioma inglés como “one way vs two way data binding”.
EL video inicia directamente mostrando la diferencia de comportamiento entre los tipos de enlace para pasar luego al desarrollo del código C# en el que se vaso el ejemplo inicial antes mencionado.

sin imagen de perfil

.zipComo crear un listador genérico en Blazor Webassembly que detecte la inexistencia de ítems.


54 visualizaciones el último mes

C sharp

,

HTML

Publicado el 29 de Septiembre del 2023 por Horacio Aldo
741 visualizaciones desde el 29 de Septiembre del 2023
Desarrollamos la capacidad de detectar y mostrar un mensaje cunado no existen ítems en la colección. Pudiendo escoger entre dos posibilidades, una mostrar un mensaje genérico y la otra un mensaje personalizado a través de un parámetro del tipo RenderFragment en el cual el desarrollador defina el HTML que más se adecue. Por ejemplo, la imagen de un aula vacía para el caso en que no haya alumnos.

sin imagen de perfil

.zipComo mostrar cargando mientras procesa


53 visualizaciones el último mes

C sharp

,

HTML

,

JavaScript

Actualizado el 25 de Septiembre del 2023 por Horacio Aldo (Publicado el 16 de Septiembre del 2023)
656 visualizaciones desde el 16 de Septiembre del 2023
Los datos en la mayoría de los casos provienen de servicios web que no son instantáneos, por lo cual nuestro listador genérico debe comportarse mostrando una espera que indique al usuario el inicio y el fin de la carga. En este video mostraremos como desarrollar ese comportamiento.

sin imagen de perfil

.zipListador asincrónico Blazor.


49 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 24 de Septiembre del 2023 por Horacio Aldo (Publicado el 22 de Septiembre del 2023)
658 visualizaciones desde el 22 de Septiembre del 2023
Desarrolla la carga de las listas en forma asincrónica mostrando una imagen animada para indicar al usuario el tiempo que dura. Utiliza el método Task.WhenAll para lanzar las cagas en paralelo y el método StateHasChanged para avisar al componente que su estado ha cambiado y debe refrescar su interfaz de usuario.

sin imagen de perfil

.zipDesarrollo de un tablero de dibujo con Blazor


48 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 28 de Agosto del 2023 por Horacio Aldo (Publicado el 24 de Agosto del 2023)
1.723 visualizaciones desde el 24 de Agosto del 2023
Como desarrollar un tablero de dibujo de 16 x 16, reutilizando 256 veces un mismo componente Blazor Webassembly que hace las veces de un pixel. Exponiendo la necesidad del uso de parámetros y eventos como solución al problema real que se nos presenta.

sin imagen de perfil

.zipUso de ValidationMessageStore en Blazor


46 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 12 de Noviembre del 2023 por Horacio Aldo (Publicado el 5 de Noviembre del 2023)
745 visualizaciones desde el 5 de Noviembre del 2023
Como mostrar un mensaje de validación de apellido ya existente en la base de datos de la misma forma que se muestran las validaciones estándar en Blazor.
Para resolverlo utilizaremos ValidationMessageStore para presentar validaciones personalizadas (custom validation).

sin imagen de perfil

.zipComo listar cualquier cosa y avisar cuando es seleccionada utilizando Blazor.


45 visualizaciones el último mes

C sharp

,

HTML

,

JavaScript

Actualizado el 25 de Septiembre del 2023 por Horacio Aldo (Publicado el 14 de Septiembre del 2023)
587 visualizaciones desde el 14 de Septiembre del 2023
Explica como agregar eventos genéricos a un componente, también genérico, creado en videos anteriores. EL componente PUBLICA un evento al cual se SUSCRIBE el componente padre mediante un método de atención, para ser informado de las novedades que ocurren en el componente hijo y pueda actuar en consecuencia. Para el ejemplo la novedad será una selección sobre un ítem de la lista por parte del usuario, de ahí el nombre del evento creado, OnSelect.

sin imagen de perfil

.zipProgramación asíncrona en Blazor.


45 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 28 de Noviembre del 2023 por Horacio Aldo (Publicado el 22 de Noviembre del 2023)
586 visualizaciones desde el 22 de Noviembre del 2023
Las aplicaciones productivas, las no académicas, son en realidad asíncronas, dándole por ejemplo la posibilidad al usuario de continuar con su tarea sin necesidad de esperar a que otro proceso finalice. Concretamente para este video, el usuario puede seguir tipeando el nombre del color a buscar mientras la aplicación continua con la búsqueda simultáneamente.

sin imagen de perfil

.zipVarios botones de submit en Blazor EditForm


43 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 10 de Diciembre del 2023 por Horacio Aldo (Publicado el 27 de Octubre del 2023)
831 visualizaciones desde el 27 de Octubre del 2023
La propuesta clásica de los formularios Balzor se basan en un solo evento llamado OnValidSubmit y un único botón del tipo "submit" que invoca al único método de atención al evento antes mencionado. ¿Y se precisamos más botones un método de atención para cada botón?
Este video nos revela la respuesta a esa pregunta.


Basado en el siguiente artículo:
https://stackoverflow.com/questions/58231592/multiple-submit-buttons-in-blazor-editform
Imágen de perfil

internetCódigos CSS y HTML para editar tu página web en WordPress


35 visualizaciones el último mes

CSS

,

HTML

,

WordPress

Publicado el 13 de Febrero del 2019 por Administrador
1.605 visualizaciones desde el 13 de Febrero del 2019
Los gestores de contenido como WordPress permiten hacer casi todo muy fácil sin necesidad de saber código web, pero en ocasiones resulta interesante poder hacer cosas muy concretas con tu plantilla para ir un poco más allá en cuanto a la personalización del tema y conseguir un resultado aún mejor que el que a priori podrías lograr.
Imágen de perfil

internetCódigos CSS y HTML para editar tu página web en WordPress


32 visualizaciones el último mes

CSS

,

HTML

,

WordPress

Publicado el 5 de Noviembre del 2018 por Administrador
1.580 visualizaciones desde el 5 de Noviembre del 2018
Los gestores de contenido como WordPress permiten hacer casi todo muy fácil sin necesidad de saber código web, pero en ocasiones resulta interesante poder hacer cosas muy concretas con tu plantilla para ir un poco más allá en cuanto a la personalización del tema y conseguir un resultado aún mejor que el que a priori podrías lograr. ¡Te lo cuento en este post!

Si vas a tu web y das a botón derecho y a continuación Ver código fuente de la página, lo que verás es el código HTML y CSS con el que está construido tu sitio. Estos códigos los crea automáticamente tu CMS para que tu web pueda verse en internet. Si trabajas con un gestor de contenidos no tienes que implementarlos manualmente, pero conociéndolos un poco puedes hacer verdaderas maravillas.

Las plantillas premium suelen tener una amplia sección de opciones para modificar fácilmente casi todos los elementos de tu web, como colores, fondos, estilos de letra, etc. Pero, ¿y si hay elementos y zonas de la plantilla que no puedes modificar porque no vienen incluidos en las opciones?
Imágen de perfil

internetGenerar códigos QR con PHP y HTML


27 visualizaciones el último mes

PHP

,

HTML

,

Bootstrap

Publicado el 27 de Mayo del 2019 por Administrador
3.341 visualizaciones desde el 27 de Mayo del 2019
Los códigos QR también se les conoce como código de respuesta rápida, es un código de formato de código de barras 2D que se usa para almacenar texto como números de teléfono, correos electrónicos, direcciones y texto simple, etc. En este tutorial te mostraremos cómo generar códigos QR con PHP y HTML.

Screenshot_20190527_215953
Imágen de perfil

internetCrear un menu desplegable básico con HTML, CSS y jQuery


24 visualizaciones el último mes

HTML

,

CSS

,

JQuery

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 17 de Diciembre del 2020 por Administrador
1.804 visualizaciones desde el 17 de Diciembre del 2020
Algo que es muy útil y recurrente dentro de mis proyectos es el menú desplegable, este elemento le da un toque moderno a nuestras webs, además de ahorrar espacio sobre todo cuando se trata de diseños para dispositivos móviles. Hacemos clic sobre un botón y que despliega el contenido que queremos ver en lugar de llenar la página de texto y tener que hacer scroll hasta encontrar lo que se busca. Por lo que también estamos aportando usabilidad a nuestra página web.

Este artículo muestra como crear un menú, pero podría ser simplemente un botón que despliega un contenido como las características de un producto por ejemplo y la acción podría dispararse al pasar el ratón por encima.

Screenshot_20201217_213117
sin imagen de perfil

.zipEl espíritu de Blazor WebAssembly


21 visualizaciones el último mes

C sharp

,

HTML

Actualizado el 1 de Agosto del 2023 por Horacio Aldo (Publicado el 24 de Julio del 2023)
773 visualizaciones desde el 24 de Julio del 2023
Describe de manera básica el proceso de composición del todo a las partes, partiendo de un ejemplo real, una tabla, pasando a la abstracción mediante un modelo de clases relacionadas por una composición, para llegar por ultimo al código. Realizando una aplicación web utilizando Blazor Webassembly y lenguaje c#.

Imágen de perfil

internetComprobar disponibilidad de nombre de usuario en vivo


20 visualizaciones el último mes

PHP

,

AJAX

,

JQuery

,

HTML

,

MySQL

Publicado el 9 de Abril del 2020 por Administrador
1.947 visualizaciones desde el 9 de Abril del 2020
Cuando queremos hacer un formulario de registro de usuarios o de elementos que deseamos que su nombre sea único y que no puede estar duplicado en la base de datos, podemos usar en nuestros campos de texto del formulario una validación para comprobar la disponibilidad o existencia del nombre en vivo.

Esto también se puede aplicar para la validación de emails únicos. También se podría comprobar en el momento si un email ya existe en la base de datos o cualquier dato que se te ocurra.

En el ejemplo que se ilustra asociado a esta entrada, vamos a ver un formulario donde el usuario puede indicar su nombre o nickname para registrarse o iniciar sesión en una página Web. Vamos a comprobar la disponibilidad del nombre de usuario en vivo utilizando la tecnología Ajax para enviar la petición al servidor sin necesidad de recargar la página.

Esto lo vamos a conseguir utilizando las siguientes tecnologías: HTML, jQuery, AJAX, PHP y MySQLi.

Screenshot_20200409_190036
Imágen de perfil

internetValidar campos de un formulario en HTML5, JS, jQuery o PHP


19 visualizaciones el último mes

HTML

,

JavaScript

,

JQuery

,

PHP

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 17 de Septiembre del 2020 por Administrador
2.642 visualizaciones desde el 17 de Septiembre del 2020
El principal objetivo es garantizar que los datos enviados a través de un formulario sean completos, precisos, seguros y consistentes. Esto se logra a través de controles de validación de datos y reglas que se comprueba al validar el formulario.

Índice de Contenidos:
1.- ¿Para qué sirve validar campos de un formulario?
2.- Ejemplo práctico
2.1.- Principales restricciones
2.2.- Formulario de origen
3.- Validar campos en HTML5
4.- Validar campos en JavaScript
4.1.- Funciones utilizadas
5.- Validar campos en jQuery
6.- Validar campos en PHP
7.- Consejos

Screenshot_20200917_164039
Imágen de perfil

internetComo hacer un formulario estilo Material Design con HTML, CSS y Javascript


17 visualizaciones el último mes

HTML

,

CSS

,

JavaScript

Publicado el 2 de Febrero del 2020 por Administrador
2.512 visualizaciones desde el 2 de Febrero del 2020
Aprenderás como hacer un formulario con el famoso estilo de google conocido como Material Design.

Puedes utilizar este diseño de formulario para cualquier cosa, ya sea un formulario para registrar usuarios o un formulario de contacto, ademas este formulario es adaptable a dispositivos móviles por lo que es una buena alternativa a los formularios tradicionales y aburridos.

Screenshot_20200202_202925
Imágen de perfil

internetCómo detectar los datos de giro y aceleración de un móvil desde una página Web con HTML5/JavaScript


14 visualizaciones el último mes

HTML

Publicado el 23 de Mayo del 2018 por Administrador
1.384 visualizaciones desde el 23 de Mayo del 2018
El giroscopio o giróscopo es un elemento hardware que permite detectar la inclinación y rotación de un teléfono móvil. Con un giroscopio no solo podemos detectar si el móvil está en posición horizontal o vertical sino también la inclinación sobre cualquiera de sus ejes.
Imágen de perfil

internetIntroducción y primeros pasos con Pug


13 visualizaciones el último mes

HTML

Publicado el 8 de Febrero del 2017 por Administrador
4.537 visualizaciones desde el 8 de Febrero del 2017
Pug (anteriormente conocido como Jade) es un motor de plantilla de Node.js. con el que seremos capaces de escribir código HTML de una sintaxis mucho más sencilla, clara y directa, tanto a la hora de escribir como de leer y modificar.
Imágen de perfil

internet¿Cómo crear un componente web? Elementos HTML personalizados


13 visualizaciones el último mes

JavaScript

,

HTML

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 26 de Mayo del 2020 por Administrador
1.525 visualizaciones desde el 26 de Mayo del 2020
En este artículo vamos a utilizar el API de Custom elements (Elementos HTML personalizados) para crear nuevas etiquetas y utilizarlas en nuestro código HTML, en futuras publicaciones explicaremos como se usan en conjunto con los otros 3 estándares.

Screenshot_20200526_162222