#Snippets: BasicHTTPAuth en ExpressJS >= 3

Si tienes una app en ExpressJS que quieras proteger con contraseña de accesos foráneos no deseados, simplemente haz como en el snippet a continuación (en tu app.js):

URL - https://gist.github.com/Jmlevick/5807252

[QuickTip] Cómo pausar aplicaciones en Linux

Recientemente, nos tocó enterarnos de las "novedades" de OS X 10.9 "Mavericks". Una de las supuestas "novedades" es algo interesante que desde siempre se ha podido hacer en Linux: Pausar Aplicaciones ondemand.

¿Para qué nos sirve esto? Bueno, pues para evitar que una aplicación nos consuma recursos si no se está usando mientras el ordenador tiene cargas drásticas de trabajo. En una laptop incluso ayuda al ahorro de energía. ¿Cómo podemos hacerlo? Sencillo:

Método por consola

La pausa de aplicaciones se logra por medio de algo que se llaman "PID's" o Identificadores de procesos. Si te gusta usar la consola como a mí, puedes hacer esta gestión con 2 simples comandos:

1.- pgrep aplicación/daemon

(Ejemplos: "pgrep firefox/pgrep sshd"). Nos permite saber el PID de una aplicación determinada. Apps "multiproceso" como Chrome nos devolverán varios, pero el primero es el proceso padre, es decir, el que nos interesa.

2.- kill -19 PID 

Pausa la aplicación

3.- kill -18 PID

Reanuda la aplicación

Método Gráfico

Si lo tuyo no son las terminales, entonces puedes hacerlo también en modo gráfico. Por ejemplo, en el monitor del sistema de KDE, le das con el botón secundario al proceso deseado y le mandas la señal de STOP, CONTINUE o cualquiera de las disponibles según te sea necesario:

En este caso si se trata de una app multiproceso, el proceso padre (es decir, el que nos interesa en realidad) es aquél con el ícono de la aplicación representándolo. Me imagino que en el task manager de otros escritorios pasa lo mismo.

OS X Mavericks: ¿Porqué le copian a Linux? (Qué deshonor)

OS X 10.9 "Mavericks" fue una de las grandes estrellas en el WWDC 2013, Lo curioso es que uno espera que una versión nueva de un sistema operativo (sobretodo el que presumiblemente se llama a sí mismo "El más avanzado del mundo" venga cargado de apantallantes funciones nuevas, pero no es así. sus "novedades" dan mucho a qué criticar, sobretodo para nosotros, los amantes del S.O. Libre. Veamos porqué:

1) Etiquetas

OS X viene con un "mejorado" sistema de etiquetas para poder encontrar archivos y carpetas en base a su tag en el disco duro. Esta funcionalidad la tenemos desde hace varias versiones en KDE dentro del mundo libre y funciona gracias a un sistema unificado que Mac OS podría fácilmente envidiar: Nepomuk.

2) Pestañas

¿Es ENSERIO? Ahora parecen XFCE 4.10 jajajaja, una de las cosas que presentaron como "nueva feature" en la conferencia de Apple fueron "pestañas para el finder" ¡Al fin! Esperen... ¿No las tenía? otra adición que previamente se hizo a un proyecto libre (Thunar de XFCE 4.10) y ahora la vemos en OS X. (Y bueno, no es tan sorprendente considerando que tampoco tienen una split-view para poner 2 apps a mitades de pantalla sin necesidad de un programa externo).

3) Soporte Full Screen para apps en multi-monitores

Díganme si estoy mal, pero esta no fue una de las principales mejoras que se integraron a Gnome Shell en la 3.6 por petición popular? De esto no estoy muy seguro, pero me parece que también es un ripoff del software libre.

4) Tele como Monitor

Eso ya se puede en Linux, (al menos si usas KDE que es donde lo he visto) con un cable HDMI sin mayor problema O.o ¿Novedad?

5) Notificaciones estilo Gnome-Shell

Ahora OS X te permitirá contestar tus notificaciones (chat, sociales, etc) directamente en la misma notificación, tal y como puedes hacerlo desde el principio de los tiempos en Gnome Shell.

6) Al fin podemos pausar Apps

Así es, pausar aplicaciones para que no consuman recursos si las tenemos en segundo plano. Lo mismo que podemos hacer desde hace eones en Linux con los PID's: 

kill -19 [PID] PAUSA
kill -18 [PID] REANUDAR

Finalizando...

Es sorprendente cómo esta versión de OS X (y más recientemente todas después de Lion), o incluyéndolo un poco quizá, han dejado de innovar para pasar a simplemente copiar. Quizá se deba a que ahora se quieren centrar en el mundo del mobile, o quizá se debe a que Steve Jobs ya no está en Apple, pero sea como sea, es un poco deshonrroso (al menos a mi manera de ver) el salir y decir: "Miren! Sólo copiamos sin aportar, no tenemos más ideas" Pero por un lado también lo podríamos considerar un halago al software libre... Qué opinan ustedes?

#Snippets: Publicar un nuevo Gist mediante Javascript

¿Se han preguntado cómo funciona el API del servicio de code snippets de Github? (El mentado Gist); Pues yo sí. Aquí está un snippet con el que podrán postear un nuevo Gist anónimo mediante Javascript, poniendo el código en una textarea, seleccionando el lenguaje y otros atributos como la descripción y visibilidad después. Nos soltará la URL del Gist creado y la abrirá en una nueva ventana para nosotros:

URL: http://gist.github.com/Jmlevick/5781079

#Snippets: Google Drive Uploader/Selecter con HTML y Javascript

Con el snippet a continuación, pueden integrar Google Drive a una aplicación/web por medio de un uploader/selecter usando sólo HTML y Javascript, permitiéndoles obtener las URL de los objetos deseados para manipulación:

https://gist.github.com/Jmlevick/5781122

HTML-Recorder: Grabando audio con Javascript en el navegador

NOTA: Sólo funciona en Google Chrome

Hace rato armé una mini-app open-source que puse en Github la cual quiero presentar aquí: Se trata de HTML-Recorder, una mini-aplicación que nos permite grabar audio con el micrófono del usuario directamente en el navegador usando Javascript y tras terminar la grabación nos permite descargar la misma en un archivo de audio WAV.

Si quieren descargar el proyecto, contribuir y demás, no olviden checarlo en su página oficial en Github:

HTML-Recorder en Github

Automatizar tareas periódicas en Rails/Linux (no capistrano)

NOTA: Tutorial para servidores de/en producción

Ahorita estoy trabajando con algo bastante tedioso: Listas de correo. El problema con ellas es que sin importar cuánto las valides y limpies, siempre hay un correo que no se envía por error de formato en la dirección de Email.

El caso es, que cuando hay un error de estos y estás enviando un newsletter de forma automática a muchas personas, el envío se detiene y hay que hacer circo maroma y teatro para reanudarlo (encontrar el newslettter con correo érroneo, el índice de dicho correo, limpiarlo de la base de datos de correo, descartar todas las direcciones a las que ya se les envió además de esa y volver a empezar son solo algunas de las tareas a realizar), y hay que estar 100% al pendiente de cuando un error suceda para hacer toda la gestión de reinicio.

Afortunadamente, hay una manera de automatizar este proceso sin necesidad de que una persona esté checando el servidor a cada rato y aplique todo el proceso explicado arriba: Cron. El problema con Cron es que su sintaxis es HORRIBLE y difícil tanto de escribir como de entender (hasta cierto punto) Por suerte, en Rails tenemos una gema que se llama "whenever", la cual nos permitirá automatizar este tipo de tareas en el servidor.

Para usarla simplemente agregamos a nuestro Gemfile lo siguiente:

 gem 'whenever', require: false

Hacemos bundle install y luego corremos:

bundle exec wheneverize

eso nos creará un archivo llamado "schedule.rb" en nuestra carpeta "config" de la aplicación, en el cuál podremos añadir todos los cronjobs que requiramos para la aplicación con una dulce sintaxis ruby (ver el código comentado en dicho archivo para ejemplos o leer la documentación de la gema por acá).

Un ejemplo del mío:

La primera línea define dónde deberá guardarse el output resultante de correr los cronjobs y las demás son cronjobs programados. El primero corre una rake task cada día en un tiempo específico del mismo y el segundo cada 2 minutos corre un método llamado "scruffy" que se encuentra definido en mi application.rb y se encarga de hacer en automático toda la gestión de "reenvío en caso de falla" de la que les hablé arriba.

Ya definido este archivo con lo que queremos, tenemos que correr los siguientes comandos:

1. bundle exec whenever
2. whenever -i
3. crontab -l

El primero debería soltarnos la sintaxis cron de los cronjobs que definimos en ruby o si algo está mal un error indicándonos qué línea corregir. El segundo escribirá la crontable para dichas definiciones y el tercero nos mostrará la nueva crontable ya escrita.

Ahora tenemos que hacer ejecutable un archivo que encontraremos en la carpeta "script" de nuestra aplicación Rails y se llama "rails" precisamente:

Finalmente, reiniciamos cron y nuestro servidor (yo uso Nginx) con los siguientes comandos:

1. sudo service cron restart
2. sudo service nginx restart

y habremos terminado, revisamos nuestra aplicación para asegurarnos de que el comportamiento automatizado deseado se esté ejecutando cuando lo pedimos y eso es todo, automatización al instante en Rails.

TTACK Malware en Rails [SOLUCIÓN]

  

Ayer que fui a revisar un servidor Rails que monté hace tiempo, me di cuenta de que cuando booteaba el localhost me aparecía un código inyectado (en la consola) que se veía así:

<html> 
  <head>
    <title>ttack.tk</title>
    <meta http-equiv="refresh" content="2; URL=http://domain.dot.tk/p/?d=TTACK&i=201.156.231.200&c=52&ro=0&ref=unknown&_=1370450779247"/>
    <script type="text/javascript">
    <!--
      function redir(){ var $fwd = 'http://domain.dot.tk/p/?d=TTACK&i=201.156.231.200&c=52&ro=0&ref=unknown&_=1370450779247'; if(window.parent){ window.parent.location=$fwd; }else{ window.location=$fwd; }}
    //-->
    </script>
  </head>
  <body onload="redir()">
    <script language="text/javascript">
    <!--
      window.setTimeout('redir();', 500 * 1);
    //-->
    </script>
  </body>
</html>

Y resulta que investigando un poco descubrimos de que se trata de un malware en la gema "gemattack" de Rails. Esta gema no se estaba usando explícitamente en la aplicación pero era dependencia de una que sí estaba usando: "mongoid_search". La solución resultó ser actualizar dicha gema con:

bundle update mongoid_search

Tras una rápida visita de bundler a github y rails gems, un download de nuevo código y "rebundle" de mi stack (todo hecho con el comando de arriba) el problema había desaparecido.

Coffeescript Express: Aprende a programar en 20 minutos

¿Qué es Coffeescript?

Coffeescript es un lenguaje de programación de alto nivel con una sintaxis muy limpia (muy fácil de escribir y leer) que compila a Javascript ("se vuelve" javascript); Coffeescript es Javascript, pero es muchísimo más fácil de aprender y manejar que el segundo. Si no sabes qué es Javascript, la manera más fácil de explicarlo es:

Javascript es el lenguaje de programación del navegador, el lenguaje que potencia (en mayor medida) a la web actual.


¿Porqué Aprender Coffeescript?

Sencillo: Porque actualmente no hay lenguaje en más auge y necesidad de uso que Javascript. En un mundo que se rige por la web, no puedes permitirte no saber Javascript si quieres ser programador y Coffeescript es la mejor manera de manejarlo. Además, saber Coffeescript te dejará listo para entender y usar prácticamente cualquier lenguaje de alto nivel moderno, llámese Ruby, Python o cualquier otro que quieras añadir a la categoría.

¿Cómo instalar Coffeescript?

Primero instala NodeJS con npm. Una vez que tengas estos 2 en tu computadora, instalar Coffeescript es tan fácil como hacer:

npm install -g coffee-script

En terminal y listo (Usuarios de Linux, no olviden usar sudo, para Mac creo que igual es necesario).

Luego podrás acceder al intérprete de coffeescript en terminal usando el comando "coffee" que también te permitirá compilar tus archivos ".coffee" a ".js" rápidamente.

Lo básico de Coffeescript

Tipos de Datos

Comentarios

Se trata de pedazos de texto que no se ejecutan ni se toman en cuenta en un programa, sino que más bien sirven para explicar nuestro código dentro de un script. Un comentario en Coffeescript se ve así:

# Hola, soy un comentario

Variables

Se trata de "contenedores" para almacenar con un nombre fácil de recordar cualquier tipo de dato u objeto. una variable que guarde el nombre "Xenode Systems" se vería así:

empresa = "Xenode Systems"

Cabe destacar que las variables son dinámicas. esto quiere decir que si declaras una variable y después más abajo en tu programa la vuelves a declarar, esta cambia al segundo valor al llegar a esa parte en la ejecución del código y mantendrá el último valor asignado.

Strings

Son cadenas de texto. Todo tipo de texto que vayas a ocupar dentro de un programa de computadora debe ir como una string, es decir entrecomillado con comillas dobles. Veamos un ejemplo:

"Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."

Es importante usar comillas dobles tanto como se pueda, en lugar de simples. Las comillas dobles nos permiten entre otras cosas, usar apóstrofes y comillas simples dentro de un texto sin cerrar la string, concatenarlas con la sintaxis de ruby (veremos eso más adelante) y demás cosas interesantes.

Integers

Se trata de números enteros (sin punto decimal) tales como 1, 2, 10, 60, 900

Floats

Se trata de números con punto decimal, tales como 1.2, 2.5, 10.3, 6.90, 3.1416

Arrays

Son un contenedor de cualquier tipo de objetos, cuya función es guardar cada uno de los objetos adentro en una lista ordenada por índices, un ejemplo sería:

["Pera", "Manzana", "Naranja"]

Ahí arriba tenemos un array que contiene 3 strings, y cada una de estas tiene un índice comenzando por el cero. Esto quiere decir que "Pera" es el "objeto 0" dentro del array, "Manzana" es el 1 y "Naranja" es el 2.

Ranges

Los ranges son rangos precisamente, y se trata de una forma más corta de escribir un array, (por decirlo de alguna manera); Por ejemplo, si yo quisiera hacer una serie de números del 1 al 100 dentro de un array la manera más sencilla de lograrlo sería con un rango, que se vería así:

serie = [1..100]

Esto compilaría a un array que contendría todos los números del 1 al 100 evitándonos el tedio de escribirlo a  mano.

Hashes

Los hashes son conocidos como "diccionarios" en otros lenguajes, y en lo que a javascript respecta son "objetos JSON". Sirven para guardar una relación del tipo "clave : valor" entre objetos y en Coffeescript escribirlos es tan sencillo como hacer uso de la indentación (hablaremos más adelante de esto último), veamos como:

empleados =
  decano:
    nombre: "Lisa Cuddy"
    edad: 40
  contador:
    nombre: "Edward Vogler"
    edad: 52

Eso de allá arriba nos crearía un hash llamado "empleados" donde tendríamos a los empleados ordenados por función y de cada uno tendríamos acceso a los valores "nombre" y "edad" para trabajar en nuestro código. Nótese que indentamos con 2 espacios para las funciones y con otros 2 espacios para los datos de nombre y edad, creando una especie de nesting acomodado. Esto es vital cuando escribimos hashes (el nesting), de otra manera no funcionarán. En el caso de arriba, nuestras claves son las funciones de cada empleado y su valor es otro hash que incluye los datos "nombre" y "edad" respectivamente para c/u.

Booleans

Simplemente hay 2: true y false, cada uno representando a cierto y falso respectivamente dentro de un programa.

Operadores Matemáticos

+ más: suma 1 + 2 = 3
- menos: resta 5 - 3 = 2
* por: multiplicación 2 * 3 = 6
/ entre: división 9 / 3 = 3
= igual: igualdad 0 = 0
% módulo: devuelve el residuo de una división 20 % 3 = 2

Métodos/Funciones:

Los métodos o funciones en programación son bloques de código que se ocupan para un fin, más que nada para automatizar cosas. Un ejemplo de una función Coffeescript:

sum = (number1, number2) ->
  result = number1 + number2
  console.log(result)

Primero tenemos una variable que guarda la función, esto le da un nombre a la misma. Luego tenemos los argumentos de esa función, esto quiere decir, los datos que manejará expresados como variables. Más tarde tenemos el símbolo de función que hace que precisamente se defina la función y finalmente tenemos el código de la función o lo que queremos que haga.

La función de arriba está pensada para correr en consola y lo que hace es sumar 2 números cualquiera y devolvernos el resultado en la consola.

Para correr una función (la del ejemplo específicamente) en nuestro código colocaríamos una línea como esta:

sum(10, 63)

Primero "llamamos" el nombre de la función y le pasamos los argumentos que queremos que maneje al correr; de manera que esos usará para cumplir con lo que su código del interior le dicte.

El código de este pequeño script se vería así:

Como podrán ver allá arriba, al correr el script con el comando "coffee" en terminal nos devuelve el resultado esperado.

Loops:

Un loop es una "secuencia de código" que se corre por cada uno de los elementos dentro de una colección de objetos (un array generalmente). Un ejemplo sería:

array = [1, 2, 3, 4, 5]

for n in array
  console.log(n * 2)

Este loop de arriba lo que hace es tomar los elementos de un array y multiplicarlos por 2, dándonos el resultado en consola. El output es el siguiente:

Los loops empiezan con un for, luego toman una variable cualquiera (elegida por nosotros) que representa a c/u de los objetos dentro de un array/colección y luego sigue la palabra in, seguida del nombre de la colección o array. Luego de definirlo, ponemos abajo e indentado (con un whitespace de 2 espacios) el código que deberá correr el loop. En español, entenderíamos la definición de un loop (el de arriba por ejemplo) como:

por cada número en array haz lo siguiente

Hay otros tipos de loops, un ejemplo es el loop que se crea con la palabra "while" en lugar de for... Pero no veo necesario explicarlo, estudiar eso corre por tu cuenta, (si es que alguna vez lo necesitas).

Splats

Los splats son otro tipo de dato que se puede utilizar en Coffeescript. Se trata de "contenedores" que nos sirven para pasar múltiples valores/variables como argumentos para un método. Un ejemplo práctico sería un programa de una tómbola arreglada. Supongamos que tenemos una tómbola con varios participantes y decimos que quienes saquen los números 42 y 64 son los ganadores indiscutibles de los premios del concurso... Para esto queremos que nuestros amigos Juan y Pedro sean los ganadores sin importar los demás participantes... Veamos entonces cómo programaríamos esto en Coffeescript:

Vamos por partes aquí:

Primero definimos la función de tómbola (rifa_arreglada) que tomará como argumentos al primer y segundo participantes además de los demás (nótese el splat "otros..." en los argumentos). Luego lo que hará esta función será correr la subfunción resultados una vez por el primer participante, (asignándole a propósito el número 42) otra por el segundo (asignándole a propósito el número 64) y finalmente una más por cada uno de los restantes, asignando un número aleatorio a c/u de ellos; (Nótese el "loop" de "for persona in otros" allá arriba).

El loop lo que hace es agarrar y por cada persona dentro de el splat "otros..."  asigna un número aleatorio que saca corriendo el código de las líneas 7 y 8, finalmente corre la subfunción resultados para soltar el número asignado en consola una vez por c/u de los otros también.

La subfunción resultados lo que hace es tomar 2 argumentos: persona y number y lo que hace es soltar un string que dice "tal persona se queda con tal número" en la consola.

Luego necesitamos definir nuestra lista de personas, como se ve en el array de la línea 18. Dentro de este array ponemos a Juan y Pedro primero a propósito, pues queremos que ellos tengan los números ganadores.

Finalmente corremos la función de rifa arreglada (línea 22), pasándole como argumento el array/colección de personas. Esto se resuelve en el siguiente resultado/output:

Como veremos, Juan obtuvo el 42, Pedro, el 64 y los demás un número aleatorio no ganador. Si no entienden muy bien esto de los splats déjenme un comment con sus dudas y les explico como sea necesario para que lo entiendan.

Concatenación de strings

Nótese que en la línea 14 de nuestro programa de tómbola arreglada tenemos un código que luce así:

console.log("#{persona} se queda con el #{number}")

Mismo que está haciendo uso de una técnica llamada "concatenación de strings" Lo que es esta técnica básicamente es una "suma" de strings/valores escrita con formato legible; Por ejemplo si yo tuviera las variables nombre y edad dentro de un programa y las quisiera mostrar como parte de un mensaje en consola, haría un código como este:

Nótese el #{} que encierra a las variables dentro del mensaje que soltamos a la consola, así es como concatenamos en Coffeescript. Adentro del #{} Puede ir cualquier expresión de coffeescript que queramos, y esta se unirá como parte de la string elegida (o bueno, su resultado más bien). Vean el output de la terminal en la imagen de arriba para dejarlo más claro.

Condicionales

Los condicionales son los que permiten el control de flujo dentro de un programa y básicamente son aquellos pedazos de código que corren si determinada condición se cumple. Veamos un ejemplo:

number_of_life = 42

if number_of_life is 42
  console.log("The number of life is 42 indeed")
else
  console.log("That's not the number of life")

Este es un ejemplo súper sencillo, pero logra su objetivo. Básicamente el código de arriba declara la variable "number_of_life" y un condicional que dice: si (if) el number_of_life es 42, entonces pon en consola "El número de la vida es 42 precisamente", de otra manera (else) pon "Ese no es el número de la vida". El snippet de arriba nos soltaría (obviamente) el primer mensaje. Otro tipo de condicional que no veremos aquí es unless, pero te toca estudiarlo (si es que alguna vez lo llegas a ver u ocupar).

Whitespace (Indentación)

Como verán en los scripts/snippets de Coffeescript que hemos visto hasta ahora, estos tienen un formato de escritura específico, hay ciertas cosas con "sangría". Esta "sangría" en realidad se llama indentación y define varias cosas, como por ejemplo:

• El cuerpo de una función
• El código a correr en un loop
• El cuerpo de un condicional

etcétera. No hay mucho que decir acerca de esto, excepto que si vas a escribir una función todo su "contenido" debe ir "indentado" con dos espacios (se pueden usar espacios o tabuladores para indentar, pero NUNCA combinados) con respecto a la línea de definición, un ejemplo:

sum = (number1, number2) ->
  result = number1 + number2
  console.log(result)

Lo mismo para el cuerpo/código de un loop:

for n in array
  console.log(n * 2)

Y también para el "contenido" de un condicional:

weather = "Sunny"

if weather is "Sunny"
 console.log("Yay!")

Cuando escribes un programa completo, "indentas y desindentas" según se requiera. Por ejemplo, cuando una línea de código ya no pertenezca a tu función/loop/condicional en cuestión quitas la indentación y si vuelves a hacer otro la abres de nuevo con relación a este segundo. Ejemplo:

Las indentaciones o "whitespace" son necesarias (y obligatorias) en Coffeescript porque de otra manera, los programas no funcionarían y soltarían errores al compilar.

Syntactic Sugar

Esta es una expresión que en español comprenderíamos como "Dulce Sintaxis" y se refiere a ciertas keywords de Coffeescript que podemos utilizar para escribir código que se parece mucho más al inglés escrito que al código de un programa de computadora. éstas son:

is que compila a === (igualdad estricta)
isnt que compila a !== (desigualdad estricta)
and que compila a && (se refiere al término "y", como en la oración "puedes comprar nachos y gomitas")
or que compila a || (se refiere al término "o", como en la oración "puedes comprar chocolates o palomitas")
not que compila a ! (se refiere al término "no" como en la oración "el cielo no es verde")

Cada una de estas keywords hace lo que te imaginarías dentro de un programa, pero para evitar dudas, les dejaré un snippet comentado con ejemplos y el output que suelta cada uno para que se den una idea de cómo es que funcionan a continuación:

Otros ejemplos de dulce sintaxis serían las keywords on y off que representan a los booleanos true y false respectivamente o la palabra of que representa a la palabra in que usamos en los loops. Una tablita de syntactic sugar a continuación:

Operador existencial

Se trata del símbolo ? y lo que hace es verificar si algo existe dentro del programa o no, si bien no se trata de un ejemplo de "dulce sintaxis" específicamente, va de la mano con esta de algún modo. Ejemplos de uso:

OOP (Programación Orientada a Objetos)

Actualmente el paradigma de programación más usado es el de la OOP (object oriented programming) y entenderlo es bastante sencillo gracias a Coffeescript. Antes que nada, debemos explicar que la OOP se centra en una filosofía de que, (al igual que en el mundo real) Todo es un objeto dentro de un programa de computadora. En un escenario simple, un "empleado" es un objeto del ente "Persona" que puede ser una subclase del ente "Empresa" dentro de un programa empresarial, ¿se entiende? Veamos entonces:

Supongamos que queremos escribir un programa para una tienda de mascotas. Uno de los "objetos" que existiría dentro de dicha tienda serían (obviamente) los animales. Para hacer nuestro programa con un paradigma de OOP, Tendríamos que definir a nuestro ente "Animal" por medio de una clase, y le podríamos poner subclases para cada uno de los animales que haya en la tienda.  Luego podríamos hacer métodos y demás cosas interesantes con ellos. En código, esto se ve así:

Vamos por partes:

Primero declaramos la superclase "Animal" (nótese que todas las clases empiezan con mayúscula). Una clase debe de (a fuerza) llevar un constructor, que es como una función pero que en lugar de un "=" lleva ":" en su declaración y sirve para precisamente construir objetos de una clase determinada, (crearlos). A esta "función especial" le pasaremos como "variables de instancia" (es decir, variables con un arroba enfrente) todos los datos que queremos que lleve un objeto de la clase, en este caso sólo estamos requiriendo el nombre del animal. Las variables de instancia no son más que variables con un @ enfrente y la peculiaridad que tienen es que se extienden (quiere decir, que están disponibles para) a todos los objetos de una clase, podemos agregar tantas como creamos necesarias a nuestro constructor.

Cabe destacar que, (como verán arriba) todas las funciones/métodos de todas las clases llevan ":" en lugar de "=" en su definición. Luego de declarar el constructor, podemos empezar a escribir métodos/funciones propias de esa clase como el "makeNoise" de allá arriba en Animal.

Una vez que tenemos toda una "clase madre" definida con su constructor y métodos deseados, podemos generar unas subclases que hereden todos los atributos de la clase madre (como por ejemplo sus métodos) disponibles pero que también puedan tener sus propias características, en este caso creamos 2 subclases: Dog y Cat, dándoles a cada una la característica de "extender la clase Animal" (osea tener todos sus métodos y características además de los suyos propios) y les definimos su propio método makeNoise que toma las características del makeNoise de la clase madre (gracias a la keyword super) y que aparte permite definir directamente el sonido propio de cada animal.

Luego inicializamos los objetos "dog" y "cat" (creamos objetos nuevos para una clase) asignándoles una variable y les pasamos como argumento (por eso del constructor de Animal) el nombre que queramos que el animal tenga.

Más tarde hacemos que nuestros objetos recién creados corran su método "makeNoise" y si nos damos cuenta lo que este método hace (línea 6) es poner un mensaje en consola que dice "Animal hace tal Sonido". El output del snippet de arriba es el resultado de toda nuestra construcción de clases y se puede ver en el screenshot de allá arriba.

Compilando Coffeescript a Javascript

Hay muchas maneras, y también está una opción para hacerlo en tiempo real, sin embargo yo siempre he encontrado el siguiente workflow muy cómodo:

Hacemos un directorio (carpeta) que se llame "coffee" y otro que se llame "js", Trabajamos todo en el directorio coffee en los diferentes archivos que vayamos a ocupar y luego los compilamos a sus contrapartes javascript para poderlos usar en nuestra app/web. Más tarde podemos mover el directorio de coffee fuera de la app/web si así lo deseamos. Para hacer este tipo de compilación (estando en consola dentro de la carpeta del proyecto que contiene tanto los directorios "coffee" como "js") usaríamos el comando:

coffee -o js/  -c coffee/

Y listo. eso compilaría todos los archivos coffeescript dentro del directorio "coffee" a sus contrapartes en javascript guardándolas en el directorio "js" mencionado anteriormente. Otra manera (la mejor para rendimiento) de hacer la compilación es compilar todos los archivos ".coffee" dentro de un directorio a un solo archivo javascript que será el que incluyamos en nuestra aplicación para evitar que el navegador haga varias requests cuando cargue nuestra app/web. Esto se logra con el comando:

coffee -j js/application.js -c coffee/*.coffee

Esto lo que haría sería compilar todos los archivos con extensión .coffee que estén dentro de nuestro previamente mencionado directorio "coffee" a un solo archivo llamado "application.js" que se guardará en nuestro directorio "js".

Diálogos Javascript

Una de las cosas que nos permite escribir programas más rápido y ver los resultados de nuestro aprendizaje interactivamente es escribir Coffeescript para correr en el navegador. Esto se hace como lo hemos visto, pero también podemos usar los métodos:

alert: Sirve para mostrarle un mensaje al usuario y éste debe confirmar que ya lo leyó para hacerlo desaparecer.

Ejemplo:

alert("Bienvenid@, por favor siéntete libre de disfrutar de nuestro sitio web.")

prompt: Sirve para pedirle algún dato (que se vuelve string) al usuario

Ejemplo:

nombre = prompt("¿Cuál es tu Nombre?")
alert("Tu Nombre es #{nombre}")

confirm: Sirve para obtener respuesta a una pregunta estilo "Sí/No" por parte del usuario con botones de "Aceptar" y "Cancelar" que evalúan a true y false respectivamente.

Ejemplo:

respuesta = confirm("¿Te Gustan los Chocolates?")
if respuesta is true
  alert("Yummy! a mí también!")
else
  alert("Qué lástima...!")

Práctica: Juego Jigsaw

¡Basta de teoría! Veamos en vivo cómo se aplican los conocimientos adquiridos aquí para hacer un programa en Coffeescript, video a continuación:

Código fuente de la JigsawApp

Tareas

Intencionalmente, dejé un tema fuera de este curso. Se trata del switchcase y es algo que se hace mucho en Javascript. Les queda de tarea buscar y estudiar qué es un switchcase y cómo implementarlo con Coffeescript, ¡Suerte!

Continuar tu aprendizaje

No hay mejor continuación a este mini-curso que nuestro tutorial de Aprendamos juntos Coffeescript. Si te interesó el tema, pásate para allá para continuar aprendiendo.

Datos interesantes, enlaces de interés

Js2Coffee

Se trata de una web donde puedes transformar "al vuelo" código javascript a coffeescript y viceversa, ¡Bastante útil!

Coffeescript Cookbook

Como su nombre lo indica, el libro de recetas de Coffeescript. Si algún día tienes una duda de cómo hacer algo en Coffeescript, lo más seguro es que la respuesta (o varias respuestas que te guiarán a la final) estén ahí.

Sitio web de Coffeescript

Aprende más sobre Coffeescript en su sitio web oficial y además, tienen un intérprete/ejecutor en tiempo real para el lenguaje, cosa que es muy divertida (Con lo que hicimos la práctica de Jigsaw).

Sujeto, Verbo, Adverbio

Hay una cosa de programación que me faltó explicar aquí y que considero muy útil. Se trata de mi concepto "Sujeto, Verbo, Adverbio" y básicamente es un concepto que explica las expresiones de programación como si de enunciados en español se tratase. Tomemos de ejemplo esta expresión de jQuery escrita en Coffeescript:

$("div#mydiv").slideToggle("slow")

No voy a explicar qué es jQuery ni mucho menos, sino el concepto como tal:

Ahí arriba tenemos una expresión de programación. Ésta consta de un Objeto a manipular/cambiar, un método que se encarga de hacer la modificación/acción y un argumento que dice cómo hacerlo. Básicamente es como una oración en español donde nuestro objeto a manipular es el Sujeto (qué manipular), el método que le pasemos para manipularlo sería como el verbo (qué hacerle al sujeto) y finalmente tenemos el argumento que es como un adverbio (cómo aplicar el verbo). Lo que hace la función de arriba es tomar la capa con id "mydiv" dentro de una página web y hacer que "aparezca deslizándose" poco a poco, de manera lenta para más impacto. Si entiendes este concepto, programar en cualquier lenguaje de alto nivel se te hará muy sencillo.

Y pues bueno, con esto llegamos al final de nuestro mini-curso "Coffeescript Express"; Y aunque es un tutorial que se aprende en 20 minutos escribirlo tomó varias horas, por lo que si te gustó o aprendiste algo, no te olvides de apoyarnos con un tweet antes de irte:

Aprendí a programar en 20 minutos con el tutorial "Coffeescript Express" de @xenodesystems http://bit.ly/134UMEl - Tweet!

[SOLUCIÓN] Lag en Youtube a Pantalla Completa (en Chrome) #Linux #Mac #Windows

Desde hace semanas me estaba viendo afectado por un bug bastante molesto en las versiones de Chrome de la serie 20 (en adelante); La cosa era que si quería ver un video de youtube a pantalla completa (principalmente si era de alta resolución o en "3D" como algún gameplay) experimentaba un lag tremendo. ¿La solución? ¡Desactivar Flash Pepper! para hacerlo, nos vamos a chrome://plugins/ y tras expandir los detalles desactivamos el complemento de Flash Pepper como se muestra a continuación:

Con eso ya no experimentaremos este molesto problema. Lo que hace este tip es obligar a chrome a utilizar la versión de flash nativa que esté instalada en tu sistema en lugar de su problemática adaptación pepper, logrando así un mucho mayor rendimiento con el propio de Adobe. Sólo nos queda reiniciar Chrome y eso es todo, asunto arreglado.

Estamos acostumbrados... (Las viejas computadoras y porqué amo GNU/Linux)

Hoy en día estamos acostumbrados a que "el mouse" mueva el cursor en pantalla, a que si haces doble click en la parte superior central de una ventana esta se agrande y a que si abres Chrome y luego Gimp el segundo se sobrepondrá al primero.

Estamos acostumbrados a que si doy click y muevo la barra de scroll del lado derecho de la pantalla la página hacia abajo sin soltar el botón del mouse esta página bajará. Estamos acostumbrados a que si doy click y no suelto al tomar una ventana al mismo tiempo que la muevo, esta se arrastrará con el ratón. Estamos acostumbrados a que el color principal de los sitios web, los editores de texto, los programas de diseño y demás, sea el blanco (en los lienzos) Estamos tan acostumbrados a todo esto que te apuesto a que leer esta redacción te ha parecido algo extraño pero lógico. Y lo es.

La cosa es, que no siempre fue así. Hubo un tiempo en que las computadoras no eran más que terminales de texto sin periférico alguno, ¡ni siquiera mouse!. Hubo un tiempo en que el mouse sólo se movía de arriba a abajo o de izquierda a derecha y no por toda la pantalla. Hubo un tiempo en el que siquiera pensar en usar blanco para el color del fondo del monitor era INAUDITO y también donde el hecho de ver un pixel en pantalla era algo DE OTRO MUNDO.

Todo esto lo escribo porque (como ya les había contado antes) estoy leyendo la biografía de Steve Jobs y me sorprende cómo es que este hombre, junto con muchos otros soñadores y ambiciosos ayudó a crear el mundo informático de hoy en día. No es que steve jobs inventara cosas, es un visionario más bien. El hecho de que un monitor renderizara en mapas de bits (pixeles a color y blanco y negro) se lo debemos a una compañía que por su tiempo, no supo rentabilizar la tecnología que habían creado. Esta compañía probablemente la conozcas, se llama XEROX y al día de hoy sólo hace fotocopiadoras y otros cacharros no tan geniales jajaajajaja. Para cuando Xerox ya manejaba cosas tan geniales como el mouse, los monitores a colores o las interfaces gráficas, la compañía de Steve Jobs (Apple) sólo hacía programas en modo texto y computadoras sólo capaces de correr estos últimos. Steve Jobs logró hacer que Xerox "subiera el telón" de sus avances informáticos para el, y el día en que esto sucedió se llevó a cabo el más grande caso de "atraco industrial" de la historia. Mucha gente dirá (tanto los que hayan leído el libro como los que apenas saben de esto) que Steve es un maldito, es un ladrón, es un "tipo malo" pero podemos asegurar con toda certeza que este robo no hizo más que beneficiar al usuario. De no haber sido por este atraco, todas (si no es que la gran mayoría) de las cosas que mencioné arriba probablemente no hubieran existido o no hubieran sido posibles, ya que gracias a las ideas altamente "capadas" (es decir, demasiado limitadas) que Steve Jobs vio en Xerox, fue que pudo lograr que su equipo de ingenieros crearan lo que hoy en día prevalece a grandes rasgos en el campo de la UX (user experience) de todos los sistemas operativos actuales. Steve Jobs y sus ingenieros volvieron posibles esos pequeños detalles de funcionalidad que por haber nacido en los tardíos 80's o después, no eres capaz de apreciar como algo único (jajajaja) Esas pequeñas cosas que hacen que las computadoras funcionen como lo hacen, de la manera en que nosotros esperamos a que lo hagan. En aquellos años, las siguientes cosas se consideraron GRANDES HAZAÑAS DE INGENIERÍA:

• Poder hacer que las ventanas se superpusieran en pantalla
• Poder hacer que el "fondo" del monitor fuera blanco
• Poder hacer que un mouse funcionara con una bola para ir en todas direcciones
• Poder hacer que se pudieran arrastrar ventanas
• Se pudiera hacer una PC "All-In-One"

Todo eso se lo debemos a los valientes e inteligentes ingenieros de Apple, (a unos cuantos nada más, en especial uno llamado Bill Atkinson) ya que ellos fueron capaces de mirar más allá y crear cosas que EN SU TIEMPO, eran "Imposibles" (Un ejemplo, el mouse de bola, ese viejo mouse PS/2 que todos recordamos con cariño). Como bien nos dice Atkinson:  "Simplemente lo hice porque creí haberlo visto en algún lado, no sabía que se consideraba imposible" (Hablando del stacking de ventanas).

Este capítulo del libro me dejó 4 principales enseñanzas:

1. Muestra tus ideas, por más buenas que parezcan, alguien puede ver puntos que tú has dejado al aire
2.  Es bueno recibir feedback, pero no juegues al imbécil (¡Que no te pase lo que a Xerox!)
3. NADA es imposible
4. Ama a GNU/Linux

¿Porqué este último? Bueno, como ustedes saben, este es un blog en su mayoría, linuxero. Hace tiempo les hablaba de cómo "se trata de COMUNIDAD no comodidad" en uno de mis posts, y éste nuevo post viene a reforzar dicha idea. Si tú usas o has usado linux en alguna ocasión, quiero que pienses mucho en  como si para todos estos tipos de Apple se les hizo completamente una hazaña hacer este tipo de cosas bajo presión, con un sueldo y demás (igual a los de Xerox), cómo de grande, basto, precioso e incluso único es GNU/Linux... Estamos hablando de que nadie le pagó de primera instancia a ningún developer opensource que empezó con un proyecto y mira hasta donde hemos llegado. No es que apple haya "liberado ese código" o que Microsoft se haya visto "benevolente" o que cualquier otra compañía de pronto sin más lo regalase; Es de idiotas y novatos ver a linux como algo "limitado" cuando ese jueguito o programa estúpido de Windows no logra correr bien sin X Y o Z arreglos, SIN EMBARGO, antes de pensar en esto quiero que veas tu escritorio, quiero que veas tu lista de apps, quiero que veas a Steam... Ve todo eso, TODO ESO y luego ve más allá. Ve como Xorg hace que tu monitor prenda, ve cómo el kernel hace que tu hardware esté listo sin drivers, ve cómo es que bash te permite gestionarlo todo desde una consola... VE TODO ESO también, velo. Piensa cuánto has pagado por ello. Piensa cómo de versión en versión todo mejora, todo aumenta, todo se vuelve más eficiente... Ve todo eso, razónalo; Y LUEGO, luego dime si GNU/Linux no es hermoso.

¡Viva el Software Libre!

Configuración YAML en Rails: "Un archivo para gobernarlos a todos"

Cuando se desarrollan apps en Rails, notarán que a veces se ocupan ciertas variables una y otra y otra vez a lo largo de la aplicación (de manera global) en ciertos casos. Ejemplos de estas variables son los "secret tokens" que usamos para autenticar algunas requests por sólo citar un ejemplo. Cuando requerimos usar este tipo de configuración, lo más fácil, rápido y sencillo es guardarla dentro de un archivo YAML.

Veamos cómo funcionan:

1) Crear un initializer

Lo primero que hemos de hacer para lograr este truco es un initializer que nos permita cargar el archivo YAML en cuestión. este archivo debe estar en config/initializers/load_app_config.rb (puedes usar cualquier nombre que quieras en lugar de load_app_config) y su contenido debe ser algo parecido a esto:

raw_config = File.read(Rails.root + "config/app_config.yml")
APP_CONFIG = YAML.load(raw_config)[Rails.env].symbolize_keys 

Este archivo lo que hace es decir dónde está nuestro archivo de configuración global YAML y cómo cargarlo, convirtiendo en símbolos todas las claves que en él haya para nuestro uso más cómodo en la aplicación web. También nos da acceso a la constante APP_CONFIG que usaremos luego.

2) Archivo YAML

El archivo YAML com tal, está en la ruta especificada allá arriba (config/app_config.yml) y su contenido es el siguiente:

development:
  app_email: myapp@somedomain.com
  app_secret: 894e731f70

test:
  app_email: myapp@somedomain.com
  app_secret: 894e731f70

production:
  app_email: myapp@somedomain.com
  app_secret: 894e731f70

Nótese que estamos definiendo 2 variables globales, "app_email" y "app_secret". Tenemos que definir sus valores según el entorno que se esté usando (desarrollo, pruebas o producción) una definición por entorno, de todas las variables que ocupemos.

3) Uso

Ya que tenemos esta configuración lista, iniciamos el servidor de nuestra app (o lo reiniciamos si es el caso) y para ocupar estas nuevas "variables globales" (que en realidad se llaman símbolos en este caso) haríamos algo como lo siguiente:

Si ocupamos apuntar algo hacia el valor de esas variables globales, en lugar de poner el valor como tal, pondríamos algo como

APP_CONFIG[:app_email]

Y en todos lados donde pongamos eso, el valor corresponderá respectivamente a "myapp@somedomain.com" como definimos en el archivo YAML. Esto es importante porque los archivos YAML no tienen porqué cargarse en los repositorios de lugares como Github y similares con sus valores reales, de manera que si vas a compartir tu código y necesitas un archivo de esos para hacer funcionar tu app, puedes llenarlo de "valores dummies" que los desarrolladores interesados deberán cambiar por los suyos propios cuando hagan funcionar la app, y no con los tuyos (recuerda documentar esto en tu README). Ahora solo te falta excluir el YAML real de tu app con git y poner uno "falso" (bien comentado) si vas a compartir tu código y usar este método de configuración global. Por otro lado, el usuario final de la aplicación no puede ver este archivo ya en producción y eso protege cosas como tus secret tokens de los curiosos malintencionados. ¿Buen tip no?

De Bill Gates, y el Nacimiento del Software Privativo

Bill Gates de Joven

Ahorita que estoy leyendo la biografía de steve jobs, me encontré con un pasaje muy interesante que me gustaría compartir:

Allá por los 60's, cuando la informática personal apenas iba tomando forma, los geeks de aquellas épocas se reunían en garages a compartir ideas, noticias y avances tecnológicos entre ellos. Steve Jobs y Steve Wozniak eran atendientes a uno de estos clubes geek, donde se permitía el fácil (y libre) acceso a la tecnología a las personas interesadas.

La cosa es, que los componentes y kits eran muy caros, entonces no estaban al alcance de todos. Cuando el primer kit de lo que podríamos llamar "el precursor del ordenador personal" salió a la venta (El Altair), no tomó mucho tiempo antes de que el club a donde asistían los 2 steves a estas "quedadas" se hiciera con uno. La idea era que si alguien se podía hacer con una pieza o cosa interesante, montaba una presentación que ofrecía gratuitamente para todos los asistentes, de manera que todos se nutrían con conocimiento. La filosofía de ese tipo de clubes era al hardware lo que la filosofía del software libre tal y como la conocemos ahora es para los programas. El propósito central de todo era COMPARTIR, para nada Comercializar.

Sucede que en el club a donde asistían los steves no sólo llegó a aparecerse este kit para el disfrute y estudio de todos los curiosos, sino que también llegaron copias de la versión de BASIC que Bill Gates diseñó para el Altair (Esta es, la precursora de lo que se convertiría en Windows más adelante). Bill Gates no era fanático de la filosofía "hippie" enfocada a compartir conocimiento en estos clubes, y tras enterarse de que las copias de su software llegaron a manos del club a donde asistían los steves, y que la gente estaba compartíendolas entre ellos sin pagar, escribió una carta al club que rezaba:

Cito del libro:

Como la mayoría de los aficionados a la electrónica ya sabrán, casi todos ustedes se roban el software. ¿Es esto justo? [...] Una de las cosas que están consiguiendo es evitar que se escriba buen software. ¿Quién puede permitirse realizar un trabajo profesional a cambio de nada? [...] Agradeceré que me escriban todos aquellos que estén dispuestos a pagar.

Esto es lo que (si no me equivoco), podríamos considerar el nacimiento de la mentalidad detrás software privativo, o al menos su representación más pura con el ejemplo del software privativo más famoso de la historia: Microsoft Windows. ¿Interesante no?

[Concurso] Gana con Xenode (Facebook)

Es un placer para mí anunciarles hoy el inicio de nuestra serie de concursos "Gana con Xenode". Estos concursos se llevarán a cabo por medio de nuestra página de facebook y se darán diferentes premios. Se puede participar desde cualquier país, sin importar la edad y el envío de los premios no tendrá costo para los ganadores. A continuación un video explicativo de los concursos:

Si aún no nos sigues en Facebook, este sería un buen momento para Hacerte Fan:

#Snippets: Enumerar records individualmente en las views de Rails

Esta es una técnica útil que me saqué de la manga para ennumerar records  individualmente en las vistas de Rails, srive para mostrar algo así como "Record #1, Record #2, Record #3" etc. en la vista show (o bien, cualquiera) de un record individual de la base de datos en Rails. Mi ORM es Mongoid (en la app donde probé esto)  pero supongo que funciona para cualquier tipo de ORM usando el mismo snippet, no tendría porqué no funcionar (aunque me parece que usando DB's relacionales hay alternativas más elegantes a esta para lograr el mismo objetivo) Veamos entonces el ejemplo:

<% current_id = @object.id
   Mymodel.all.each_with_index do |indexed_object, i|
   if indexed_object.id.to_s == current_id.to_s %>

  <h1>Object #<%= "#{i.to_i + 1}" %></h1>

<% end %>
<% end %>

Creo que el snippet habla por si solo, pero por si no, lo explico:

Primero obtenemos el ID del objeto "actual", (del que queremos obtener su ennumerador) y lo guardamos en una variable llamada "current_id". corremos el loop ennumerador y le pasamos un condicional para que cuando llegue el momento en que se tope con el id del objeto en cuestión añada el número correspondiente a dicho objeto en nuestro H1 que reza algo como "Object #X" (Reemplazando esa X por el número). Nótese que convertimos el índice (variable "i") a número íntegro con el método "to_i" (lo mismo da que la variable se llamase "i" o "index", igual usaríamos to_i no se confundan por las 2 "i") y le sumamos 1, ¿Porqué? Bueno, porque el ennumerador en un array de ruby empieza en 0 y no queremos tener algo como "Venta #0" en nuestra vista generalmente.

Cuentas de correo "@midominio" Gratis: Adiós Google Apps

Como se debieron haber enterado hace ya algún tiempo, Google empezó a cobrar por el uso de Google Apps. El mínimo son 5 dólares por usuario al mes y si bien Google Apps y toda su infraestructura es buena hasta cierto punto, la realidad es que la mayoría de las personas con pequeños negocios lo usaban para obtener cuentas de correo personalizadas del estilo "@midominio.TLD" Dejando del lado cualquier otra feature que pudiesen ofrecer.

La alternativa gratuita de Google Apps era eficaz para este caso de uso con un total de hasta 10 cuentas de correo personalizado gratis por dominio, Ahora que esta opción es de pago (y a mi parecer algo cara) es difícil encontrar una alternativa similar que nos preste estos beneficios sin pagar, pero por suerte existe y viene de la mano de Microsoft y Outlook.com ofreciéndonos no 10, sino 50 direcciones de correo personalizado completamente GRATIS.

Veamos pues cómo obtenerlas:

NOTA: Para poder hacer esto requerirás tener un dominio comprado con cualquier compañía registrante de dominios y acceso a su DNS Manager para crear nuevos records (en este caso uno MX), además de una cuenta microsoft cualquiera para poder acceder al panel administrativo de tu dominio en Live.

Paso 1:

Tenemos que irnos a http://domains.live.com/ para asociar un dominio a nuestro panel live. Iniciamos sesión con la cuenta microsoft que tengamos y damos click en el link de "Introducción" de Dominios Personalizados como se alcanza a apreciar en la imagen a continuación:

Paso 2:

Una vez clickeamos ahí (con nuestra sesión iniciada) seremos llevados a una pantalla donde tendremos que escribir la dirección de nuestro dominio (puede ser cualquier TLD sin problemas) y dejamos marcada la opción de "Configurar Outlook.com para mi dominio" como se muestra en la siguiente imagen:

Damos click en "Continuar" y en la siguiente ventana metemos el captcha que nos piden y pulsamos "Aceptar". Luego de varios intentos por introducir el captcha correcto (jajajjaa) deberíamos ver algo como esto:

Ahí nos explican qué datos debe llevar el registro MX que debemos crear en nuestra consola de administración del dominio. En este tutorial usaré Godaddy como referencia:

Sin cerrar la página previa, abrimos godaddy.com en nuestro navegador y nos logueamos. Accedemos a "Mi Cuenta > Dominios"  y hacemos click en el botón verde de Iniciar. Nos aparecerá algo como esto:

Seleccionamos el dominio para el cual queremos activar el correo y damos click en su enlace, lo que nos llevará a una pantalla parecida a esta:

Donde le daremos click a la algo oculta (pero presente) opción para lanzar el DNS Manager del dominio, cosa que a su vez nos traerá a otra ventana donde podremos añadir registros DNS para el dominio en cuestión. En este caso nos interesa la sección de MX, así que la buscamos y le damos click en "Agregar rápidamente" para luego introducir los datos que Microsoft nos entregó capturas atrás:

Nos vamos hasta abajo y clickeamos el botón de "Guardar archivo de zona". Tras haber guardado el registro DNS correctamente, esperamos unos minutos (puede tardar hasta 1 hora y en casos exagerados incluso 48) y regresamos a la página de verificación de Microsoft (la que no cerramos al abrir godaddy), donde si clickeamos el botón de "Actualizar" en el recuadro amarillo veremos que nuestro dominio fue verificado exitosamente y ahora solo nos queda añadir las cuentas personalizadas que queramos, (hasta 50 por dominio, recuérdenlo). En caso de haber agregado el registro y que tu dominio no se verifique al clickear el "actualizar" en la página de verificación, trata de nuevo 1 hora 15 minutos más tarde, y si no queda, vuelve intentar 24 o hasta 48 horas después.

Paso 3:

Ya que el dominio esté verificado con Microsoft, en la siguiente pantalla que aparecerá podremos añadir nuestras cuentas personalizadas clickeando el botón de "Añadir" que vemos en la imagen de abajo:

Ya que hayamos creado las cuentas que queramos, para acceder a ellas nos vamos a Outlook.com donde podremos usar nuestras recién creadas credenciales personalizadas para acceder a nuestra bandeja de correo personal. los correos que mandemos serán enviados por medio de una dirección del tipo @midominio y también nos podrán escribir a la misma sin ningún problema, pudiendo nosotros checar el correo en Outlook.com (o cualquier cliente de correo o dispositivo que queramos usar) de manera completamente normal; Recordemos que esta dirección de correo tiene las mismas prestaciones y comportamiento de una cuenta microsoft normal, pero con nuestro propio dominio después del arroba.