Cristalab |
- Introducción a MongoDB
- Qué significa que Facebook compre Instagram
- Cómo crear shortcodes en Wordpress
- Barra de navegación adaptable con Media Queries y JS
- Crear un cronómetro con la clase Timer en AS3
- Crea tu placa profesional de pared con Illustrator
- Crea partículas 3D con Particle World en After Effects
- Crear interfaces Serial y Loopback en Packet Tracer
- 10 tecnologías web a aprender en el 2012
| Posted: 09 Apr 2012 08:09 AM PDT MongoDB es un sistema de bases de datos NoSQL orientado a documentos, a diferencia de MySQL, este no es una base de datos relacional. Es open source, lleva entre nosotros desde el 2009. Está escrito en C++ y tiene intención de aumentar la escalabilidad de un sistema. Es compatible con Linux, OS X, Windows y Solaris. Además de MongoDB existen otros sistemas NoSQL como por ejemplo Cassandra, CouchDB, Redis, Riak, Membase, Neo4j y HBase.  Considera que mongoDB fue diseñado para ser un motor de búsqueda sobre aplicaciones en la nube, debes de ser bien específico al momento de elegir un sistema NoSQL. Esto porque tienen diferentes funciones o están optimizados para diferentes tareas: Como Cassandra que fue diseñado para búsquedas en Facebook.  Si buscas un framework en PHP para poder utilizar MongoDB inmediatamente puedes probar alguno de los siguientes: CakePHP, Codeigniter, Doctrine, Drupal, Kohana, Lithium, Memcached, Symfony 2, Yii y Zend Framework. Si buscas utilizarlo con Python prueba con PyMongo. Conceptos básicosUna base de datos en MongoDB tiene diferentes conceptos a una base de datos regular como MySQL. Cada registro o unidad básica de datos se le denomina documento. Y cada conjunto de documentos, que formarían una tabla, se le llama colección. Un documento se podría comprar con el concepto de fila y una colección a una tabla. Organización y sistemaLa ventaja que tiene MongoDB ante las bases de datos racionales es la velocidad de consulta. Esto se logra gracias a que los documentos son almacenados en formato BSON, que es una versión modificada del ya conocido JSON. BSON pesa un poco más que un JSON regular, pero gracias a que este guarda longitudes de campos, índices de arrays, entre otras cosas, es mucho más rápido (y menos costoso), acceder a la información que se consulta. Al final del día no vamos a ver el formato BSON, así que no te preocupes, siempre lo leerás como un JSON regular. DocumentosLos documentos son un conjunto de claves con valores asociados. Sin embargo, cabe destacar que en cada lenguaje es diferente el "output". Código : { "pepito" : "uno" } Igual cabe destacar que una clave puede contener varios valores asociados como por ejemplo: Código : { "pepito" : "uno", "dos" : 3 } Notas importantes - Las claves de un documento son strings. - No se deben utilizar caracteres como punto y el signo de dólar. - No deben de comenzar con guión bajo. - Las claves son sensibles a mayúsculas y minúsculas. - No debe contener claves duplicadas. - Cada documento tiene una _id única generada a partir de diversos métodos, así siempre será diferente. ColeccionesUna colección nos ayuda a organizarnos de manera mucho más fácil y rápida. Código : > db.pepito.insert() > db.pepito.find() > db.pepito.drop() Notas importantes - Mantener diferentes tipos de documentos en una misma colección es de masoquistas. - Un string vacío no es un nombre válido, así como no se puede utilizar un string con signo de dolar. - Es más rápido obtener una lista de documentos que mantengan la misma estructura. - Siempre planea la estructura de tus colecciones y documentos antes de comenzar. Manejo de datos desde la shellYa que este artículo es únicamente una introducción, no entraré en detalles de cómo instalarlo o utilizarlo con algún lenguaje. Únicamente desde la shell que viene por defecto o desde aquí (haciendo clic en "Try It Out") Para hacer una inserción y guardarla escribimos lo siguiente para obtener algo parecido a pepito = tontito Código : db.pepito.save( { "pepito" : "tontito" } ) Y para imprimir el contenido Código : db.pepito.find() El siguiente script inserta en el documento varios elementos en forma de tags, después usa una función para contar cada elemento con un foreach, separa los elementos y devuelve la cantidad de elementos en otro documento. Código : $ ./mongo > db.things.insert( { _id : 1, tags : ['perro', 'gato'] } ); > db.things.insert( { _id : 2, tags : ['gato'] } ); > db.things.insert( { _id : 3, tags : ['raton', 'gato', 'perro'] } ); > db.things.insert( { _id : 4, tags : [] } ); > // función de mapeo > m = function(){ ... this.tags.forEach( ... function(z){ ... emit( z , { count : 1 } ); ... } ... ); ...}; > // función reductora > r = function( key , values ){ ... var total = 0; ... for ( var i=0; i<values.length; i++ ) ... total += values[i].count; ... return { count : total }; ...}; > res = db.things.mapReduce(m, r, { out : "myoutput" } ); > res { "result" : "myoutput", "timeMillis" : 12, "counts" : { "input" : 4, "emit" : 6, "output" : 3 }, "ok" : 1, } > db.myoutput.find() {"_id" : "gato" , "value" : {"count" : 3}} {"_id" : "perro" , "value" : {"count" : 2}} {"_id" : "raton" , "value" : {"count" : 1}} > db.myoutput.drop() Existen muchos más comandos, todos ellos están en la documentación, con el comando help, documentación o desde la shell de mongodb.org escribiendo tutorial para un rápido pero informativo tutorial.  ¿Tienes dudas? Dejame un comentario aquí o sígueme en twitter @kinduff. En el próximo tutorial les enseñaré como generar bases de datos, leerlas y modificarlas. Enlaces de interés- Página principal de mongoDB [link] - Documentación mongoDB [link] - Sourcecode + drivers para diferentes lenguajes y sistemas [link] - NoSQL: If Only It Was That Easy [link] - Cassandra vs MongoDB vs CouchDB vs Redis vs Riak vs HBase vs Membase vs Neo4j [link] - [NSFW] Relational Database Vs NoSQL Fanbois [link]
|
| Qué significa que Facebook compre Instagram Posted: 09 Apr 2012 05:40 AM PDT Wow. Mark Zuckerberg anunció que Facebook compró Instagram por mil millones de dolares (un billón gringo). Instagram nació como una aplicación para aplicar efectos especiales a las fotos tomadas con un iPhone, evolucionó a ser una red social privada de fotografía y la semana pasada anunció su llegada a los teléfonos Android. Es la app de fotos más exitosa de la historia y ahora parte de Facebook. Y si esta compra no demuestra la burbuja tecnologica, no sé qué más pensar.  Hay 3 cosas que me quedan claras con esta compra: La creación de contenido en dispositivos móviles es el mercado más caliente del momentoEl gran problema de los smartphones y las tablets es que son vistas como dispositivos de consumo, más que plataformas para crear contenido. Apple lo sabe y por eso enfocó al iPad 3 (Pepito) como LA tablet para crear música, editar fotografías, componer videos profesionales y en general: Crear. En el último mes hubo dos compras gigantes en el mundo móvil: OMGPOP (Draw me Something) por Zynga y ahora Instagram por Facebook. Un juego y una camarita. Dos apps increiblemente exitosas en hacer que los usuarios de móviles creen. Eso sumado al lanzamiento de la espectacular "Paper" para iPad. ¿Quieres hacer platita? Programa apps móviles que le permitan a los usuarios crear.  ¡El dinero ya no vale nada, carajo!No, en serio, nada. Ayer leía un artículo de un emprendedor elegido por YCombinator donde, en su primera reunión con Venture Capitalists, los inversionistas le tiraban dinero a la cara, le pedían poder unirse a su idea, lo perseguían con pasión. Hay tanto dinero gringo, tantos fondos, tantas valuaciones locas, que la percepción de dinero en el mundo de las startups está en su momento más raro. Esto es lo que se sentía a finales del 2004. Es lo que se sentía por el 2001. Es la punta de la ola en la burbuja del dinero en internet. Si lograste hacer plata en esta epoca, es hora de comprarte una casa en la playa, contratar a un mayordomo que se cambie el nombre a Alfred y darte por bien servido. Viene la explosión de la burbuja. Y tengan en mente, esto lo hace Facebook justo antes de salir a la bolsa a levantar aun más plata. Es más rentable aprender a programar que traficar con droga en estas épocas. Invertir tu tiempo y talento en una app sin modelo de negocio sigue sin tener sentidoEsto es lo que me preocupa de Twitter todos los días de mi vida. Afortunadamente, mi cuenta de Twitter ya amortizó el costo que tiene mantenerla. Mucha gente publica montones de fotos diarias en Instagram, gente que no sabe si esas fotos seguirán ahí mañana o si a Facebook le da por matar todo, desactivar la conexión con Twitter o hacer la conexión con Facebook "obligatoria". Gran parte del atractivo de Instagram era crear una segunda red de amigos cercanos con quien compartir fotos privadas de los hijos o en el espejo del baño. Lo que siempre quiso y nunca pudo crear Path. Ahora, no sé sabe qué pasará. Facebook dice que mantendrá todo igual, que Instagram será independiente y bla bla bla. Las empresas cambian de estrategia y de opinión. Palm murió, el Playbook fue un fracaso, Google Wave desapareció, Tweetdeck se estancó, Jaiku fue cerrado, etc, etc, etc. Hoy Instagram sigue viva ¿Mañana? Esto pasa con las empresas llenas de hype y faltas de ingresos. Eso es una gran adquisición para Facebook ¿Pero le conviene a los usuarios que han invertido meses en crear algo único dentro de Instagram? Lo que importa es que, hoy más que nunca, crear apps móviles que creen contenido es más valioso que tener una empresa que haga plata. ¡A aprender a programar y que viva la burbuja!
|
| Cómo crear shortcodes en Wordpress Posted: 09 Apr 2012 01:52 AM PDT Hoy en día un Theme de Wordpress que carece de Shortcodes no puede jactarse de ser profesional. De no serlo nuestro Theme queda relegado a un simple template más que deberemos ofrecer gratuitamente por la Web. Es por esto que hoy voy a tratar de explicarte de una forma simple cómo poner shortcodes en tu gran Theme de WordPress. Para el que no tiene conocimiento del asunto un shortcode en WordPress es una palabra encerrada entre corchetes. Cuando nosotros la utilizamos en el cuerpo de una entrada esta palabra hace algo. Por ejemplo nosotros podríamos tener un shorcode para mostrar un video, o un anuncio de adsense. Y deberíamos poner en el cuerpo de nuestro Post algo de estas características: Código : [anuncio] [video] Asi de fácil. Esto, como salta a la vista, simplifica tareas tediosas haciéndolas mas simples. Los shortcodes son utilizados por una serie de funciones de WordPress que se llaman API de código corto. Creando nuestro primer código cortoSi nosotros sabemos como crear una función en WordPress, sabemos crear códigos cortos. No hay más vuelta que darle. Veamos este ejemplo: Código : function hola(){ return `"Hola maldito y desquiciado mundo!!!"; }Ahora que tenemos nuestra función creada, tenemos lo que el código corto "hace". Pero todavía nos falta asignar ese código corto. Entonces siempre trabajando en nuestro functions.php agregaremos la siguiente línea: Código : add_shortcode('hla','hola')¿Que es lo que hemos puesto arriba? Otra función! Quitando que ésta es de WordPress. Y recibe dos parámetros. El primero es la abreviatura que nosotros deseamos que tenga el código corto. La segunda es el nombre de la función que nosotros creamos antes. Eso es todo. Ahora cada vez que nosotros en una entrada, tengamos deseos de mostrar la frase: wordpress : "Hola maldito y desquiciado mundo!!!"; Sólo deberemos poner nuestro código corto que es: Código : [hla] Creando un Shortcode para enviar contenido a TwitterHagamos uno para enviar contenido a Twitter! Código : function twitt() { return '<div id="twitit"><a href="http://twitter.com/home?status=Estoy leyendo '.get_permalink($post->ID).'" title="Enviar al maldito Twitter!!!!" target="_blank">Share on Twitter</a></div>'; }Código : add_shortcode('twitter', 'twitt');Nada del otro mundo. Creamos una función a la cual le dimos como nombre twitt. Luego le dijimos que devuelva un div con el twitit y el clásico botón de Twitter para compartir. Éste va concatenado a la función get_permalink para que la función tome el link de la entrada y se envíe a Twitter. Pruébenlo en su archivo functions.php –sin romperlo- y después me cuentan como les fue. Se aceptan ideas de poderosos short codes. En serio. Fuente: Tutorial de mi autoría tomado de mi blog. [nota:4643fd8b49]@the_fricky nos deja un consejo sobre el uso correcto de shortcodes en los comentarios del tutorial[/nota:4643fd8b49]
|
| Barra de navegación adaptable con Media Queries y JS Posted: 09 Apr 2012 01:14 AM PDT ¿Por qué desarrollar para móviles?Con el auge de los smartphones y tablets hoy en día, los sitios no están optimizados para estos dispositivos lo que causa una mala experiencia de usabilidad a los usuarios, por eso es nuestra misión cambiar ese panorama desarrollando para móviles. En esta ocasión les traigo un pequeño tip para sus desarrollos móviles, un navbar que cambia dependiendo de la resolución de pantalla. Así se verá en resoluciones mayores a 450px:  Y así en resoluciones menores a 450px:  Estructura HTML5Código : <!doctype html> <html lang="es"> <head> <meta charset="utf-8"> <title>Navbar adaptable</title> <link href="css/style.css" rel="stylesheet"> </head> <body> <header> <h1>Navbar adaptable</h1> </header> <nav> <a onclick="muestra_oculta('mostrar')"><!-- Al dar click aquí se mostrará u oculltará la lista --> <img src="imgs/menu.png"> </a> <ul id="mostrar"> <li>Inicio</li> <li>Blog</li> <li>Portafolio</li> <li>Contacto</li> <li>Redes Sociales</li> </ul> </nav> <script src="js/mostrarOcultar.js"></script> </body>Función "mostrarOcultar" JavascriptCódigo : function mostrarOcultar(id) { if (document.getElementById) { var menu = document.getElementById(id); menu.style.display = (menu.style.display == 'none') ? 'block' : 'none'; } } window.onload = function(){ mostrarOcultar('mostrar'); } // Con esto haremos que al dar click en la imagen "menu.png" muestre u oculte el contenido. Maquetación CSS3Código : @charset ("utf-8"); @import url("http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800"); /* Open Sans de Google Fonts */ a { padding: 8px 0; } body { font-family: Open Sans, Helvetica, Arial; font-size: 14px; margin: 0; } h1 { color: #fff; font-size: 18px; margin: 0; text-align: center; text-transform: uppercase; } header { background: #222; padding: 10px 0; width: 100%; } li { color: #fff; list-style: none; padding: 12px; } li:hover { background: rgba(0,0,0,.25); } nav { background: #08c; text-align: center; width: 100%; } ul { margin: 0; padding: 0; } /* Aquí viene la magia */ /* En resoluciones mayores a 450px */ @media screen and (min-width: 450px) { a { display: none; } li { display: inline-block; } ul { display: block !important; } } /* En resoluciones menores a 450px */ @media screen and (max-width: 449px){ a { display: block; } li { display: block; } } Con esto tendríamos nuestro navbar completamente adaptable dependiendo de la resolución de pantalla. Archivos del tutorial: Descargar Demo [nota:2358bb3341]El código ha sido adaptado en base a los consejos de @the_fricky comentados en este hilo[/nota:2358bb3341]
|
| Crear un cronómetro con la clase Timer en AS3 Posted: 18 Mar 2012 03:42 PM PDT En Actionscript 3 la clase Timer, es la alternativa ideal al setInterval de AS2. Aunque podemos seguir utilizando setInterval en AS3, la clase Timer ofrece gran ventaja sobre setInterval porque podemos indicarle cuántas veces queremos que ejecute la acción, con lo que no tendremos que eliminar el intervalo con clearInterval(). Sintaxis:  Si deseamos que la acción se ejecute infinitas veces, escribimos 0 en el número de repeticiones. Código : var temporizador:Timer = new Timer(500, 0) Al temporizador habrá que añadirle por lo menos un listener, el mismo que ejecutará la función indicada en cada período. Este listener detectará el evento TIMER. Sintaxis: Código : temporizador.addEventListener(TimerEvent.TIMER, cadaPeriodo); function cadaPeriodo(evt:TimerEvent){ // aca tus acciones }cadaPeriodo es la función que se ejecutará en cada intervalo de tiempo. La clase Timer posee también otro evento: TIMER_COMPLETE, que detecta cuándo se han cumplido todas las repeticiones. Sintaxis: Código : temporizador.addEventListener(TimerEvent.TIMER_EVENT, alTerminar); function alTerminar(evt:TimerEvent){ // aca tus acciones }alTerminar es la función que se ejecutará al finalizar todas las repeticiones. ¿Y en qué momento empezará a correr el temporizador? Cuando ejecutemos el método start. Sintaxis: Código : temporizador.start(); Es en este momento que se empieza a ejecutar la función cadaPeriodo en todas las repeticiones indicadas, situación que se detendrá cuando alcance el número de repeticiones indicado al momento de crear el temporizador o cuando llamemos al método stop. Sintaxis: Código : temporizador.stop(); El método stop detiene el temporizador. Cuando se realiza una llamada start() después de stop(), la instancia del temporizador se ejecuta durante el número restantes de repeticiones. ¿Podemos resetear el temporizador? Claro que sí. El método reset detiene el temporizador (si está en ejecución) y restablece el número de repeticiones de nuevo como 0. Posteriormente, cuando se realiza una llamada a start(), el temporizador ejecuta el número especificado de repeticiones establecidos inicialmente. Ahora estamos en condiciones de utilizar la clase Timer para crear un sencillo cronómetro. ¡Manos a la obra! Crear un cronómetro con la clase TimerSituación: Vamos a construir un sencillo cronómetro con botones de Empezar, Detener y Reiniciar. El cronómetro marcará el tiempo cada segundo (1000 milisegundos). Ahora veremos la clase Timer en acción, con el siguiente código y su explicación: Código : import fl.controls.Button; import flash.text.TextField; //creamos los textfield var hora_txt:TextField = new TextField(); hora_txt.x = 50; hora_txt.y = 50; hora_txt.width = 150; hora_txt.height = 30; hora_txt.border = true; hora_txt.text = "0h : 0m : 0s"; addChild(hora_txt); //añadimos los botones de control var empezar_btn:Button = new Button(); empezar_btn.x = 50; empezar_btn.y = 90; empezar_btn.label = "Empezar"; addChild(empezar_btn); var detener_btn:Button = new Button(); detener_btn.x = 50; detener_btn.y = 120; detener_btn.label = "Detener"; addChild(detener_btn); var reiniciar_btn:Button = new Button(); reiniciar_btn.x = 50; reiniciar_btn.y = 150; reiniciar_btn.label = "Reiniciar"; addChild(reiniciar_btn); /*creamos una variable de tipo Timer. Intervalo 100 milisegundo = 1 décima de segundo. 0 para indicar ilimitado número de veces*/ var temporizador:Timer = new Timer(1000, 0); /*asignamos un Listener al temporizados para el evento TIMER y que ejecute la acción marcaHora*/ temporizador.addEventListener(TimerEvent.TIMER, marcaHora); /*Definimos la función que utilizaremos cada décima de segundo. Esta función nos permite obtener la hora actual y mostrarla en un textfield.*/ var tiempo:uint = 0; //esta variable cuenta el tiempo function marcaHora(event:TimerEvent):void { //convertimos a hora, minutos, segundo var hora:uint = Math.round(tiempo/3600); var residuo:uint = tiempo%3600; var minutos:uint = Math.round(residuo/60); residuo = residuo%60; var segundos:uint = residuo; hora_txt.text = hora + "h : " + minutos + "m : " + segundos + "s"; tiempo++; } //Ahora las funciones que harán funcionar el cronómetro empezar_btn.addEventListener(MouseEvent.CLICK,empezar); detener_btn.addEventListener(MouseEvent.CLICK,detener); reiniciar_btn.addEventListener(MouseEvent.CLICK,reiniciar); function empezar(evt:MouseEvent){ temporizador.start(); } function detener(evt:MouseEvent){ temporizador.stop(); } function reiniciar(evt:MouseEvent){ temporizador.reset(); hora_txt.text = "0h : 0m : 0s"; tiempo = 0; }
|
| Crea tu placa profesional de pared con Illustrator Posted: 16 Mar 2012 05:11 AM PDT En este videotutorial de Illustrator vamos a crear una sencilla placa de cristal de pared. Usaremos degradados personalizados, ajustes de transparencia y daremos textura a las formas, además de reflejos y sombreados que nos ayudarán a colocar el elemento en su entorno y aumentar el realismo. Saludos.
|
| Crea partículas 3D con Particle World en After Effects Posted: 16 Mar 2012 04:59 AM PDT Los sistemas de partículas son un elemento vital en la mayoría de las composiciones animadas, gracias a su carácter altamente dinámico y al fuerte impacto visual que generan con sus cambios de estado en el entorno 3D y After Effects nos ofrece varios efectos propios, que nos permitirán jugar con las posibilidades que nos ofrecen las herramientas genéricas, sin la ayuda de plugins externos y dentro de un entorno con profundidad aplicable a los diferentes componentes que incluyamos. Saludos.
|
| Crear interfaces Serial y Loopback en Packet Tracer Posted: 16 Mar 2012 04:36 AM PDT En este videotutorial de Redes vamos a aprender a conectar dispositivos a través de las interfaces Serial y a ajustar los valores del clock rate para que los dispositivos puedan trabajar con este cableado, además de comprobar las posibilidades de configuración y gestión que nos ofrecen las interfaces lógicas virtuales Loopback. Saludos.
|
| 10 tecnologías web a aprender en el 2012 Posted: 14 Mar 2012 10:53 PM PDT Este es el año más divertido para ser un tejedor de experiencias web. El 2011 fue un año de DOLOR. HTML5 era brillante y raro. Flash fue herido por el presidente de Adobe, quizas el CEO más idiota de la industria. Android aplastaba al iPhone pero era aplastado por el iPad. Y la gente, al fin, entendió que usar Blackberry en ésta decada es como ver TV blanco y negro en un mundo HD. Este año 2012, si eres frontend, backend, diseñador, programador o te encargas de cualquier cosa que tenga que ver con poner colores en una pantalla conectada a Internet, estas son las 10 tecnologías que, sin duda, debes amaestrar:
 HTML5 y CSS3... duh!Es obvio, pero lo reiteramos. No saber HTML5 es irresponsable. No conocer CSS3 es odiarte y un signo de masoquismo. HTML5 y CSS3 hacen todo TAN FÁCIL que no usarlos es autodestructivo. ¿Quieres detectar eventos touch en móviles o tablets? ¿Acelerometros? ¿Saber la latitud y longitud de un usuario? ¿Guardar en disco? ¿Crear bordes redondeados? ¿Transparencias? ¿Animaciones? Todo desde el navegador. ¡Aprende HTML5! (Introducción a HTML5 y muchos, muchos tutoriales de HTML5 y tutoriales de CSS3) Stylus o LESSCSS es el lenguaje declarativo más estúpido del mundo. CSS fue creado por gente que odia el amor. ¿Cómo es posible no tener herencia real? ¿No tener variables? ¿No tener sumas y restas básicas? No pido ciclos y condiciones, ¡Pido sentido común y decencia! Stylus y LESS, dos "pre-procesadores" de CSS, lo arreglan. Compatibles con CSS3, generan un CSS limpio, lindo y optimizado, compatible con todos los navegadores y que agrega lo que a CSS le falta. Cristalab usa Stylus. (Tutoriales de Stylus y LESS) Node.jsNode.js es un servidor que corre cada webapp en un nodo independiente por usuario, comunicables entre sí a través de una grilla al estilo de los Apaches mejor configurados. PERO además se programa con Javascript. Ni PHP, ni Python, ni Java: El buen y viejo Javascript. PERO además es REAL TIME y estupidamente veloz. Es magia de la buena. Mejorando.la usa Node.js. (Tutoriales de Node.js, fuck yeah!) CoffeeScriptJavascript es el lenguaje más famoso y usado del mundo web. En serio. Más que PHP. Y similar a PHP, es horrible, feo, viejo, mal hecho, lleno de malas prácticas y similar a afeitarse con un cactus. CoffeeScript hace por Javascript lo que Stylus y LESS hacen por CSS. Agrega una sintaxis decente y elegante, orientada a objetos y llena de sentido común, el cual exporta a Javascript de toda la vida, compatible con jQuery y cualquier otro JS que tengas allá afuera. Cristalab usa CoffeeScript. (Tutoriales de CoffeeScript) jQuery Mobile, en serioSi no conoces jQuery este no es tu negocio. En serio, aunque seas de marketing. jQuery es la forma fácil, de rápido desarrollo (y lenta ejecución) de hacer web apps. ¿Y jQuery Mobile? Es una obra tan linda que si fuera más inteligente sería millonaria. La forma más fácil de crear no sólo interacción en móviles, sino diseños enteros de apps compatibles con TODOS los teléfonos modernos. TODOS. Aprendanlo por el amor a los tubos. O si son muy fancy, tienen dinero y no les gusta jQuery Mobile vean Sencha Touch. (Tutoriales de jQuery y de jQuery Mobile) PhoneGap/Cordova y Flash/Flex MobilePhoneGap es una idea digna de un nobel de paz. Crea apps en HTML5, CSS3 y Javascript, usa el "API" de PhoneGap para acceder a los APIs de teléfonos Android y iPhone y con el mismo código, en un click, compila apps nativas completas para iPhone y Android que puedes vender o regalar en el Google Play (Android Market) o la App Store. Belleza. Belleza que Adobe compró y renombró como el Proyecto Cordova. PERO si quieres hacer videojuegos móviles, Flash/Flex es la MEJOR opción. Actionscript 3 es un excelente lenguaje y ahora que Steve Jobs está muerto, el compilador de Flash para iPhone y Android con AIR Mobile tiene mucho futuro. ESTE es el futuro de Flash. Apps móviles interactivas multiplataforma. (Tutoriales de PhoneGap y claro, de Flash, Flex y Flash en el iPhone) MongoDB, Redis o... cualquier base de datos NO relacionalSQL no es tan buena idea siempre. A veces las DBs son tan sencillas que una base de datos SQL relacional sólo crea problemas y cuellos de botella. Hay un nuevo tipo de bases de datos basadas en el concepto de "nombre => valor" donde sólo hay un "key", no hay relaciones ni intersecciones de conjuntos, sino más teoría de matrices, hashes y/o diccionarios. ¿Muy técnico? Hay DBs que en su simpleza son MUCHO más veloces que las SQL. Se llaman "no relacionales" y vienen en varios sabores ¿Las más famosas? MongoDB y Redis. Aunque hay más, como BigTable de Google o SimpleDB de Amazon. (¿Quien se anima a hacer un tuto de esto? Publicalo en Cristalab) Django/Python¿Siguen con PHP? Dejen de sufrir. En el 2012, programar en PHP desnudo es cómo hacer un sitio con CSS3 para IE6. Conoce el mundo del futuro: Node.js, Ruby on Rails y sobre todo, Django con Python. Lenguajes modernos, con experiencia y caracteristicas futuristas que los PHPeros no conocen. Una simple prueba: Django viene con un sistema de manejo de base de datos que abstrae SQL, lo hace innecesario y vuelve imposible las inyecciones SQL. Pero ADEMÁS crea automaticamente los sistemas de administración de los sitios web al entender de manera inteligente la estructura de la información. (Tutoriales de Python y Django) "Responsive Design"El "diseño receptivo adaptivo" o Responsive Design es una nueva corriente. El mismo diseño que pones en una web a 1024px lo puedes "reorganizar" para que se vea lindo en un iPad, en un iPhone o en un Android. No se trata de hacer sitios móviles, sino mantener una unidad de diseño a través de los dispositivos, cambiando de diseños multicolumna a una sola sin sacrificar muchos elementos, sino reorganizar. Dos ejemplos que resaltan de Responsive Design: La app móvil de la Wikipedia para teléfonos y tablets. Windows Phone 7 junto a Windows 8. El iPadEl iPad ganó y darme cuenta me dolió. He probado tablets Android chinas, el Samsung Galaxy Tab 10.1, el Blackberry Playbook, el Kindle Fire, la Asus Transformer, el Galaxy Tab 7" y hasta el desproposito de Chromebook. Ya está, Apple ganó. Contra el iPhone se podía pelear. No tuvieron una App Store en lanzamiento, todos en la industria estaban aprendiendo y había suficiente interés porque Android fuera el sistema que compitiera con fuerza. Android ya había entendido los teléfonos antes que el iPhone saliera al mercado. ¿Pero el iPad? El iPad se adelantó al futuro por completo. Un diseño simplón y obvio por fuera, un iPhone grandote, pero al probarlo, un mundo diferente. El Galaxy Tab 10.1 es lo más cercano y NO es cercano. No tiene la calidad de apps, la calidad de interfaz, la calidad de gestos, la calidad de construcción. El iPad ganó. Es la mejor tablet, de lejos. 3 años adelante de Samsung, de Asus, de Microsoft. Y me jode un montón. Con el iPad Pepito (O New iPad o iPad 3 o como se llame), Apple simplemente aplastó a todos. Pasará un año o dos antes que veamos un Retina Display de 10 pulgadas en otra tablet. Pasarán AÑOS antes que veamos apps con la calidad de iPhoto o Keynote de iPad en Android. Pasará una decada antes que cualquier otra tablet llegue al market share que el iPad ha consolidado. Si te importa el futuro post-PC y el tipo de experiencias web que serán creadas en ese futuro, comprate un iPad ya y empieza a testear.
|
| You are subscribed to email updates from Cristalab To stop receiving these emails, you may unsubscribe now. | Email delivery powered by Google |
| Google Inc., 20 West Kinzie, Chicago IL USA 60610 | |
No hay comentarios:
Publicar un comentario