febrero 2018

Eliminar referencias de objetos en Javascript

Introducción

Este post será muy muy sencillo pero espero que a alguien más le sirva. Sucede que estoy trabajando con un proyecto utilizando VueJS, y por alguna razón tenía que “copiar” un objeto.

Es decir, necesitaba crear una nueva copia de un objeto, sin mantener las referencias del original. Si no sabes a lo que me refiero, pásate por este post.

Después de buscar, encontré algo de ES6 que permite hacer casi lo mismo. Extrañaba esta función, que en AngularJS se llama angular.copy.

Object.assign

Para eliminar todas las referencias y crear una copia “limpia” únicamente con los valores, podemos asignar a un objeto vacío el objeto origen. Es simple como se ve a continuación:

Si no queda claro, observemos este GIF.

Sin crear un nuevo objeto

Creando un nuevo objeto, cuyos cambios no afectan a otro

La desventaja de esto si es que se le puede llamar así, es que es una nueva función introducida por ES6 y por lo tanto no todos los navegadores lo soportan.

Cargar nuestras propias clases con Composer

Introducción

Al principio, no queremos utilizar Composer porque creemos que es muy complicado de utilizar. Hoy explicaré 2 cosas: cómo cargar nuestras clases y por qué es bueno utilizar Composer

¿Por qué es bueno?

Composer es un gestor de dependencias como lo es NPM. Ambos trabajan igual: leen un fichero, instalan y actualizan las dependencias. Fácil y sencillo. Por otro lado, Composer se encarga de cargar todas las clases necesarias.

Por ejemplo, si tenemos muchas librerías sería un lío hacer un include o require por cada una de éstas. ¿No sería mejor que alguien las cargara todas por nosotros? eso es justamente lo que hace el autoload de Composer.

Hasta aquí todo bien, todos lo entendemos. Lo que se me hace un poco complicado es cómo cargar nuestras propias clases. Es decir, está muy bien eso de que se carguen las clases que otros desarrolladores hicieron, ¿pero cómo añado la lógica de mi aplicación? eso se responde en el siguiente apartado

¿Cómo cargar nuestro propio código?

Esto es muy fácil, simplemente tenemos que indicarle a Composer en dónde reside nuestro código que queremos que se autocargue. Tenemos que modificar el archivo composer.json. Dicho fichero se verá más o menos así:

En este caso es de un proyecto que estoy haciendo, pero dejemos eso a un lado. Independientemente de lo que tengamos, vamos a añadir lo siguiente:

Para que finalmente, el archivo (al menos en mi caso) luzca así:

Como se puede observar, el namespace en mi caso es Biblioteca. Es necesario añadir las dos diagonales \\.

Y en carpeta he puesto “app/” porque así se llama el folder en donde tengo todo mi código. Se ve así:

De esta forma, el archivo composer.json buscará todo lo que haya dentro de la carpeta app. Y dentro de la carpeta tengo otras dos carpetas. El código de un controlador, por ejemplo, luce así:

Lo copié de esta manera porque quiero que se note que podemos utilizar nuestras otras clases (por ejemplo, tengo una clase llamada DatabaseService) simplemente utilizando use namespace\clase.

Por otro lado, estoy utilizando PDO. Si necesitamos utilizar una clase que ya viene incluida por defecto en PHP tenemos que indicarlo; si no, avisará que no encuentra la clase en nuestro namespace.

Finalmente dejo aquí el código de ejemplo de cómo se ve DatabaseService.

Recargar autoload

Después de modificar el archivo composer.json debemos generar el autoload de nuevo. Para ello ve a la ubicación en donde esté el archivo a través de la terminal y ejecuta:

composer install

Conclusión

Si seguimos todo esto, podremos estructurar nuestro código de una manera eficaz, y será cargado / incluido automáticamente. Más tarde podemos agregar más archivos a la carpeta que indicamos y todo se seguirá cargando siempre y cuando respetemos los namespaces.

En los ejemplos el namespace es “Biblioteca” pero puede ser el que se te ocurra, aunque debería llamarse de alguna forma referente a tu proyecto.

Mi implementación del juego de la serpiente en Javascript

Snake game en JS

En mi infancia me gustaba jugar al juego de Snake en un nokia. No pensé que algún día en el futuro podría hacer una “copia” del mismo. Claro que no es una réplica exacta y faltan muchas cosas, pero al menos funciona.

Así que igual y a otra persona le sirve. Está escrito en javascript puro, utiliza imágenes para los sprites; por lo que puedes personalizarlos. Se adapta a la pantalla completa y se juega con las flechas del teclado.

Juego

 

See the Pen Juego de la serpiente by Luis Cabrera Benito (@parzibyte) on CodePen.

Por cierto, no es la misma experiencia el jugarlo insertado que jugarlo en una página separada. Aquí puedes abrirlo en una nueva pestaña.

Simplemente toca o haz click y comenzarás a jugar. Espero poder darle seguimiento cuando tenga tiempo. Ponerle un puntaje, sonidos, eliminar el bug que hace que avance uno más incluso cuando perdiste, detectar colisiones con la misma serpiente, agregar obstáculos y niveles, etcétera.

Finalmente aquí dejo el código en GitHub por si sirve de algo.

Actualización

Ya existe la versión 2 de este juego, en donde se solucionan errores y otras cosas. El resultado es este.

Más ejercicios resueltos de MySQL: Combinando funciones

Introducción

Esta es la tercera parte de unos posts que vengo escribiendo sobre ejercicios propuestos de MySQL. Ahora veremos cómo combinar algunas funciones que vimos en los otros tutoriales. Son pocos, pero al principio son difíciles.

Ejercicios con solución

Tabla

Recordemos que vamos a estar utilizando esta tabla para todos los ejercicios:

Nota: no es la misma tabla que antes, ya que a ésta la hemos modificado de tal manera que a algunos usuarios se les asignó un segundo nombre, mismo que será de utilidad para los ejercicios.

Una vez dicho eso, vamos allá.

Listar el primer nombre de todos los usuarios

Seleccionar el primer nombre de los usuarios. En caso de que tengan sólo un nombre lo seleccionamos. En caso de que tengan dos, seleccionamos el primero. Casos de uso:

JOSE RAÚL => JOSE

OSCAR => OSCAR

Solución

Utilizamos INSTR, que devuelve la posición que tiene una subcadena dentro de una cadena. Recordemos que si dicha subcadena no se encuentra, el resultado al llamar la función es 0. Sabiendo esto, utilizamos IF para ver si la posición es 0.

Si la posición es 0, significa que no había espacios; es decir, que la persona sólo tiene un nombre. En caso de que no sea 0, cortamos la cadena con LEFT.

Listar el segundo nombre de los usuarios, y listar el primero en caso de que no lo tengan

Ahora hagamos lo contrario si así se le puede llamar. Listar el segundo nombre del usuario en caso de que éste tenga, y si no, pues listamos sólo el primero. Los casos de uso:

JOSE RAÚL => RAÚL

OSCAR => OSCAR

PD: ya sé que JOSÉ lleva acento pero así estaba en la base de datos y me dio pereza arreglarlo; además, no afecta.

Rápidamente nuestra mente nos traicionará y dirá: cambia sólo LEFT por RIGHT en la consulta anterior, y listo.

Pero no, no es así. Esto requiere un poco más de concentración. Si sólo cortamos con RIGHT desde donde está el espacio, cortará la cadena “invertida” y nos dará un nombre como “E RAÚL” (suponiendo que es JOSE RAÚL).

Recordemos que LEFT funcionó porque comienza a contar caracteres al igual que INSTR. Es decir, ambos cuentan desde la izquierda. Así que si usamos el mismo índice para ambos todo irá bien. En cambio, RIGHT comienza a contar desde la derecha.

La solución es simple, utilizamos RIGHT pero lo combinamos con CHAR_LENGTH para que reste la posición del índice.

Queda así:

Otra solución

La solución que utiliza RIGHT con CHAR_LENGTH fue la que se me ocurrió a mí, pero siempre hay muchas formas de hacer las cosas. Un amigo lo hizo con MID y a mi parecer quedó más elegante. Aquí dejo la consulta:

Listar los nombres de los usuarios que comiencen con una letra vocal

Para esto utilizamos LIKE y el comodín %, dicho comodín quiere decir “cualquier cosa” así que con que comiencen con A, E, I, O, U y terminen con lo que sea estarán bien.

Listar los nombres de los usuarios que finalicen con una letra vocal

Utilizamos de nuevo el comodín % pero ahora al revés, de manera que al principio tengan cualquier cosa pero que siempre terminen con alguna vocal.

Listar los nombres de los usuarios que tengan la letra A u O intermedias

Ahora utilizamos el comodín pero 2 veces, así: %%. De esta forma indicamos que pueden tener lo que sea a la izquierda así como a la derecha, mientras tengan la letra mencionada en alguna parte del centro.

Listar los nombres de los usuarios que no utilicen correo electrónico de Microsoft (Outlook, Hotmail, live)

Para terminar, usamos un NOT combinado con LIKE.  Los utilizamos 3 veces para descartar opciones de outlook, hotmail  y live.

Conclusión

Con esos ejercicios terminamos hoy.

Aquí hay más:

Ejercicios resueltos de consultas con MySQL

Ejercicios resueltos con MySQL: Funciones de cadena, UPDATE y DELETE

Introducción a pouchdb: app de agenda

Introducción

PouchDB es una base de datos que se sincroniza. Permite trabajar offline y online, con una sincronización de la cual no tenemos que encargarnos nosotros. Esto viene perfecto para desarrollar sistemas que trabajan tanto con y sin internet.

Es importante notar que si no queremos la sincronización, no pasa nada. Por lo que no estamos obligados a sincronizar ningún sólo dato.

Además, la base de datos se sincroniza entre todos los dispositivos. Esto es algo muy genial, aunque claro, tampoco es tan poderosa como MySQL, MS SQL Server, etcétera.

Finalmente cabe mencionar que todo se guarda en el navegador del usuario, evitando así tener que programar el lado del servidor.

En este tutorial vamos a estar trabajando para crear una agenda, de esas en donde guardas el teléfono, dirección y nombre de tus conocidos.

Ejemplo práctico: app de agenda

Probar app terminada

Si quieres ver lo que lograremos con este post, aquí dejo un plunker con la aplicación terminada.

También puedes descargarla con el enlace que dejo abajo, y abrirla el archivo index.html en tu navegador favorito.

PouchDB_CRUD_agenda

Finalmente aquí dejo un GIF de cómo se ve al usarla:

Preparando scripts

Simplemente tenemos que incluir la librería de PouchDB en nuestro archivo html y listo. En este caso no utilizaremos ningún framework. Así que para descargar la última versión (independientemente de cuándo se consulte este tutorial) podemos ir a https://pouchdb.com/download.html y copiar el quick start.

En mi caso, incluiré el archivo http://cdn.jsdelivr.net/npm/pouchdb@6.4.1/dist/pouchdb.min.js

Una vez incluido el archivo, vamos a ver si PouchDB está definido para comenzar a trabajar. Así que ejecutaremos este código:

Si al abrirlo nos dice “Correcto” entonces todo está bien. Si no, por favor revisa que hayas incluido bien el script y que tengas una conexión a internet, o el archivo descargado.

Vamos a ver todas las operaciones como lo son crear, leer, actualizar y eliminar datos. Además de ver cómo los índices y los prefijos nos van a ayudar.

Lo que no veremos será la sincronización y los selectores (si vienes de una base de datos relacional, los selectores son el equivalente a la cláusula WHERE) ya que se alargaría mucho este post.

Instanciar base de datos

En PouchDB sólo tenemos una base de datos que alberga documentos. No existen las tablas. Así que todo se guarda en un mismo lugar.

Una vez dicho esto, para usar PouchDB simplemente tenemos que llamar al constructor con el nombre de la base de datos deseada. Si no existe, se creará y se devolverá la instancia en donde ya podremos guardar.

Insertar, create o agregar

La primera operación que tenemos que hacer para poder hacer todas las demás, porque si no existen datos, ¿qué cosas se eliminan o actualizan?

Vamos a comenzar creando el formulario por donde entrarán los datos. No pondré estilos, pues creo que hacen que el lector se confunda. Así que vamos a enfocarnos únicamente en el funcionamiento de la app.


Podemos ejecutar lo que llevamos hasta el momento, y se debe ver así:

Listar, o mostrar

Ya insertamos datos, pero para editar o eliminar hay que primero poder verlos para interactuar con ellos. Así como fue fácil insertar, será fácil recuperar los documentos.

Dejaré el código y lo explicamos abajo.

Comencemos viendo que al script le agregamos una nueva variable, la cual es el elemento que apunta al cuerpo de la tabla.

Creamos una función que obtiene los documentos de la base de datos, que más o menos funciona como lo dice la documentación oficial.

Recorremos las filas y a una variable le vamos añadiendo código HTML para la tabla. Una vez que el ciclo termina asignamos todo ese HTML al elemento declarado previamente. Y así de fácil es.

Finalmente cabe mencionar que añadimos la hoja de estilos para los bordes de las tabla, pero podemos no incluirlos si no queremos.

Veamos ahora cómo editar.

Editar

Una vez que ya hemos creado nuestros datos es hora de poder editarlos. Dejaré la operación de eliminación para más tarde, ya que, según yo, es la más fácil.

Por ahora hay que agregar un botón a la tabla para escucharlo más tarde y consultar el contacto.

Una vez que hayamos consultado el contacto, tenemos que llenar automáticamente los campos de texto. Es decir, vamos a reutilizarlos.

Y para guardar cambios al editar crearemos otro botón que está oculto y que se muestra sólo cuando hacemos click en editar en un campo de la tabla de contactos.

Analicemos las nuevas cosas del código. Para editar un documento usamos el método put de PouchDB. Pero para ello necesitamos el id y la revisión de dicho documento, los cuales almacenamos en una variable temporal global.

También estamos ocultando y mostrando botones, así como leyendo datos con los atributos data-*. Sigamos para ver ahora el último paso: eliminar.

Eliminar

Finalmente añadiremos el botón de eliminar. El proceso es el mismo que para editar, sólo que ahora la clase de los botones será btn-eliminar en lugar de btn-editar. De ahí simplemente obtenemos el contacto usando el id recuperado de los atributos data.

Mandamos una confirmación y en caso de que se acepte, se elimina completamente. Después refrescamos la tabla y limpiamos el formulario.

El código final queda así:

Java: cuestionario de preguntas y respuestas con incisos por consola

Introducción

Ayer mi ayuda fue solicitada para resolver un ejercicio de Java que más o menos decía así:

Realizar un programa en Java en donde se pueda simular un examen de múltiples respuestas, en donde el usuario elija la respuesta y se indique si ésta fue correcta o no.

Todo se tiene que hacer por consola, incluyendo la entrada de datos.

Solución al ejercicio

Así que me puse a pensar y al final, según yo, la mejor solución (aunque no me gustó tanto) era crear dos clases. Una de preguntas y otra de respuestas.

Luego, a cada pregunta asignarle un array de respuestas. Para saber si la respuesta era o no correcta, al objeto Respuesta se le pasaba un booleano que indicaba si ésa era la correcta. Pero bueno, bien dicen por ahí que hablar es de mal gusto, así que aquí dejo el código:

Ya sé, ya sé que cuál lleva un acento. Y que las preguntas inician con ¿, pero en mi consola no se ven bien, así que las omití.

Como se puede ver, es un código más o menos expresivo y agradable a la vista del ser humano. Podemos crear un arreglo de preguntas, y por cada una agregar un arreglo de respuestas. Por otro lado, no estamos limitados a las opciones que ponemos.

Es decir, en algunos casos podemos poner sólo los incisos a y b, en otros hasta el c, en otros incluso hasta el z; todo es como queramos.

Finalmente quiero que se note al método preguntar, que como su nombre lo dice, pregunta, lista las opciones e indica si la respuesta fue acertada.

Compilando y ejecutando

Para que se vea que esto realmente funciona hice otro cuestionario a mi gusto y con mis respuestas (es decir, puede que la información no sea verídica).

Proceso de compilación…

Proceso de ejecución

Nota: el GIF va muy rápido, pero los datos realmente son leídos por teclado; es decir, el usuario escribe la letra.

Código

Aquí dejo el código por si quieres probarlo por ti mismo:

Conclusión

Esta es la solución que propongo; seguramente hay más y mejores. Analizando las mejoras que se pueden hacer se me ocurre poner un contador de aciertos y errores.

También se podría calcular el tiempo que se llevó al tomar el examen. Todo queda a nuestra imaginación.

MySQL y PHP con PDO: CRUD (create, read, update, delete)

Introducción

Aunque ya hay millones de tutoriales sobre esto, me decidí a hacer el mío pero en una forma muy muy simple. Antes de comenzar, debes tener un conocimiento básico en MySQL. Si no tienes instalado esto, pásate por este post para instalar XAMPP.

Cabe mencionar que aquí no veremos buenas prácticas de bases de datos, relaciones, etcétera. Nos dedicaremos a usar las tablas que aparecen, sin fijarnos en la normalización, o cosas de ese estilo.

Nota: este tutorial utiliza PDO, pero recuerda que igualmente podemos usar las funciones mysqli. Personalmente recomiendo PDO, pues es orientado a objetos. Sin embargo, espero escribir un tutorial sobre mysqli en el futuro.

Si te interesa saber cómo hacer un CRUD con SQLite3, PDO y PHP haz click aquí

Actualización 2019

Ya se encuentra disponible la parte 2 de este tutorial en donde vemos cómo saber si un elemento existe en la tabla y recorremos los datos con un cursor. Míralo aquí.

También he puesto el código en GitHub.

Actualización marzo

De nuevo he añadido otro tutorial para saber cómo realizar búsquedas, míralo aquí.

Estructura de la tabla

Como lo dije, esto será simple. Utilizaremos una tabla de personas, en donde guardamos el id, el nombre, apellidos y género. Queda así:

Con esto vamos a comenzar a trabajar.

Conexión

Para interactuar con la base de datos necesitamos conectarnos a la misma. Para ello, usamos un archivo y  después simplemente lo incluimos en donde queramos usarlo. Voy a poner el código aquí, y lo explicaré más abajo.

Como podemos ver, el código es demasiado simple. Simplemente creamos un objeto PDO y le pasamos 3 parámetros:

  1. Nombre del origen de datos
  2. El usuario
  3. La contraseña

PDO permite cambiar de gestor de base de dato en una sola línea, sólo tendríamos que cambiar el primer parámetro. Aquí dejo la lista de gestores de bases de datos soportadas. Por otro lado, aquí dejo la documentación oficial de la clase.

Lo ponemos en un try/catch porque en algunas ocasiones puede que nos equivoquemos de usuario, contraseña, base de datos, etcétera.

Nota: recuerda que la base de datos debe existir, así como la tabla “personas”. Puedes cambiar el usuario, la contraseña o el nombre de la base de datos como tú desees.

Formulario para crear datos

Comencemos insertando datos. Para ello, necesitamos un simple formulario en HTML. Dejaré esta vez sin explicar el código HTML, si deseas estudiarlos más a fondo aquí te dejo un link.

Lo único que quiero que se note es el atributo action, en donde ponemos el nombre del archivo php que recibirá los datos.

Ese archivo debe estar en la misma carpeta que el formulario. Si cambiamos nuevaPersona.php de ubicación o nombre, basta con cambiarlo en el formulario para que las cosas sigan funcionando.

Por ejemplo, si muevo el archivo nuevaPersona a la carpeta “foo” (que está en donde está el formulario), tengo que cambiar el action, así:

action=”foo/nuevaPersona.php”

Si lo cambio a una carpeta que está arriba, puedo ponerlo así:

action=”../carpeta/nuevaPersona.php”

Y puedo tener miles de carpetas:

action=”una/carpeta/otra/otra/otroNombre.php”

Recibiendo datos del formulario

Antes de recibirlos, por favor observa el atributo “name” de cada input. Ese nombre será el que usaremos para acceder a los datos, distinguiendo mayúsculas y minúsculas. Veamos ahora el archivo nuevaPersona.php, que será en donde recibiremos los datos introducidos en el formulario.

Si todo va bien, al visitar el formulario y enviarlo se mostrará un “Insertado correctamente”.

Listar datos – Tabla estática

Una vez que ya insertamos, vamos a mostrar a las personas. Para ello, usaremos una tabla. Antes de confundir al lector con la creación de la tabla, veamos una de ellas en su forma estática. Así luce el código: (obviamente es escrito a mano)

Si observas bien, puedes ver que la estructura se conserva y sólo cambia en tr. Es decir, se repite la parte del código en donde dice <tr><td>…

La tabla, al mostrarla, se ve así:

Pero eso lo puede hacer cualquiera, y además, ¿qué beneficio trae, si tenemos que hacerla a mano? mejor deberíamos hacer que PHP la genere por nosotros, o bueno, darle sólo una pequeña ayuda. Veamos entonces cómo podemos hacer eso.

Listar datos – Tabla dinámica

Ahora sí vamos a ver cómo listar datos traídos de MySQL. Para ello vamos a utilizar código PHP. El archivo que lista los datos, al menos en su primer versión, se ve así:

Nota: El parámetro que pasamos a fetchAll es una constante estática pública de la clase PDO, (PDO::FETCH_OBJ) y permite acceder a las filas de la tabla como si fuera un objeto nativo de PHP. Es decir, podemos acceder al nombre de la persona usando $persona->nombre en lugar de (es la opción que está por defecto) $persona[1]. Hay más constantes, pero las veremos en otro post.

Recordemos que el código, entre más expresivo, mejor.

Bueno, con todo esto tendremos un arreglo que se ve así al visitar la página:

Esto es porque sólo he registrado a una persona. Registraré a otras:

Pero sigue sin verse bonito, aquí es en donde combinamos HTML y PHP para convertir ese arreglo en una tabla bonita, o al menos más bonita que ese arreglo no entendible. El código queda así:

Por cierto, no es un error dejar sin punto y coma el echo. Pero recordemos que si estamos en donde las etiquetas se cierran (?>) no es necesario poner punto y coma. Ojo: sólo en la última expresión, no en todas.

Al visitar la página ahora sí da gusto:

Agregando enlaces

Para eliminar o actualizar vamos a necesitar el id de la persona. Si no, ¿a qué persona eliminaremos o editaremos?.

Gracias al poder de la combinación de HTML podemos crear un link que dirija a cierto archivo, pasándole el id. Y luego leer ese id.

Por el momento sólo hay que crear los enlaces, no hace falta explicar el funcionamiento. Así que la versión 3 de la tabla queda así:

Y la tabla se ve así:

Si acercas el cursor en donde dice “Eliminar” verás que te va a dirigir a un enlace como “eliminar.php?id=1”. Pero ese id va cambiando en cada fila. Si le das click te dirá que no se ha encontrado el archivo, pues tenemos que crearlos a ambos: editar.php y eliminar.php.

Eso lo veremos más abajo.

Actualizando o editando

De todas las operaciones, esta es la que menos me gusta, ya que en primer lugar debemos saber el id, luego tenemos que recuperar los datos para mostrarle al usuario lo que ya existe. Finalmente realizar la consulta UPDATE en la base de datos.

Pero bueno, este paso es necesario. Así que vamos allá.

¿recuerdas que mandamos un id dentro del link en la tabla? ahora vamos a recuperarlo. Crearemos el archivo editar.php y pondremos esto dentro de él:

Si te fijas bien, ahora estamos recibiendo el id por medio del arreglo superglobal $_GET. Y accedemos a él a través de su posición como cadena, así:

$_GET[“id”]

¡Justo como leíamos a $_POST! Luego, hacemos una búsqueda en donde el id sea igual al proporcionado. Si no existe nada con ese id (porque un usuario puede cambiar ese id a 4654654, cosa que en teoría no existe) entonces lo advertimos.

Veamos ahora el formulario, HTML provee una forma de dar valores por defecto a los campos utilizando el atributo “value” así que llenamos estos valores con los datos que obtuvimos, en caso de que existan.

También agregamos un input de tipo oculto, ahí guardaremos el ID para que el usuario, en teoría, no pueda cambiarlo.

Y finalmente observa el action, ahora no irá a nuevaPersona.php sino a guardarDatosEditados.php. Éste último archivo vamos a programarlo ahora mismo. Por cierto, editar se ve así:

(justo como el de agregar nueva persona, pero con los campos llenos por defecto)

Recibiendo datos para editar

Este será casi igual al de nuevaPersona.php salvo que ahora también necesitamos el id, y será un UPDATE en lugar de un INSERT. Veamos el código y luego lo explicamos:

Podemos ver que usamos el ID para hacer un Where dentro de la consulta. Y actualizamos todos los valores. De todos modos, no hay problema, pues si el usuario no toca el valor se quedará tal y como estaba.

Eliminando

Pequeña gran nota: repito que esto es un post más que nada educativo. Nunca pero nunca debemos hacer que se elimine usando un link, y mucho menos sin confirmación. ¿te imaginas que Facebook tuviera esa opción para, por ejemplo, eliminar mensajes con alguna persona? supongamos que el link fuera algo como eliminar_mensajes.php?idPersona=111

Ahora yo te digo que visites ese link, pero antes lo pongo en un acortador para que no haya sospechas. Una vez que hagas click en él, adiós a esa conversación. Obviamente no perdemos nada con eliminar una conversación (al menos que incrimine a alguien, tenga valor sentimental, etcétera) pero basta con esto para darnos una idea.

En este ejemplo eliminamos con el valor pasado por un link y no hay vuelta atrás, pero igual no perdemos nada. Para casos reales, es mejor hacerlo usando POST, pues ahí los datos no se ven en la URL. Además, podemos mandar una confirmación, comprobar si el usuario tiene permisos, etcétera.

Pero eso es otra historia, veamos ahora sí el último pilar para armar este crud. Por cierto, podríamos poner un confirm con javascript, o algo así, pero sería mezclar código y confundir al lector.

La operación que más me gusta es eliminar, pues sólo necesitamos el ID. Espero que el código se explique por sí mismo, porque si no, ni yo mismo podría hacerlo.

Probando y descargando

Sería un pecado explicar todo esto y no dejar los archivos para que los pruebes por ti mismo. Aquí dejo el proyecto completo, sólo pégalo y extráelo en la carpeta pública de tu servidor Apache (htdocs o public_html).

mysql_pdo_php_crud

También puedes probarlo en línea.

Conclusión

Podemos agregar unos links de navegación para ir, por ejemplo, de editar a listar todos, etcétera. Pero eso lo dejo para que el usuario lo haga. También sería bueno agregar un poco de estilos CSS. O incluso crear un servicio web con PHP y consumirlo desde cualquier lugar, o hacerlo con Javascript utilizando AJAX.

Pero todo eso es arena de otro costal que se llevaría decenas de posts, así que dejemos eso por el momento.

Finalmente, si quieres un ejemplo un poco más avanzado, te invito a leer Pequeño, muy pequeño sistema de ventas con PHP

Ejemplo de Java Remote Method Invocation | RMI

Introducción

Ya vimos en un ejercicio anterior cómo conectar un socket cliente y uno servidor para mandar mensajes.

Enviar mensajes no tiene gran utilidad, ¿no sería mejor poder llamar a algunas funciones en el servidor? esto es justamente lo que hace RMI en Java. Declaramos el servidor, el cliente, y la interfaz que servirá como “pegamento” entre estos dos y que se encargará del paso de parámetros.

Después, desde el cliente llamamos a las funciones declaradas anteriormente.

De esta manera, todos los métodos se ejecutarán en el servidor. En este caso haremos una calculadora, para no hacer el post muy largo, pero podemos hacer miles de cosas; se me ocurre, por ejemplo, conectar a una base de datos.

En fin, vamos allá.

Ejemplo de RMI

Interfaz remota

Comencemos con la interfaz remota, como lo dije hace un momento esta servirá como pegamento. Veamos una cosa interesante, como se puede ver dice “public interface” en lugar de “public class“.

Esto es porque, aunque suene redundante, es una interfaz y recordemos que éstas sólo sirven para ser sobrescritas más tarde. ¿Y en dónde las sobrescribiremos? en el código del servidor.

En este caso, como haremos una calculadora sólo declaramos la firma de 4 métodos: sumar, restar, multiplicar, y dividir.

Todos reciben dos parámetros flotantes, y todos devuelven un dato del mismo tipo.

Además, indicamos que el método puede lanzar una excepción de tipo RemoteException.

Servidor

Ahora veamos el servidor. Este se encarga de exportar el objeto, sobrescribir funciones de la interfaz y escuchar peticiones del cliente.

Como observamos, ya hemos sobrescrito los métodos con el cuerpo real de la función. La anotación @Override no es necesaria, pero es una buena práctica indicar que estamos sobrescribiendo una función.

Finalmente escuchamos en localhost (cosa que no podemos cambiar) en el puerto definido en la constante PUERTO.

Cliente

Para terminar con el código veamos ahora el cliente:

En el cliente imprimimos un menú, y dejamos que el usuario elija. Los try/catch son por si existe algún número mal formado, o por si dejan la cadena vacía, etcétera.

Como vemos, podemos llamar a los métodos remotos como si se trataran de métodos locales, simplemente usando a la interfaz.

Ejecución

El código no sirve para nada si no lo compilamos y probamos. Recuerda que puedes compilarlo desde un IDE, o desde la terminal como los macho alfa.

En fin, compilemos los 3 archivos…

Ahora ejecutaré el servidor en una terminal:

Y el cliente en otra:

Nota: no sé por qué los acentos no se muestran correctamente, pero igual y no es una cosa que afecte al programa, sólo es molesto a la vista. Si lo deseas, simplemente cambia la ú por u. O ejecuta el programa desde un IDE.

Conclusión

La ventaja de esto es que todo el proceso se hace en el servidor, y si tenemos uno muy robusto pues qué mejor que dejar que él haga todas las operaciones que se llevarían más tiempo si las hiciéramos en una computadora normal.

Recuerda que en este ejemplo, la ip es la de mi pc. Si vas a conectar a otra computadora en una red, simplemente escribe su ip.

Lo mismo aplica para el puerto, si quieres escuchar en otro número recuerda cambiarlo tanto en el cliente como en el servidor.

Creo que poco a poco Java me va cayendo mejor.

Ejercicios resueltos con MySQL: Funciones de cadena, UPDATE y DELETE

Introducción

He publicado hace algunos días algunos ejercicios de consultas en MySQL; puedes verlo aquí. En aquel entonces sólo fueron consultas simples, en este caso veremos cómo editar/actualizar y eliminar, así como el procedimiento para vaciar una tabla.

También trabajaremos con algunas funciones de cadena.

Estructura y datos de la tabla

Para trabajar y realizar nuestros ejercicios utilizaremos la tabla y los datos que ya he dejado en el post anterior, pero la vuelvo a poner a continuación:

Una vez que tengamos todo listo, vamos allá.

Funciones de cadena

Las funciones de cadenas son utilizadas para trabajar con strings, son útiles pero personalmente recomiendo usarlas sólo en casos en donde estemos forzados a hacerlo. No usarlas trae algunas ventajas:

  • Hacemos que la base de datos sea menos dependiente: si después necesitamos mover nuestras consultas a PgSQL, SQL Server o incluso SQLite sólo necesitaremos en algunos casos cambiar el tipo de dato, pero nuestro código puede mantenerse igual.
  • Dejamos que el servidor descanse: podemos, en el caso del ambiente cliente servidor, hacer las operaciones a las cadenas desde el cliente, evitando así sobrecargar al servidor y dejando que éste se encargue únicamente de volcar los datos.

Nota: esto aplica en bases de datos en donde haya millones de filas, en las demás tal vez ni se note la diferencia de rendimiento.

Sin embargo, nunca está de más aprender a utilizarlas, y para pequeños ejercicios nunca vendrán mal. Por otro lado, repito, si son operaciones sencillas no causarán un gran impacto al servidor.

Obtener parte izquierda

La sintaxis es:

LEFT(texto, cuántos)

En donde el texto puede ser un texto arbitrario como “Hola” o un dato.

Obtener clave del curso

Si miramos a la base de datos, la columna usuario tiene una clave conformada por otra clave y un número consecutivo. Por ejemplo, FP9D1801-01.

Podemos usar LEFT para obtener únicamente la clave (FP9D1801), sin el número consecutivo, usando esto:

SELECT LEFT(usuario, 8) FROM tblAlumnos LIMIT 1;

Recordemos que LEFT toma una cadena, en este caso será la columna usuario. Después, el segundo parámetro indica cuántos queremos, comenzando desde el inicio. Sólo queremos 8 caracteres.

Finalmente limitamos la consulta a 1, ya que no queremos que salgan todos los datos, pues serían repetitivos.

Obtener iniciales de los alumnos

Otra cosa para la que nos puede servir LEFT es para obtener únicamente la inicial de los nombres de los alumnos. En este caso, usaríamos:

SELECT LEFT(nombre, 1) AS Iniciales FROM tblAlumnos;

Indicamos que queremos la parte izquierda de nombre, ¿y cuántos queremos? sólo 1, es decir, la primera letra. Recuerda que el AS es para poner un alias al resultado.

En este caso no usamos LIMIT, en la consulta anterior sí, porque los datos eran repetitivos. Pero en este caso todas las iniciales (en teoría) son diferentes.

Obtener parte derecha

Esto es lo inverso de LEFT, y sigue la misma sintaxis:

RIGHT(texto, cuántos)

Sólo que en este caso, los “cuántos” comienza a contarlos desde la derecha. Es decir, si le mandamos algo como:

RIGHT(“Hola”, 1) devolvería “a”

Contrario a LEFT, que con:

LEFT(“Hola”, 1) devolvería “H”

Obtener los ID’s de los alumnos

Hace un momento, de la cadena parecida a FP9D1801-01 sacábamos la parte del curso, es decir, algo como FP9D1801. Ahora hagamos lo contrario, sacar únicamente el ID, el cuál sería 01, 02, etcétera.

Para ello, usamos:

SELECT RIGHT(usuario, 2) AS id FROM tblAlumnos;

Analizando podemos ver que desde la derecha tomamos los 2 dígitos, cosa que nos dará 01, 02, etcétera.

Obtener los ID’s de los alumnos varones

Casi la misma consulta que la anterior, pero con una condición en donde sexo sea H. La consulta queda así:

SELECT RIGHT(usuario, 2) AS id FROM tblAlumnos WHERE sexo = 'H';

Obtener los ID’s de los alumnos que no son varones

En este caso podríamos hacer una condición en donde sexo sea M, pero se está pidiendo una negación. La consulta queda así:

SELECT RIGHT(usuario, 2) AS id FROM tblAlumnos WHERE sexo <> 'H';

Parte media de una cadena

Ya vimos LEFT y RIGHT, ahora veamos a la función MID, que tiene la siguiente sintaxis:

MID(texto, desdeDónde, cuántos)

Vemos que en este caso sólo se agrega un parámetro “desdeDónde”. Analicemos…

En LEFT, desdeDónde es 1, pues comienza desde el primer carácter. En RIGHT, desdeDónde es la longitud de la cadena, pues comienza desde el último carácter.

Y MID nos permite especificar ese “desdeDónde” para tener un poco más de control.

Por cierto, recomiendo echarle un ojo a la función SUBSTR y SUBSTRING que me parecen mejores, personalmente.

Obtener período del curso

Trabajaremos de nuevo con los datos que tienen el formato “FP9D1801-01”. Ya obtuvimos la clave (FP9D1801), también el id (01) pero ahora queremos sólo el período, que en este caso sería 1801.

La consulta queda así:

SELECT MID(usuario, 5, 4) AS periodo FROM tblAlumnos LIMIT 1;

Vamos a cortar a “usuario”.

¿Desde dónde? desde la posición 5 (lo que me cae mal es que esto nos confunde, pues los índices comienzan en 1, contrario a los arreglos que conocemos, en donde empiezan en 0).

¿Cuántos? 4, pues eso mide “1801”.

Hacemos el límite porque no tiene caso consultar todos los registros, ya que son repetitivos al menos en este caso.

Longitud de una cadena

Ahora veamos otra operación curiosa, llamada CHAR_LENGTH que toma una cadena como entrada y devuelve su longitud. Su sintaxis es:

CHAR_LENGTH(cadena)

Y los casos de uso podrían ser:

  • CHAR_LENGTH(“Hola”) => 4
  • CHAR_LENGTH(“Maggie”) => 6
  • CHAR_LENGTH(“Los espacios cuentan”) => 20

Longitud de los nombres de los alumnos

El ejercicio pide devolver el nombre, y la longitud del mismo. Es fácil, la consulta queda así:

SELECT nombre, CHAR_LENGTH(nombre) FROM tblAlumnos;

Recordemos que CHAR_LENGTH puede tomar la columna de una base de datos.

Concatenar cadenas

Concatenar una cadena es juntar una con otra. Por ejemplo, si concatenamos “Ho” y “la” obtenemos “Hola”. La sintaxis es:

CONCAT(dato1, dato2, dato3, …datoN);

Es decir, podemos concatenar infinitas columnas. Veamos algunos casos de uso:

  • CONCAT(“Ho”, “la”, ” mundo”) => “Hola mundo”
  • CONCAT(“”, “”, “”, “H”, “”, “ola”) => “Hola”

Imprimir “Alumno” seguido del nombre del alumno

Para este caso no bastará simplemente seleccionar el nombre del alumno, sino que debe decir “Alumno” antes.

En otras palabras, en lugar de decir “Pedro” dirá “Alumno Pedro”. La consulta es la siguiente:

SELECT CONCAT('Alumno ', nombre) FROM tblAlumnos;

Devolver la letra inicial mas la letra final y longitud del nombre de los alumnos

Esta es una consulta un tanto más compleja. Lo que pide es que, de un nombre como “LUIS” devuelva LS4, ya que quiere la primera letra (L), la última (S) y la longitud (4). Para ello, la consulta queda así:

SELECT nombre, CONCAT(LEFT(nombre, 1), RIGHT(nombre, 1), CHAR_LENGTH(nombre)) AS clave FROM tblAlumnos;

Simplemente obtenemos los datos separados y finalmente concatenamos.

Buscar índice de una subcadena en una cadena

Esta función es muy útil. Permite buscar una aguja en un pajar, y devuelve la posición de una subcadena en una cadena. Si no encuentra nada, devuelve 0. Por cierto, no le importan las mayúsculas o minúsculas, las trata por igual. La sintaxis es:

INSTR(pajar, aguja)

Algunos casos de uso:

  • INSTR(“Hola”, “o”) => 2
  • INSTR(“Adiós”, “Z”) => 0
  • INSTR(“El perro ladra”, “perro”) => 4

Esta función también sirve para determinar si existe o no existe una subcadena en una cadena. Si devuelve 0 es que no, en caso contrario significa que sí.

Localizar la posición donde existe el primer espacio en el campo nombre

Usando INSTR con el primer argumento siendo nombre y el segundo el carácter ” ” (por favor, notar el espacio) la consulta queda así:

SELECT INSTR(nombre, " ") FROM tblAlumnos;

 

Función IF

Esta función no va aquí, pues no trata con cadenas sino con cualquier condición. Pero es necesario ponerla. La sintaxis es:

IF(algunaCondicion, enCasoDeQueSeCumpla, enCasoDeQueNo)

Casos de uso:

  • IF(5 < 20, “Sí”, “No”) => Sí

No puedo hacer muchos casos de uso, mejor veamos el ejercicio.

Imprimir dama o caballero según sea el caso, seguido del nombre del alumno

Dado un nombre como “Fernando”, cuyo sexo es H se tiene que imprimir “Caballero Fernando”. Si el nombre es, por ejemplo, “María” debe imprimir “Dama María”. Para esto usaremos CONCAT e IF:

SELECT CONCAT(IF(sexo = 'H', 'Caballero', 'Dama'), ' ', nombre) AS nombreFormal FROM tblAlumnos;

Espero que el IF se entienda. Primero comparamos si sexo es ‘H’. En caso de que sí, vamos a seleccionar “Caballero”, en caso de que no, “Dama”.

Luego, vamos a concatenar un espacio independientemente de si es hombre o mujer. Y finalmente concatenamos el nombre.

Upper y lower

No dedicaré mucho a esto, basta con explicar que upper convierte todo a mayúsculas y lower lo contario. Casos de uso para upper:

  • UPPER(“HolA”) => “HOLA”
  • UPPER(“Qué tal? 123”) => “QUÉ TAL? 123”

Para lower:

  • LOWER(“AdIÓs”) => “adiÓs” (malditos acentos, aunque extrañamente para upper sí funcionan)
  • LOWER(“foo”) => “foo”

Devolver en nombre propio el color favorito de los alumnos de CDMX

Aquí viene otra consulta que me gusta. Al principio me confundí, porque ¿qué demonios es nombre propio? yo lo conozco como Capitalizado.

En fin, se refiere a que si el color es “ROJO” o “rojo” o “RoJo” debemos devolverlo como “Rojo”; es decir, con la primera letra mayúscula y las demás minúsculas.

Cabe mencionar que debe mostrar sólo aquellos en donde el alumno sea de CDMX.

Si vemos la tabla, todos los datos están en mayúscula. Así que para la primera letra no tenemos que hacer ninguna conversión, pero para las demás sí. Lo explico aquí:

Supongamos que tenemos “AZUL”. Cortamos la primer letra con LEFT(colorFavorito, 1) y obtenemos A. Luego, queremos ZUL convertido a minúsculas, pero mm ¿cómo sabemos que será ZUL? tenemos que cortar con RIGHT, pero ¿cuántos? aquí viene a salvarnos CHAR_LENGTH.

Si CHAR_LENGTH devuelve la longitud, debemos cortar con RIGHT la cantidad de longitud – 1. Siguiendo el caso de “AZUL”, CHAR_LENGTH devuelve 4, pero al restarle 1 es 3. Luego hacemos un RIGHT(colorFavorito, CHAR_LENGTH(colorFavorito) – 1) y listo.

Con una combinación de estas funciones y CONCAT, podemos obtener lo que queremos. La consulta queda:

SELECT nombre, CONCAT(LEFT(colorFavorito, 1), LOWER(RIGHT(colorFavorito, CHAR_LENGTH(colorFavorito) - 1))) AS color FROM tblAlumnos WHERE origen = 'CDMX'; 

Con esto terminamos las funciones de cadena y las consultas, al fin podemos pasar a algo más interesante.

UPDATE, o cómo actualizar/editar registros

Update nos permite cambiar datos. Podemos cambiar a todos los de la tabla a un nuevo valor, asignarle un valor dependiendo del valor que ya existe, o usar una condición combinada.

Veamos los ejemplos para tener más claro el concepto, pero primero la sintaxis:

UPDATE nombreTabla SET columna = nuevoValor, otraColumna = otroValor WHERE algunaCondición

La cláusula WHERE no es necesaria, sólo es para ilustrar. Y podemos actualizar sólo una columna, o 2, o 3, o las que tenga nuestra tabla.

Cambiar el sueldo del usuario con el idx 20 a $30000

Al usuario con idx 20, vamos a cambiarle el valor que tiene en ingresos. Para ello, usamos:

UPDATE tblAlumnos SET ingresos = 30000 WHERE idx = 20;

Cambiar el sueldo del usuario con el idx 20 a $33000 usando su nombre de usuario

La misma consulta que la anterior, pero ahora usando “usuario” como condición en WHERE. Así:

UPDATE tblAlumnos SET ingresos = 33000 WHERE usuario = 'FP9D1801-20';

Esto sirve para demostrar que no siempre tenemos que utilizar el índice (aunque es muy recomendable, por la velocidad).

Aumentar sueldo sin saber valor

En los casos anteriores usábamos un valor definido por nosotros al actualizar. Pero, ¿qué pasa si queremos aumentar el sueldo independientemente de su valor? por ejemplo, aumentarle $1000 sin importar si su sueldo es $3000, $4000, etcétera.

La consulta queda así:

UPDATE tblAlumnos SET ingresos = ingresos + 2000 WHERE usuario = 'FP9D1801-20';

Como podemos observar, usamos SET ingresos = ingresos + 2000. Es al mismo usuario con el que hemos venido trabajando, pero por favor noten que utilizamos ingresos como una variable.

Cambiar origen

Al mismo usuario ahora vamos a asignarle un nuevo origen: Puebla. La consulta es realmente sencilla:

UPDATE tblAlumnos SET origen = 'PUEBLA' WHERE usuario = 'FP9D1801-20';

Cambiar créditos y color favorito

UPDATE tblAlumnos SET creditos = 320, colorFavorito = 'NEGRO' WHERE usuario = 'FP9D1801-20';

Ahí vemos que podemos establecer muchos valores, no sólo uno.

Incrementar los ingresos de los alumnos del estado de Puebla en un 2 %

Esta consulta me gustó mucho. Dice que a los ingresos de los alumnos en puebla hay que aumentarles el 2 % sin importar el valor de los mismos. Por ejemplo, si ingresos es 100 ahora será 102.

Para ello usamos lo siguiente:

UPDATE tblAlumnos SET ingresos = ingresos + (ingresos * (0.02)) WHERE origen = 'PUEBLA';

Esto fue lo que propuse, pero existe otra manera más fácil:

UPDATE tblAlumnos SET ingresos = ingresos * 1.02 WHERE origen = 'PUEBLA';

Ya que no es necesario sumar si multiplicamos por 1, pues 1 representa el 100 %. De todas maneras ambos funcionan, aunque recomiendo el segundo.

Actualizar el campo color de la siguiente manera: Poner como BLUE cuando color sea CAFE, VERDE, ROJO o AZUL

Fácil, usando la cláusula IN que vimos en el post anterior. La consulta queda así:

UPDATE tblAlumnos SET colorFavorito = 'BLUE' WHERE colorFavorito IN('CAFE', 'VERDE', 'ROJO', 'AZUL');

Igualmente podemos hacer muchos OR, pero me parece más elegante IN.

Eliminar registros con DELETE

Ahora para terminar veamos la sintaxis de DELETE. Es así:

DELETE FROM nombreTabla WHERE algunaCondición;

Eliminar aquellos alumnos en donde color favorito sea rosa

Es sencillo, pues es combinar DELETE con un WHERE. Queda así:

DELETE FROM tblAlumnos WHERE colorFavorito = 'ROSA';

Eliminar registros en donde el origen sea PUEBLA y el color favorito sea BLUE

DELETE FROM tblAlumnos WHERE origen = 'PUEBLA' AND colorFavorito = 'BLUE';

Bonus: vaciar tabla

DELETE FROM tblAlumnos;

O también:

TRUNCATE tblAlumnos;

La diferencia es que TRUNCATE reinicia el contador de autoincremento, mientras que DELETE no. Aunque de hecho ya vimos la forma de reiniciar dicho contador.

Conclusión

Con esto terminamos por hoy, espero poder traer más ejercicios. Por cierto, te recomiendo visitar el primer post: Ejercicios resueltos con MySQL parte 1.

PostgreSQL: Separar una cadena con expresión regular y poner los resultados en filas

Introducción

Este es otro ejercicio de codewars que estuve a punto de resolver correctamente, aunque al final utilicé unos métodos no recomendados para el ejercicio, pero funcionaron.

El problema era el siguiente:

Dada una cadena aleatoria, partirla en diferentes filas cada que se encontrara cualquier vocal. Por ejemplo, veamos esta cadena:

ah7ki3eumgpa72mdpwe8od

Si la partimos o hacemos un split en cada vocal, sin incluir las vocales, tendríamos un resultado así:

h7k
3
mgp
72mdpw
8
d

Pues exactamente eso se tenía que hacer usando una consulta.

Paso 1: Separar usando expresión regular

En el mismo ejercicio nos aconsejan, aunque no es obligatorio, usar expresiones regulares. En PostgreSQL existe una función que, con un valor y una expresión regular devuelve un arreglo en donde cada valor corresponde a la porción separada: REGEX_SPLIT_TO_ARRAY

La forma de usarla fue la siguiente:

SELECT REGEXP_SPLIT_TO_ARRAY(cadena_aleatoria) AS resultados FROM tabla;

Y devolvía algo así (un arreglo):

{h7k,3,mgp,72mdpw,8,d}

Pero esas no eran filas, eran una sola fila con un arreglo. Entonces busqué la forma de convertir ese arreglo en filas.

Por cierto, la expresión regular es [aeiou], lo que significa que coincidirá cada que encuentre cualquier valor de los que están en el conjunto.

Paso 2: convertir arreglo en filas

Para ello utilicé la función UNNEST, que expande los elementos de un arreglo a filas. Por lo que si el arreglo era {h7k,3,mgp,72mdpw,8,d}, al llamar a esta función se convertía en:

h7k
3
mgp
72mdpw
8
d

La consulta quedó así al final:

SELECT UNNEST(REGEXP_SPLIT_TO_ARRAY(cadena_aleatoria, '[aeiou]')) 
AS resultados 
FROM tabla;

Solución con buenas prácticas

Después de haber mandado esa solución que ya he expuesto, vi la que implementaba las mejores prácticas. Y era casi una combinación de ambas funciones: REGEXP_SPLIT_TO_TABLE

Como su nombre lo dice, separa en filas de acuerdo a una expresión regular.

Conclusión

Siempre se aprenden cosas nuevas, y qué mejor que en codewars, en donde miles de expertos y no tan expertos califican y comparten las soluciones de las pruebas.

Por cierto, el ejercicio o kata es este.

Ejemplo de Sockets en Java: chat básico entre cliente y servidor

Introducción

Escribo esto para que no olvide cómo implementar un socket servidor y uno cliente en Java. Ambos pueden ser conectados en la misma máquina, o conectados a través de una red.

También pueden usar distintos puertos y, como lo dije, distintas IP’s.

Por defecto, el servidor escucha  en el puerto 5050 de localhost, aunque dicho puerto puede cambiarse.

Y el cliente, se conecta por defecto a localhost en el puerto 5050, pero este puede conectarse no sólo a localhost, sino a cualquier IP.

Una vez hecha la conexión, se puede “chatear” de ambos lados. Cabe mencionar que esto corre en la terminal, sin interfaz gráfica ni nada de esas cosas que sólo complican al código. Hice el código lo más limpio y corto posible.

Dicho esto, aquí dejo el código.

Continue reading…

Algunas abreviaciones útiles con Emmet al programar en HTML

Introducción

No sé cómo definir a Emmet, pero es algo como un plugin para los editores de texto más populares. Permite expandir “abreviaciones” desde las más simples hasta las más complejas.

Con Emmet, podemos agilizar el proceso de desarrollo, pues nos ahorra escribir mucho código. Este plugin es muy querido por la comunidad porque tiene soporte para la mayoría de editores.

Hoy mostraré algunas abreviaciones que utilizo en mi día a día.

Abreviaciones

Para expandir las abreviaciones, creo que se utiliza la tecla del tabulador.

Estructura de un documento HTML 5

html:5

Etiqueta meta viewport para sitios responsivos

meta:vp

Div con el id “contenedor”

#contenedor

Div con la clase “clase-1” y “borde-rojo”

.clase-1.borde-rojo

Div con el id “principal”, que tenga las clases “xs-12” y dentro de él tenga otros dos divs con las clases “borde-azul”

#principal.xs-12>.borde-azul*2

Botón con clases

btn.clase-1.clase-2

Botón con clases “btn” y “btn-success” cuyo tipo sea “button”

btn.btn.btn-success[type=”button”]

Botón tipo “submit”, que en su interior diga “Guardar”

btn[type=”submit”]{Guardar}

Lista con 5 elementos

ul>li*5

Lista en donde el contenido de cada elemento tenga el texto con el índice y la clase “list-element”

ul>li.list-element{Soy el elemento $}*5

Formulario con nombre, action y método para solicitar un correo electrónico. El input debe tener la clase “form-control” y un placeholder

form[name=”miFormulario”][action=”archivo.php”][method=”POST”]>label[for=”correo”]{Correo electrónico:}+input[type=”email”][placeholder=”Escribe tu correo…”]#correo.form-control

Tabla completa con clases

Mi favorito, genera la estructura de una tabla.

table.table.table-bordered>(thead>tr>th*3)+(tbody>tr>td*3)

Escapar índice

Si deseamos que aparezca el $ en lugar del número de elemento, debemos escaparlo con \. Pongamos el ejemplo de una lista con 3 elementos:

Conclusión

Espero no haberme pasado con los ejemplos, pero si lo hice fue para demostrar todo lo que podemos hacer. Igualmente podemos ir generando elemento por elemento; es decir, en el caso del formulario, primero hacemos el form, una vez dentro expandimos el label e input, etcétera.

De esta forma no se complican tanto las cosas y todo es legible. Espero que este tutorial haya servido para algo. Te invito a probar con tus propias abreviaciones y a leer la documentación oficial.

Ejemplo de Arduino y LCD con el módulo I2C

Introducción

El módulo I2C para la LCD viene genial cuando queremos ahorrar pines de Arduino. Así, solamente utilizamos 2 pines de datos y 2 de alimentación, ahorramos conexiones y esfuerzo.

De tantas librerías que existen y tantos tutoriales desactualizados me decidí a escribir uno nuevo que funcione completamente, tenga ejemplos y tome una librería confiable, incluida en los repositorios oficiales de Arduino.

Componentes necesarios

  • Una LCD de 16×2, 20×4 o cualquiera que sea compatible
  • Un módulo I2C
  • Un Arduino
  • Cables

Instalando librería

Comencemos con la parte del software. Abriremos nuestro software de desarrollo y en el menú navegamos a Programa > Incluir Librería > Gestionar Librerías:

Aparecerá una ventana después de cargar un momento. Ahora, en el cuadro de búsqueda escribimos “Liquidcrystal_i2c“, esperamos a que los datos se filtren e instalamos la librería llamada LiquidCrystal I2C creada por Frank de Brabander. Si no aparece al inicio, bajamos hasta encontrarla.

En mi caso ya la tengo instalada, pero si no la tenemos simplemente hacemos click en el botón que dice “Instalar”:

Con ello ya tenemos instalada la librería. No es necesario reiniciar ni nada por el estilo; es hora de trabajar.

Preparando Arduino y conexiones

Antes de programar, debemos armar. Aquí dejo el circuito en Fritzing, espero que se explique por sí mismo.

En este caso lo dejo para el Arduino MEGA pero puedes ver este otro post en donde conecto el módulo I2C al UNO y al Arduino Leonardo, lo único que cambia son los puertos.

Programando Hola mundo

Para proseguir con este tutorial, necesitamos la dirección hexadecimal de nuestro módulo I2C, es algo como 0xFF, pero para no intentar adivinara podemos ver este post en donde explico cómo obtenerla.

Es importante tenerla, ya que sin ella no podremos seguir.

Ahora veamos el código para imprimir un hola mundo:

Resultados

Verificamos las conexiones, cargamos el código a la tarjeta y si todo va bien, debe mostrarse algo así:

Si no funciona, por favor recuerda verificar la dirección del módulo I2C, que seguramente no será la misma que aparece en el código. También recuerda revisar los cables y las conexiones minuciosamente; todo puede fallar.

Habilitar extensión SQLite3 en PHP

Introducción

SQLite3 es un excelente motor de base de datos. Todo está contenido dentro de un mismo archivo y va de maravilla, pero hoy no vamos a hablar del motor sino de cómo habilitar la extensión en PHP.

En algunos casos puede que ya venga activada por defecto, pero en caso de que no, nos mostrará el siguiente error:

Fatal error: Class ‘SQLite3’ not found

Si tienes este error entonces continúa leyendo, pues veremos cómo activar la extensión.

En hosting compartido

Cuando estamos en un hosting compartido, es decir, cuando rentamos un servidor pero no es un VPS, podemos habilitar y deshabilitar las extensiones de PHP desde el Cpanel. Así que no tocaré ese tema, pero debe haber miles de tutoriales de cómo hacerlo; y si no, contacta a tu proveedor.

En Windows o Linux

En caso de que estés en Windows, simplemente tienes que ir al lugar en donde se encuentra tu archivo php.ini. Si seguiste este tutorial sin cambiar nada, entonces está en c:\xampp\php\php.ini.

En caso de Linux (o si no sabes en dónde está ) puedes seguir este tutorial para saber en dónde está php.ini

Vamos a abrir ese archivo con un editor de texto plano, y buscaremos “sqlite3” hasta dar con el siguiente bloque:

Como podemos observar, la línea está comentada. Lo único que tenemos que hacer es eliminar ese punto y coma y guardar el archivo, de manera que al final quede así:

Reiniciando para recargar extensiones

Finalmente reiniciamos Apache para que recargue las extensiones de PHP y listo, el error se habrá ido (al menos que tu compilación de PHP no tenga la extensión).

Para ello, podemos usar (en Linux) sudo service apache2 restart

En Windows, si es que tenemos XAMPP, abrimos el panel de control, presionamos el botón de Stop de Apache, esperamos a que se detenga y luego hacemos click en Start.

¿En dónde está el archivo php.ini?

Introducción

Hoy veremos cómo encontrar el archivo llamado php.ini en cualquier sistema operativo. A veces, cuando instalamos PHP no sabemos ni en dónde se encuentran ubicadas las cosas.

Así que veremos cómo hacer que el propio PHP nos diga en dónde está su archivo de configuración.

Preparando archivo

Lo único que tenemos que hacer es pegar el siguiente código en un archivo PHP, guardarlo en la carpeta del servidor y abrirlo desde el navegador.

En este caso, el mío se llama phpinfo.php, así que iré al navegador en la dirección localhost/phpinfo.php

Buscando ruta

Finalmente, en la página que se abra vamos a buscar la fila que diga Loaded Configuration File

Y a la derecha tendremos la ruta. En mi caso es D:\desarrollo_web\php\php.ini