Categories
programación tutorial

Variables

Aprende a programar desde cero: Variables

Esta es una serie de artículos donde discutimos los conceptos básicos de la programación de una forma intuitiva, por medio de ejemplos.

En esta ocasión aprenderemos sobre las variables, para que sirven y como usarlas en la practica.

[toc]

Que son las variables

Las variables son una especie de contenedor que nos permite guardar un dato para luego poder recuperarlo de forma fácil y rápida por medio del nombre que le asignamos.

En este sentido las variables se asemejan mucho a una caja con una etiqueta.

Variables

Imagina lo siguiente:

Tu cuarto es un desorden y hay un montón de cosas que ya no usas, así que decides guardarlas.

Tienes dos alternativas:

  1. Amontonar todo en un solo sitio.
  2. Usar cajas marcadas según su contenido

El problema con la primera opción es que si luego quieres volver a utilizar, por ejemplo, tu viejo gameboy, tendrás que sacar cosa por cosa para encontrar lo que deseas.

Si en lugar de eso acomodas las cosas en cajas marcadas, luego sera mucho mas fácil encontrarlas lo que deseas.

Las variables guardan datos y se identifica por medio de un nombre.

Para que sirven

Las variables nos permiten reutilizar una solución.

Una vez encontramos la solución a un problema, muy seguramente podemos aplicar la misma solución a problemas similares si identificamos las partes que cambian (varían) y las sustituimos.

Un ejemplo de esto son las formulas matemáticas.

Pitagoras halló la forma de calcular la hipotenusa de un triangulo rectángulo, con su teorema podemos resolver cualquier triangulo rectángulo con solo sustituir las variables con nuevos valores.

Teorema de Pitágoras

Un ejemplo “mas practico” son los formatos de documentos, donde solo debemos sustituir los campos en blanco con los datos requeridos.

Aquí podemos identificar otra parte importante de las variables: el tipo de dato.

El tipo de dato es el conjunto de valores que una variable puede tomar. Si vemos el siguiente formato de permiso, solo ciertos valores tienen sentido en cada campo.

Formato de permiso

En los campos de nombres y motivo no tiene sentido escribir puros números, así como en los de día, año curso y teléfono puras letras.

Las variables solo tienen un conjunto de valores posibles (tipo de dato)

Una definición informal

Con lo visto anteriormente podemos decir que:

Una variable nos permite almacenar un valor de cierto tipo para su posterior recuperación por medio de su nombre.

Variables en la practica

Ahora que tenemos una idea mas clara sobre que es una variable, es momento de ponerlo en practica.

Como crear una variable

La creación de una variable se divide en:

  • Definición: le damos un nombre y especificamos el tipo de dato.
  • Inicialización: Asignamos un valor a la variable.

Como crear una variable

En los lenguajes de tipado dinámico no se especifica un tipo de dato he incluso podemos cambiar el contenido de una variable de un entero a un float o un string – Aunque no deberíamos hacerlo, ya que ésto genera confusión.

Ejemplos de lenguajes de tipado dinámico son son javascript, php y python.

Tipos de datos

Si bien los tipos de datos dependen del lenguaje que estemos utilizando, existen algunos tipos básicos que siempre encontraremos:

TIPO DE DATO DESCRIPCIÓN
int Números enteros
float Números con decimales
boolean Valor logico (vardadero o falso)
string Texto
Arreglos Conjunto de datos del mismo tipo

En lenguajes con tipado estático es necesario especificar que tipo de dato deseamos guardar en la variable y no es posible almacenar un dato que no sea del tipo que especificamos:

int entero = 10;
float decimal = 1.3;
String texto = "hola mundo!"
// Esto genera un error
texto = 10;

En lenguajes de programación con tipado dinámico no es necesario especificar el tipo de variable.

// javascript
var entero = 10;
var decimal = 1.23
var texto = "hola mundo!"
// es posible cambiar el tipo de dato, pero no deberíamos hacerlo
texto = 10;

Nombres de las variables

Las reglas para la creación de nombre de variables dependen del lenguaje, por lo que debes consultar la documentación del mismo para estar seguro; pero por lo general:

  • Tienen que empezar con una letra o un guion bajo. Algunas excepciones:
    • En PHP tienen que empezar con el signo $
    • En javascript pueden empezar con el signo $.
  • No pueden contener espacios
  • Solo puede contener letras, números y el guion bajo (_)
    • En javascript también pueden contener el signo $

Ejemplo:

// lenguaje java
int edad = 10;
String nombre_completo = "John Smith";
// Incorrecto
String Nombre completo = "foo"; // contiene espacios
float 3pedro = 10.1; // empieza con un numero

Buenas practicas

Cualquier tonto puede escribir código que un ordenador entienda. Los buenos programadores escriben código que los humanos pueden entender. Martin Fowler

Gran parte de nuestra vida como desarrolladores la pasaremos corrigiendo errores (bugs), agregando nuevas características y en general manteniendo programas existentes. Es por esto que debemos hacer que nuestros programas sean fáciles de entender.

  • Los nombres de las variables deben ser descriptivos, incluso si esto significa que sean largos (sin excederse).
// que ~%$*#@ hace esta función
function f(a, c, m) {
	return a * Math.pow(1 + c, m);
}

Puede que en el momento nos parezca obvio lo que hace esta función, pero ¿lo seguirá siendo 1 mese después?, ¿que tal 10 meses después? o ¿seguiremos siendo nosotros los que mantengamos el código?.

Recuerda:

Codifica siempre como si la persona que fuera a mantener tu código fuera un asesino en serie maníaco que sabe donde vives

// mucho mejor
function interesCompuesto(capital_inicial, porcentaje, tiempo) {
	return capital_inicial * Math.pow(1 + porcentaje, tiempo);
}
  • Ser consistentes a la hora de nombrar nuestras variables. Si los nombres de nuestras variables siguen un patrón predecible, serán mucho mas fácil de recordar y disminuiremos la posibilidad de cometer errores.
int Mi_Entero = 10;
String miString = "Hola ";
float mifloat = 10.1;
// varias lineas mas abajo o incluso en otro archivo
// no recordamos como llamamos a nuestra variable
mostrarMensaje(mistring + " Juan");

Conclusión

Con esto concluimos la primera parte de este “mini-curso” sobre programación, en el proximo articulo hablaremos sobre las iteraciones.

Si te gusto no olvides compartirlo, y si tienes alguna pregunta déjala en los comentarios.

Categories
Canvas html5 programación

Tablet nueva, juegos rotos.

Hace pocos días llego por fin mi tableta (una gallaxy tab 2) y como podrán imaginar lo primero que hice fue probar los juegos que he desarrollado y para mi sorpresa varios de ellos no funcionaban correctamente; en algunos se veía un segundo canvas con la misma imagen y en otros el contenido previo no se borraba. Al parecer es un problema ya viejo con clearRect que afecta a android 4.1. Lo primero que se me ocurrió para solucionar el problema fue el viejo truco de re-definir el tamaño del canvas:
[js]canvas.width = canvas.width;[/js]
Ahora si que funcionaban, pero algunas acciones como el arrastrar eran realmente lentas (especialmente al arrastrar y soltar); el problema con este método es que ademas de borrar el contenido del canvas, también restablece su estado (fillStyle, clearStyle, scale, translate, shadowColor….) lo que al parecer influye en el rendimiento (al menos en el gallaxy tab – único dispositivo que tengo para hacer pruebas). Otra de las soluciones sugeridas para eliminar el problema del canvas duplicado que encontré era el quitar el estilo overflow: hidden de todos los elementos padres del canvas, aunque el problema desapareció al igual que en el método anterior el rendimiento era pésimo.

Solución

Hasta el momento la solución con los mejores resultados es la de usar un color solido como fondo para el canvas y al momento de borrar el contenido usar fillRect en lugar de clearRect
[html]<canvas style="background: #fff;"></canvas>[/html]
[js]function clear(ctx) {
ctx.fillStyle = "#fff";
ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
}[/js]
El aumento en rendimiento es considerable, sobre todo en juegos que requieren arrastrar y soltar (como el solitario). Aun así esta no es una solución definitiva ya que al usar un color solido no es posible apilar canvas para crear capas.

¿Conoces alguna mejor solución? déjala en los comentarios.
Categories
extensión programación qr code

Easy QR Code: Mi primera extensión para chrome


tltr: Hice una extensión para chrome que genera códigos QR con tan solo dos clics (descarguen aquí). Si les gusta compartan/comenten en twitter/facebook (quiero ser famoso *¬*).

Los códigos QR son una forma de almacenar información en un código de barras en dos dimensiones, y son una muy buena forma de copiar enlaces y texto a nuestros dispositivos móviles en lugar de tener que copiarlos a mano.

En la tienda de extensiones de chrome no encontré ninguna que cumpliera mis necesidades (rápido y simple de usar), mucha de las “extensiones” son simples enlaces a paginas y requieren muchos pasos:
  1. Copiar texto/enlace
  2. Clic para abrir la “Extensión”
  3. Pegar texto en un formulario
  4. Clic para generar el código
Demasiado extenuante para un simple código, en mi extensión ideal solo se necesita:
  1. Clic derecho sobre texto/enlace
  2. Seleccionar generar código
Listo. adicionalmente el código debe generarse rápidamente. con estas especificaciones y armado con una librería para generar códigos QR y la documentación del API de extensiones de chrome y dos cojones nació mi primera extensión para google chrome: Easy QR Code.
A continuación el enlace a la extensión y un corto vídeo de su funcionamiento.
https://chrome.google.com/webstore/detail/easy-qr-code/okcelelcbendjdeilpendpjophdppgjk
Categories
Canvas html5 javascript programación tutorial

Canvas desde cero

Si llevas tiempo con ganas de aprender a usar el canvas o quieres refrescar tus conocimientos,
no puedes perderte esta serie de tutoriales que arranca el día de hoy, donde no solo se explicara
como usar x función sino que desarrollaremos programas reales donde podrás aplicar lo aprendido.

y quien es usted para decirme que hacer

Soy un tipo al que le gusta la programación, en especial todo lo relacionado con la web (javascript *¬*)
y desde que conocí el elemento canvas quede fascinado con la idea de poder dibujar en navegador.
si bien no soy un experto y aun sigo aprendiendo, ya llevo tiempo trabajando con este elemento
y he aprendido mucho gracias a la comunidad y esta es mi forma de contribuir en algo.
algunos de los trabajos que he hecho:

P.D.: Si ven que me estoy colgando en la actualización del blog no duden en jalarme las orejas en twitter XD.

Categories
enseñanza opinion personal programación

while (fracaso) { try{do_something} catch(e){ continue; } }

Después de varios “fracasos” puedo decir con seguridad que la parte difícil de programar no es tener una idea y desarrollarla, no porque sea fácil, sino porque entre entre mas dificultad presente el problema mas nos entusiasmamos y a pesar de todo lo disfrutamos (al menos yo).

Pero a la hora de “vender” el producto y lo pongo entre comillas ya que no lo digo en el sentido de intercambiarlo por dinero sino hacer que las personas lo usen, recomienden… todo va mal. Por poner ejemplos:

ConceptMap: una aplicación para crear mapas conceptuales que desde su lanzamiento ha tenido la increíble estadística de 2 personas afiliadas y 1 mapa conceptual creado.

jsaw5: un juego que permite crear rompecabezas de hasta 100 fichas usando cualquier imagen y compartirlos con amigos usando una url corta, que empezó muy bien pero a medida que pasan los días veo como las estadísticas en analytics van cayendo.

Y eso que estas aplicaciones son GRATIS, ahora no me imagino lo difícil que debe de ser atraer usuarios que paguen por usar tu programa.

No es solo la falta de experiencia en marketing y esas cosas, sino que la tarea en sí resulta molesta a diferencia de programar que disfruto aun cuando me saca canas verdes.

Tal vez no tengo talento para esto, tal vez nunca pueda llegar a crear una aplicación “popular”, pero por el momento seguiré intentando.

Alguien mas se siente de esta forma, algún consejo.

Categories
aplicación web base de datos blog django models programación tutorial

Creando un blog con django – parte 2

Llego el momento de crear los modelos, pero antes analicemos los datos que necesitamos guardar. Nuestro blog tendrá post, comentarios y tags, los que a su vez se componen de:

  • Post: fecha, titulo, contenido y etiquetas.
  • Etiqueta: nombre.
  • Comentario: autor, fecha, contenido.

Ahora bien, una etiqueta puede estar relacionada con varios post, así como un post tener varias etiqueta, por lo que tienen una relación many to many. Los comentarios por otro lado solo pertenecen a un post por lo que necesitan una clave foránea que lo relacione con el respectivo post.

Teniendo claro el modelo de la base de datos, es hora de escribir el código necesario para crear las tablas, afortunadamente django nos facilita la tarea. Editamos el archivo models.py ubicado en la carpeta de la aplicación:

# 1
from django.db import models

# 2
class Tag(models.Model):
# 3
tag = models.CharField(max_length=100, unique=True, db_index=True)
# 4
def __unicode__(self):
return self.tag

Veamos que hicimos:

  1. Importamos el modulo models.
  2. Creamos una subclase de models.Model, 
  3. Cada columna de la bd es representada por un atributo, en este caso tag es de tipo caracter (CharField), existen otros tipos de campo según el valor almacenar. Los argumentos describen las propiedades del campo como la cantidad de caracteres que puede contener (max_length), que no se permiten valores repetidos (unique), ademas de hacer que se indexe (db_index) ya que es comun hacer búsquedas como: buscar todos los post con tag django.
  4. el método __unicode__ permite dar un nombre mas significativo a las instancias, este es utilizarlo en el sitio administrativo.

Sabiendo esto es fácil crear las demás tablas:

# post
class Post(models.Model):
# la relación many to many entre Post y Tag
tags = models.ManyToManyField(Tag, blank=True)
title = models.CharField(max_length=200)
body = models.TextField()
# fecha de publicación, se agrega fecha automáticamente
pub_date = models.DateField(auto_now_add=True)

def __unicode__(self):
return self.title

class Comment(models.Model):
# Cada comentario pertenece a un post
post = models.ForeignKey(Post)
# nombre es opcional (blank) y por defecto es Anonimus (default)
name = models.CharField(max_length=100, blank=True, default="Anonimus")
# el cuerpo del comentario
body = models.TextField(verbose_name="comment")
# fecha de publicación, se agrega fecha automáticamente
date = models.DateField(auto_now_add=True)

def __unicode__(self):
return "Por " + self.name + " en " + self.post.title

La clave foránea y relación many to many se crea en una simple linea de código. Ahora sincronizamos nuevamente y entramos al interprete de python para introducir información en la base de datos:

$ python manage.py syncdb
$ python manage.py shell
# importamos los modelos
from blog.models import Tag, Post

# aun no hay tags así que creamos una
django = Tag(tag="django")
django.save()

# creamos un post
new_post = Post(title="mi primer post", body="El primer post que realizo")
new_post.save()
# agregamos un tag y volvemos a guardar
new_post.tags.add(django)
new_post.save()

Como vemos, para introducir un registro en la base de datos creamos una instancia de la clase adecuada y seguidamente llamamos el método save, ¿pero como recuperamos un registro? existen tres métodos para consultar la base de datos:

  • get: retorna un solo registro, lanza una excepción si la consulta retorna cero o mas de un registro.
  • filter: retorna un array con los registros que coinciden la consulta o un array vacío.
  • exclude: similar a filter pero retorna los registros que no cumplen con la consulta.
Estos métodos se acceden a través del atributo objects que poseen las subclases de models.Model.
# recuperar todos los post
Post.objects.filter()

# recuperar los primeros 10
Post.objects.filter()[:10]

Para refinar la búsqueda usamos argumentos que corresponden con los campos de la tabla:

# post segun titulo
Post.objects.filter(title="mi primer post")

Los campos que son claves foraneas (Post.tags, Comment.post) son algo especial: podemos seguir la relación escribiendo el nombre de la columna seguido de dos guiones bajos (_), pudiendo acceder el modelo al que apunta dicha relación. veamos un ejemplo:

# post con tag django
Post.objects.filter(tags__tag="django")

Al usar tags__ ya no estamos mas en Post sino en Tag, ahora podemos consultar los campos de esta tabla (tag). otro ejemplo:

# comentarios de posts con tag django
Comment.objects.filter(post__tags__tag="django")

Seguimos la relación a Post (post__) y consultamos la columna tags__ lo que nos lleva a Tag donde finalmente consultamos el atributo tag o_O.

Con esto tenemos lista la base de datos, en la próxima parte veremos como crear plantillas para visualizar estos datos.

Muchas gracias por su atención, no olviden dejar sus sugerencias, inquietudes y amenazas en los comentarios, hasta la próxima.

Categories
extraer gratis imagen powerpoint programa programación python

Extrae imágenes de archivos PowerPoint

Versión corta: pues que escribí una aplicación para extraer imágenes de archivos PowerPoint y la pueden descargar de aquí.

Versión larga:

Nuca he entendido esa manía de algunas personas de estar enviando PowerPoints a diestra y siniestra por lo que todo el que llega termina en la papelera sin leerlo XD.

Un conocido al que si le encantan me pidió un programa para extraerles las imágenes. Encontré dos pero ninguno funciono, así que escribí un script en python que pueden encontrar en github (advertencia: visualizar el código puede causar sangrado de ojos). Ya estando en ello le cree interfaz gráfica (la primera que hago). Eso sí, es algo…. feeeeaaaa, pero en el proceso puede recuperar imágenes porno aprender algo sobre threads, instaladores y otras cosas de las que escribiré mas adelante, por el momento he aquí el cuerpo del delito: PowerPoint Extractor.

Eso es todo. no olviden seguirme en twitter y/o suscribirse al feed del blog.

Actualización: En github pueden encontrar un modulo para dicho fin que funciona tanto en Windows como en Linux.

Categories
Canvas event html5 javascript programación script

Beta 2 de canvas-event disponible

Ya esta disponible la beta 2 de canvas-event, esta revisión cuenta con algunas mejoras y corrección de errores como:

  1. Posibilidad de adicionar una función a varios eventos simultáneamente
  2. Las figuras dibujadas dentro de un manejador de eventos ahora si se visualizan
  3. Los Objetos Line ahora también pueden ser arrastrados
  4. Los bordes redondeados ahora también funcionan en Opera
Espero que les sea tan útil como lo ha sido para mi.
Categories
bash descargas linux megaupload programación proxy script software libre

script: descarga automática de Megaupload

Aprovechando que estoy aprendiendo a programar en bash y que megaupload ahora no requiere llenar ningún captcha para realizar las descargas, decidí rescribir el anterior script (escrito en python) y agregarle nuevas características.

Ahora es posible indicar una URL (con la opcion -c) y el script extrae los links de Megaupload que encuentre, me parece una funcionalidad muy conveniente ya que con el anterior script era necesario copiar a mano todos los links a un archivo de texto, lo cual puede ser muy tedioso.

Otra funcionalidad es la de usar la dirección ip de los servidores para realizar las descargas, esto ayuda a saltarse algunos proxies que están configurados para bloquear paginas por nombres de dominio en lugar de direcciones ip XD.

El script ha sido probado con Ubuntu 10.10 que es el OS que uso actualmente, pero no creo que tengan problemas usándolo en otra distro, siempre y cuando tenga instalado wget que es el programa que usa para realizar las descargas.

Pueden descargarlo del siguiente enlace:

Luego le damos permisos de ejecución y lo copian en el directorio bin:

novatoz@sney2002:~$ chmod +x mget
novatoz@sney2002:~$ sudo cp mget /bin/

Espero les sea de utilidad, y si tienen alguna inquietud o sugerencia no duden en dejarla en los comentarios.

update: corregido error que impedía descargar archivos cuyos nombres contuvieran  caracteres no ascii, los cuales están codificados usando html entities, ejemplo:

# este link no apunta a ningún archivo
http://www465.megaupload.com/files/f4f4ab2163558f1f/Capacitaci&#00243;n.mp4
# el link es valido al cambiar &#00243; por ó
http://www465.megaupload.com/files/f4f4ab2163558f1f/Capacitación.mp4

ahora es necesario tener instalado w3m

Categories
chorradas javascript programación python script Wingdings

Revertir guardado en Wingdings

El otro día me encontraba aburrido a mas no poder, cuando de pronto me llaman a hacerme la siguiente pregunta: Imaginen que tienen un documento y no quiere que nadie mas se entere de lo que contiene, nada mejor que guardar dicho documento con el tipo de letra Wingdings, el problema es revertir el proceso, aunque no lo crean es algo mas común de lo que párese, la única solución es ir reemplazando cada signo por el caracter original, un proceso algo tedioso si se decide hacer a mano, así que porque no crear un script (en python) que automatice el proceso.

Para empezar tenemos que saber la correspondencia entre caracteres y signos, así que procedemos a abrir word e introducir los caracteres mas utilizados (letras mayúsculas y minúsculas, números, signos de puntuación, espacio) en una tipo de letra normal, con estos creamos una variable que llamaremos decode en nuestro código fuente, luego nuevamente en word cambiamos el tipo de letra por Wingdings y creamos otra variable que llamaremos encode, estas variables tienen que ser string unicode ya que los símbolos usados por la letra Wingdings son de lo mas raros; luego es cuestión de en un bucle ir reemplazando las coincidencias del caracter de encode en la posicion i con el carracter de decode en la misma posición. El script completo seria algo así:

#!/usr/bin/python
#!/usr/bin/python
# -*- coding: UTF-8 -*-
# Por: Jhonatan sneyder Salguero Villa (sney2002@gmail.com)

import codecs
from os.path import split, splitext

def translate(path=""):
"""" Convertir texto en Wingdings a caracteres normales ""

text2decode = codecs.open(path, 'r', 'utf-8').read()

decode = u"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!”?¿¡.,;():/*-+=&%$# @"
encode = u"”¿¡"

for i in range( len(decode) ):
text2decode = text2decode.replace( encode[i], decode[i] )

filename = splitext( split( path )[1] )[0]

file = codecs.open('resultado_%s.txt' % filename, 'wb', 'utf-8')

file.write( text2decode )

file.close()

if __name__ == "__main__":
import sys

try:
file = sys.argv[1]
translate( file )
except:
print "uso: translate /ruta/archivo"

Ahora solo hay que copiar en un editor de texto plano lo que desean convertir, guardarlo y ejecutar el script dándole la ruta al archivo. Si alguien se pregunta por que no utilice el método translate de string, la razón es que la función maketrans no acepta caracteres unicode.

El script tiene algunos defectos como el no manejar excepciones en caso que el archivo en path no exista, solo funciona con este tipo de letra y en cada iteración crear un nuevo string. Como siempre todas las criticas son bienvenidas.

Si no tienen instalado el interprete python, pueden usar este “codificador/decodificador” Wingdings XDDD, esta escrito en javascript así que si usan demasiado texto puede bloquearse.