martes, 25 de febrero de 2014

Todos tenemos bookmarks o marcadores guardados ¿ por que no compartirlos ?

Quiero comenzar este post con una pequeña reseña de como los buscadores como google cambian constantemente los resultados de búsqueda, no tengo nada contra Google pero haré referencia a el por ser el mas conocido.

Has notado algunas vez que los resultados de tus búsquedas en Google no siempre son iguales ? Eso es  debido a que Google usa un super-ninja algoritmo para decidir que contenido es relevante o importante para mostrarte. Nadie sabe como funciona en realidad, es super secreto  y lo que existen son técnicas para lograr que Google reconozca y muestre tus paginas en sus resultados, algo conocido como SEO y SEM.

Entonces una persona común y corriente que solamente quiere escribir un blog sencillo con una receta de un super-duper sandwich y si desconoce estas reglas, simplemente nunca aparecerá en los resultados de Google debido a que estaría compitiendo con otros sitios webs que usan las técnicas SEO ó SEM y su posicionamiento seria muy pero muy abajo de sus competidores, aunque su receta de sandwich sea la mejor del mundo.

Si a esto sumamos que Google elimina periódicamente links de sus resultados de búsquedas, en base a peticiones del gobierno, empresas, personalidades , ect.  que consideran su contenido ofensivo o no acto para el publico, tenemos mucha información que nos estamos perdiendo por razones un tanto irrelevantes.

Yo personalmente considero cada link, cada pagina web o vídeo, como información valiosa que no debe de ser olvidada o ocultada a las personas, sin importar su contenido o procedencia. Y este es el problema que intento resolver con una aplicación web que acabo de terminar.

Yo soy de las personas que piensa que obtener respuestas de personas es muy distinto de recibir respuesta de un algoritmo, no importan cuando sofisticados los algoritmos lleguen a ser, nunca se compararan con la inventiva, creatividad y agilidad de la mente humana. Las personas quiere respuestas de personas que han resuelto el mismo problema.

Es común para todos nosotros gastar mucho tiempo buscando algo en internet usando Google y algunas veces podemos visitar sitio tras sitio , pagina tras pagina de los resultados hasta encontrar  lo que realmente necesitamos. 

¿Y cuando encontramos una web que realmente nos es útil, que hacemos ?

La respuesta comúnmente seria, guardar el link como bookmark ó marcador, para poder revisarlo cada vez que nosotros queremos luego.  

Ahora imagina otro usuario buscando lo mismo que tu  ¿ que pasara entonces ? Bueno el empleara el mismo tiempo que tu gastaste buscando lo mismo que tu, incluso puede que esta vez no lo encuentre, por que Google decidió remover el link ó el contenido no era relevante para mostrarse debido a que no cumple con las reglas SEO. Pero su contenido aun es importante, la receta del super-duper sandwich aun esta ahí y es la mejor del mundo, el problema es que el algoritmo no lo sabe y estamos condenados a obedecerlo.

La idea de United Bookmark es que tu guardes tu marcadores ó bookmarks en un solo lugar y lo compartas con toda las personas de internet. Por ejemplo puedes crear un bookmark con el titulo : "recetas del ricos sandwich" y agregar el link que has encontrado.

De esta manera un usuario buscando recetas de sandwich pueden encontrar tu link y si ellos conocen de otros links que ellos consideran importante podrán agregarlos a tu bookmark, de esta manera todos en internet podemos contribuir para compartirnos información que los buscadores no puede reconocer.
  • Comparte los link que fueron difíciles de encontrar.
  • Agrega los link que consideras importantes de compartir.
  • Comparte todos tus links que puedan ayudar a otros usuarios a encontrar sus respuestas.

Personas ayudando a otras personas, no un algoritmo diciéndonos que ver. Te invito a que visites United Bookmark y lo pruebes, actualmente esta en fase beta , puede que tenga ciertos errores lo cuales estoy corrigiendo. Por que el sitio esta en ingles ? bueno pronto tendrá multi lenguaje :) .

Si tienes alguna duda o idea para mejorar el sitio por favor escribeme a info@saulburgos.com.






Curso de programación de aplicaciones web desde cero


 http://codingonweb.com/

Curso de aplicaciones web para principiantes


Aprender a crear aplicaciones web nunca había sido tan fácil como ahora, la información abunda en Internet por ejemplo si escribes en Google "Tutorial de paginas web" veras muchos enlaces y vídeos que enseñan como hacerlo. Incluso recientemente yo publique un post con enlaces con muchos sitios en donde aprender.

A como yo lo veo conseguir la documentacion no es el problema pero si hay algo interesante que he notado, la cantidad de información sobre paginas web es enorme y creo que las personas que desean comenzar en este mundo de la web se podrían sentir abrumadas con toda esta información y no sabrían por donde empezar.

En mi opinión los principiantes mas que un profesor que les enseñe paso a paso como crear paginas web, necesitan a alguien que los guié y muestre el camino a seguir entre toda esa documentacion, enseñarles como buscar en google documentacion de calidad, que sitios son los adecuados para sus consultas  y como leer adecuadamente la documentacion oficial.

www.codingonweb.com es una web donde podrás conocer los pasos necesarios para aprender a programar paginas web. Al ser un curso para principiantes abordaremos temas muy básicos y sencillos por lo que personas que ya sepan lo básico se podrían aburrir en el curso. A continuación una lista que detalla el curso.

Los cursos son gratuitos, solo necesitas  inscribirte en la pagina y comenzar a aprender.






sábado, 22 de febrero de 2014

All we have Bookmarks, Why we don't share ?


I am not against Google, just is the most popular search engine that is why I am using it like example.

Hello stranger, like you I also spend a lot time using search engines to find something on internet, for example Google. And sometimes I search page by page until find something that I consider useful to me.

What do I do when I found some website that was difficult to find ?

Well, I save it like a bookmark, because you know...Google might forget this website in any moment and disappear from results for all this reasons and this. Each year, Google changes its search algorithm around 500–600 times. While most of these changes are minor, Google occasionally rolls out a "major" algorithmic update, that affects search results in significant ways. When this happens, all the results change and many sites are lost who know where. 

If another user is searching the same thing that I searched before, he will waste the same time that I lost looking up the same information or worst, he never won’t find the information because the Google might not consider that website important this time. We are doom to obey his search algorithm.

The idea of United Bookmark is that you save all your bookmarks in one single place and share them with others users.

  • Share all your links that were difficult to find.
  • Share all your links that you consider important.
  • Share all your links that might help others users to find their answers.


Users helping others users not an algorithm telling you what to see. Once you add a bookmark, others users can share their own links with you, that they consider useful based on your bookmark description. You may find yourself adding bookmarks as well as sharing links with others users. You can help friends, or friends-of-friends with their bookmarks and grow our collection of bookmarks in order to help other people. It feels good to share… :)

All users can vote on all links, in that way you know what link is the best and discard links that may not have valuable content. Take for example a website of a grandmother’s recipe about sandwich. You can create a bookmark called : “Best recipes of sandwiches” and add this link of the grandmother’s website.

Once this bookmark is created other users can add others links with other recipes of sandwich that they found interesting. In that way you will have valuable links about recipes of sandwiches that others users tested and consider important to share with you.

 I am the person that think that getting answers from people is very different from retrieving information with algorithms. No matter how sophisticated algorithms become, they are still no match for the experience, inventiveness, and creativity of the human mind. People want answers from people searching the same thing.

United Bookmark is my idea to help these tiny websites not to be forgotten by Search engine algorithms and the same time share my bookmarks with others users.

United bookmark is in beta phase. That means :

  • Is an unfinished product.
  • Contain a lot of errors.
  • I am working to improve some features.
  • The interface and colors may change in the future.

If you find a error, I will be glad if you send me an email telling me about it to info@saulburgos.com

Angularjs UI y boostrap 3.0 problema con formulario dentro de Tabs

El siguiente articulo es un tanto técnico, pero quiera publicarlo para que otros pudieran resolver el mismo problema que tuve.

Angularjs es un framework javascript que nos ahorra mucho tiempo en el desarrollo de una aplicación web, para este framework existe una versión de Boostrap con todos los widgets convertidos en directivas.

Ahora bien con el widget Tabs de bootstrap existe cierto problema cuando tienes un formulario dentro de las tabs he intentas acceder al ngFormController dentro de tu controlador. El problema es que en tu controlador no existe el ngFormController de tu formulario por lo tanto no puedes acceder a ninguno de sus metodos.

El problema en si es que la directiva Tab crea un scope aislado y todo elemento dentro de el sera aislado de su padre , por tal razón nunca aparecerá dentro del scope padre. La unica forma de resolver este problema es usando la directiva  "ng-form" de angular para crear nuestro formulario y pasando como modelo un objecto anteriormente definido en el controlador padre, de esta manera cuando la directiva Tab cree su scope heredara del controlador padre.

He creado un ejemplo de como debería de ser resulto este problema :

http://plnkr.co/edit/HKyh1BJYL12knGMfkRq0?p=preview

Mas información en detalle del problema en el siguiente link donde estuve preguntado sobre el problema :

https://github.com/angular-ui/bootstrap/issues/574#issuecomment-34859522




viernes, 21 de febrero de 2014

Harto de Google hangout ? appear.in es tu alternativa

Si estas harto de usar Google hangout ó simplemente estas buscando alternativas para video conferencias te presento :  https://appear.in/   sitio web donde podrás crear una sala para vídeo conferencia hasta con 8 personas al mismo tiempo.

Lo que mas me gusta de este servicio es que no necesitas instalar nada , configurar nada , no registro , no login , no descargas , solamente creas la sala y listo solo tiene que compartir el link de tu sala.

Muy sencillo esta alternativa de vídeo conferencia.

Link : https://appear.in/

Lista de sitios donde puedes aprender sobre Diseño web.

Como comentaba en el post anterior, si quieres aprender algo solamente depende ti lograrlo. Toda la documentacion y tutoriales esta internet, solamente tenemos que encontrarla. En este campo de la programación web personalmente pienso que es mas fácil de cualquier otra, solo basta que escribas en Google : "Tutorial sobre diseño web" y recibirás muchos resultados donde aprender. 

Hoy quiero compartir con ustedes un articulo donde listan muchos lugares donde aprender programación y diseño web, con algunas opciones de pago y otras gratuitas, como siempre con estos temas de programación web la mejor documentacion esta en ingles pero tal vez a alguien mas le puedan ser útil esta información.

Yo personalmente he aprendido mucho de algunas de los sitios web que se listan ahi.



Gibbon sitio web con infinidad de cursos para aprender gratis

Gibbon es un sitio web donde puedes aprender lo que sea. La filosofía de Gibbon es que en internet esta toda la información que necesitamos para aprender algo nuevo, el problema es que esta muy dispersa y desorganizada.

Gibbon funciona de la siguiente manera : Si por ejemplo sabes mucho sobre como hacer ricos pasteles , como conocedor del tema sabes  identificar que documentación , vídeos o libros que son  buenos para aprender y cuales deberían de leer y en que orden los principiantes para llegar a ser un gran pastelero como tu.

Ok sabiendo todo este conocimiento solo tienes que crear un curso y ingresar los link, vídeos o escribir artículos para guiar a los principiantes para que se conviertan en profesionales. Como vez no tienes que escribir largos artículos explicando como hacer pasteles, lo único que tienes que hacer es armar los pasos a seguir para aprender hacer pasteles, suministrando los links donde esta la información.

Como ves Gibbon se nutre de los cursos que sus usuarios crean diariamente, de esta manera puedes saber fácilmente por donde empezar y paso a paso volverte un profesional. Ojeando un poco los cursos que actualmente existen mire de todo tipo como por ejemplo:

  • Programación
  • Diseño de interfaces
  • SEO
  • Educación 2.0
  • Emprendimiento
  • multimedia
  • edicion de vide
  • Etc

Es un sitio relativamente nuevo y me he decidido a escribir sobre el por la cantidad de cursos que se están creando y son de acceso gratuito para todos, lo único malo es todos los cursos están en ingles solamente encontré uno en español. Pero como mencione antes, los cursos son creados por los mismo usuarios así que animo a mis lectores a crear cursos en español para la comunidad del habla hispana.


Libro gratuito de Nodejs a traves de koans



Ese es el titulo del libro que hoy les traigo : " Introduccion a NodeJs a traves de koans " libro gratuito en español sobre la programacion con Nodejs. ¿ Pero que son koans ? bueno copio y pego la definición que sale en el libro.

"El término koan proviene de la filosofía Zen oriental. Es el nombre que se le da a un pequeño problema que un maestro plantea a su discípulo para evaluar su progreso. Suelen ser breves y escuetos y, a menudo, con apariencia trivial o absurda pero que, sin embargo, suponen para el discípulo un paso más en su 2"

"Los koans en el ámbito informático fueron idea de Joe O’Brien y Jim Weirich, de EdgeCase, como forma de alcanzar “la iluminación” en el aprendizaje del lenguaje Ruby. Manteniendo la analogía con la filosofía Zen, los koans de Ruby son peque-ños trozos de código donde se sustituye alguna parte con unos guiones bajos ‘__’, al estilo de los ejercicios de rellenar el hueco, que el alumno deberá cambiar por el código que piense que es el correcto para que el ejercicio ejecute sin errores."

Este libro es un excelente referencia si quieres conocer mas sobre Nodejs,  he revisado el libro  personalmente creo que tiene temas muy técnicos y los lectores principiantes que no tienen mucha experiencia con javascript creo que se sentirán abrumados. Pero si tienes experiencia con javascript este libro te permitirá despejar muchas dudas y sin duda aprender este lenguaje.

Segun leo en la web, el libro se mantendrá actualizado constantemente.



jueves, 20 de febrero de 2014

Google Maps a pantalla completa con paneles sobre el mapa.

Recientemente he comenzando una web app donde el mapa de GoogleMaps tiene que estar como background y todo el contenido de la aplicacion sobre el al estilo de ventanas flotantes. Este tipo de web app es muy comun actualmente, por lo cual queria compartir con ustedes la manera en como lo hice para que puedan aplicarlos en sus proyectos.

En el siguiente link de jsFiddle encontraran todas las clases necesarias como poderlo reproducir en sus proyectos, he usado boostrap 3 para el estilo de los paneles. Lo importante seria que los elementos que quieres que floten sobre el mapa tienen que tener la clase "overMap" adicional a esta clase tienes que agregar otra la cual determinara la posicion en sobre el mapa , aqui una lista de las que puedes usar:
  • overMap-topCenter
  • overMap-topLeft
  • overMap-topRight 
  • overMap-bottomCenter
  • overMap-bottomRight
  • overMap-bottomLeft
  • overMap-centerAll
  • overMap-centerLeft
  • overMap-centerRight

Segun cual asignes determinara la posicion.



Creo que no se ve muy bien en la vista previa de jsFiddle , asi que les dejo el enlace directo a la aplicacion a pantalla completa donde podras ver mejor el resutado:

link : http://jsfiddle.net/SaulBurgos/3FtbC/4/embedded/result,js,html,css/

http://saulburgos.com/books/googlemaps.html

martes, 18 de febrero de 2014

Guia y lineamientos de como se trabaja y organiza un proyecto web profesional

Si te has preguntado alguna vez como las grandes compañías de desarrollo web organizan y trabajan sus proyectos, solo por curiosidad o para prepararte en una entrevista de trabajo, tengo algo muy bueno para ti.

North es un documento en Github que recopila las mejores practicas y estándares sobre el desarrollo de aplicaciones web modernas, el cual abarca temas como :

Como organizar los proyectos. 
Tecnologías actuales en uso.
Metodologías de seguimientos de proyectos.
Consejos sobre HTML , CSS , javascript, etc.
Control de versiones.
Roles y responsabilidades del equipo.
Diseño visual, patrones de diseño y rendimiento.

Si dispones del tiempo y quieres estar preparado sobre como es el proceso de desarrollo web profesional y como esta organizado te recomiendo esta lectura. Tal vez encuentres muchos términos que no entiendes y tendrás que investigar por tu cuenta pero al final te aseguro que valdrá la pena.

Una de las cosas mas interesante de este documento es que sus autores dicen que se mantendrá siempre actualizado con las ultimas practicas y metodologías,  ya esto del desarrollo web cambia constantemente y lo mejor es siempre es contar con la ultima información disponible.


CSS: es mejor usar translate en lugar de Position:absolute y Top/left

Paul Irish ha escrito un post en su pagina personal donde explica el por que es mejor mover objetos con translate en lugar de TOP y LEFT con posición absoluta.

La mejora de desempeño se nota mucho cuando estamos hablando de animaciones,por lo que usar esta tecnica para objectos estáticos no tiene sentido. Si te interesa este tema de animacion de objetos con CSS te recomiendo que veas el siguiente video. (video en ingles).



Tambien te puede interesar leer el articulo completo donde explica en detalle el por que de la mejora de desempeño usando translate, tambien encontraras link a los ejemplos.

link: http://www.paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/

Error Wampserver 2.4 no corre correctamente

Algunas veces cuando instalas Wampserver te encuentras que el servidor no levanta correctamente y su icono no  pasa del color amarillo. Para saber realmente en que modulo esta ocurriendo el problema necesitamos hacer lo siguiente:

 Click izquierdo en el icono de wampserver para ver el menu  > apache > Service , y ver si el servicio esta corriendo correctamente. Si no es asi y esta detenido tenemos que ver los apache logs que estan en el mismo menu y veras una lista de errores que puedes consultar con Google.

Otro problema comun es que alguna aplicacion esta usando el puerto 80, que es el mismo que usa wampserver , en este caso lo puedes probar usar la opcion : "Test port 80" en el mismo menu de apache >service

Ahora hacemos el mismo proceso con mysql,  Click izquierdo en el icono de wampserver para ver el menu  > service > Service , y ver si el servicio esta corriendo correctamente. Si no es asi y esta detenido tenemos que ver los mysql logs que estan en el mismo menu .

En el siguiente ejemplo yo estoy recibiendo el siguiente error en mis mysql logs: 

2014-02-18 09:21:24 13472 [Note] Plugin 'FEDERATED' is disabled.
2014-02-18 09:21:24 13472 [Note] InnoDB: The InnoDB memory heap is disabled
2014-02-18 09:21:24 13472 [Note] InnoDB: Mutexes and rw_locks use Windows interlocked functions
2014-02-18 09:21:24 13472 [Note] InnoDB: Compressed tables use zlib 1.2.3
2014-02-18 09:21:24 13472 [Note] InnoDB: Not using CPU crc32 instructions
2014-02-18 09:21:24 13472 [Note] InnoDB: Initializing buffer pool, size = 128.0M
2014-02-18 09:21:24 13472 [Note] InnoDB: Completed initialization of buffer pool
2014-02-18 09:21:24 13472 [Note] InnoDB: Highest supported file format is Barracuda.
2014-02-18 09:21:24 13472 [Note] InnoDB: 128 rollback segment(s) are active.
2014-02-18 09:21:24 13472 [Note] InnoDB: Waiting for purge to start
2014-02-18 09:21:24 13472 [Note] InnoDB: 5.6.12 started; log sequence number 1625997
2014-02-18 09:21:24 13472 [Note] Server hostname (bind-address): '*'; port: 3306
2014-02-18 09:21:24 13472 [Note] IPv6 is available.
2014-02-18 09:21:24 13472 [Note]   - '::' resolves to '::';
2014-02-18 09:21:24 13472 [Note] Server socket created on IP: '::'.
2014-02-18 09:21:25 13472 [Note] Event Scheduler: Loaded 0 events
2014-02-18 09:21:25 13472 [Note] wampmysqld: ready for connections.
Version: '5.6.12-log'  socket: ''  port: 3306  MySQL Community Server (GPL)


Esto es debido al que tengo instalado el servicio IIS de windows.

Para resolver este problema existen muchas opciones que tienes que testear, las cuales puedes encontrar con una simple busqueda en Google. A continuacion dejare el link que a mi me ha ayudado a resolver el problema:

 http://forum.wampserver.com/read.php?2,73392

De forma general de todas las opciones que hablan, yo desactive IIS y cambie el puerto de wampserver a 8080.


lunes, 17 de febrero de 2014

Mide que tan rapido carga tu sitio web

La rapidez con la que un usuario carga tu pagina es muy importante. Tu visitante puede  desesperarse y abandonar tu sitio en cuestión de segundos. Por esa razón siempre es bueno optimizar nuestros sitios web para que carguen con la mayor brevedad posible.

Para ayudarnos con esto Google nos ofrece una herramienta de medición llamada PageSpeed con la cual nos guiara por el proceso de optimizacion con los pasos a seguir.  PageSpeed es muy facil de usar solamente escribe la url de tu sitio web y das click en analizar.

De inmediato veras el resultado de tu web valorado para moviles y escritorio. Al mismo tiempo  te muestra recomendaciones de como hacer la optimizacion para tu sitio. Pero ojo no te esfuerces demasiado en conseguir el puntaje de 100, como dije son recomendaciones no es algo obligatorio que tienes que conseguir, pero siempre es bueno tener un buen puntaje.





Tal vez usar jquery no sea necesario

El titulo es mi traducción personal a un articulo muy interesante que encontré sobre el uso excesivo de jquery en nuestros proyectos web. Se que jquery nos ahorra muchas lineas de código y nos hace la vida mas fácil , pero también es bueno saber que podemos obtener el mismo resultado sin usar jquery como dependencia en nuestros proyectos solo con código nativo javascript de los navegadores.

Recomiendo dar una ojeada a los siguientes links con muchos ejemplos de como hacer las cosas sin usar jquery





sábado, 1 de febrero de 2014

Consejos para hacer pruebas de rendimiento con Google Chrome

En un día normal cuando quieres probar alguna app web, usas Google Chrome como todo usuario normal lo haria, pruebas como cargan las paginas, imágenes, scripts, ect. Una vez terminado esto sacas tus tiempos y empiezas hacer optimizaciones.

No hay ningún problema con esto con excepción de que no es una prueba justamente adecuada, por que lo que necesitas es un entorno de pruebas limpio. Esto es importante cuando medimos la calidad y rendimiento de la experiencia web que creamos, cuanto mas rápida tu web mejor.

Esto normalmente es llamado una Cleanroom , que viene siendo que mantengas tu entorno ordenado y limpio antes de usarlo. Como desarrolladores tenemos múltiples extensiones instaladas , apps y programas por ahí en nuestro sistema operativo. Algunas de ellas corriendo en el background las cuales ya habíamos olvidado que estaban ahí hasta que las necesitamos de nuevo.

Para usuarios normales esto no causa de mayor problemas, pero como desarrolladores web necesitamos tener mucho cuidado con esto, por que estas apps y extensiones son susceptibles a las mismas reglas de uso de memoria y recursos del sistema como toda aplicación normal.  Ahora si estas probando tu aplicación en el navegador con todas estas extensiones y apps instaladas esto puede afectar los resultados de tus pruebas, los cuales no reflejan el verdadero resultado.

He leído de algunos desarrolladores que han pasado horas tratando de optimizar sus aplicaciones sin éxito solo para descubrir que el problema no era su aplicación sino una extensión que tenia instalada.

Con Google Chrome podemos tener una cleanroom para nuestras pruebas usando un perfil de usuario nuevo, guia para esto en este link :


Tambien Google nos enseña 2 opciones para crear una cleanroom para nuestras pruebas en este link :


En general algunas reglas a seguir para realizar nuestras pruebas :

Prueba tu navegador con un perfil de usuario limpio 
Asegurate que no tienes apps y extensiones corriendo
Cierra ventanas y tabs secundarias

Otros navegadores pueden ser configurados de la misma manera.