Jekyll2021-12-14T16:44:44+00:00https://vifrac.com/feed.xmlData BlogUn lugar para hablar de desarrollo WEB, análisis de datos, marketing digital, entre otras cositas.Victor FrancoUn blog alojado en GitHub pages!2021-12-01T07:41:35+00:002021-12-01T07:41:35+00:00https://vifrac.com/desarrollo%20web/an%C3%A1lisis%20de%20datos/marketing%20digital/welcome<p>Con el año nuevo vienen retos nuevos, uno de mis propósitos para este año es contribuir desde mis experiencias a la comunidad que me apasiona, por ello les doy la bienvenida a mi blog, donde podremos intercambiar opiniones sobre desarrollo WEB, análisis de datos, marketing digital, entre otras cositas.</p>
<p>Próximamente les comentaré sobre el diseño de este blog, que tecnologías utilicé y como pueden ustedes re-crear uno con su sello personal, claro está, todo esto con herramientas Open Source, lo que nos dará una ventaja muy importante pues solo invertiremos tiempo y pasión por aprender.</p>
<p>Espero al ver las próximas entradas les sean de mucha ayuda y por supuesto ustedes tambien se animen a compartir sus experiencias en la “red de redes”.</p>Victor FrancoCon el año nuevo vienen retos nuevos, uno de mis propósitos para este año es contribuir desde mis experiencias a la comunidad que me apasiona, por ello les doy la bienvenida a mi blog, donde podremos intercambiar opiniones sobre desarrollo WEB, análisis de datos, marketing digital, entre otras cositas.Qué es Ruby y por qué usarlo2021-07-27T03:10:35+00:002021-07-27T03:10:35+00:00https://vifrac.com/ruby/Ruby<p>Ruby es un lenguaje de programación interpretado, reflexivo y orientado a objetos (todo es un objeto, incluso los números). Combina una sintaxis inspirada en Python y Perl con características de programación orientada a objetos similares a Smalltalk. Comparte también funcionalidad con otros lenguajes de programación como Lisp, Lua, Dylan y CLU. Además de todo esto es totalmente libre. No sólo gratis, sino también libre para usarlo, copiarlo, modificarlo y distribuirlo.</p>
<ul>
<li>Es de tipado dinámico, osea las variables no están asociadas a un tipo de dato específico (entero, string, boleano, float, etc) permitiendonos realizar cambios en tiempo de ejecución.</li>
<li>Es interpretado, una cualidad que nos permite mayor agilidad al momento de ejecutar nuestro programa pues ya no será necesario compilar el programa, así como tampoco necesitaremos binarios para cada uno de los sistemas operativos donde lo ejecutaremos, existen varios interpretes en Ruby CRuby, JRuby, Mruby, Rubinius, Opal, RubyMotion.</li>
<li>DRY, No te repitas (en inglés Don’t Repeat Yourself, también conocido como Una vez y sólo una) según este principio toda pieza de información nunca debería ser duplicada debido a que la duplicación incrementa la dificultad en los cambios y evolución posterior, puede perjudicar la claridad y crear un espacio para posibles inconsistencias.</li>
<li>La filosofía de Ruby es hacer la programación más humana, mejorar la productividad y felicidad del desarrollador, siguiendo los principios de una buena interfaz de usuario, sostiene que el diseño de sistemas necesita enfatizar las necesidades humanas más que las de la máquina, su objetivo es que cuando te sientas a leer el código sea más natural.</li>
<li>Es un lenguaje que nos permite realizar metaprogramación - “Es la habilidad de usar código para generar código”</li>
<li>También nos permite crear DSL o Lenguaje específico de dominio, que son herramientas increíblemente poderosas para facilitar la programación o configuración de sistemas complejos, o programas dedicados a resolver un problema en particular.</li>
<li>Ruby posee una comunidad bastante activa y a sus paquetes o librerías se les conoce como “gemas” actualmente existen unas 161.000 gemas aprox, que se han descargado alrededor de 55 millones de veces.</li>
<li>Esta muy bien diseñado al punto que a inspirado a otras tecnologías como elixir o CoffeeScript, D, Groovy, Falcon y Swift.</li>
<li>El ecosistema ruby es muy completo, el lenguaje es utilizado para
<ul>
<li>WEB con frameworks como Ruby on Rails, Sinatra, Rack, Grape</li>
<li>Mobile, RubyMotion es una implementación del lenguaje Ruby para la creación de aplicaciones en iOS, OS X y Android.</li>
<li>Utilidades de terminal, lo que te imagines un ejemplo es HomeBrew</li>
<li>Aplicaciones gráficas (programas de escritorio) QT, SWING, Ruby GTK, Shoes, FxRuby, Zenity,VisualRuby, QtRuby, SharedDevelop</li>
</ul>
</li>
</ul>
<p>Creo que la mejor forma de aprender es enseñar, por si les interesa tenemos un server en Discord “Aprende Ruby On Rails” donde tocamos temas referentes a Ruby y Ruby on Rails, son bienvenidos a compartir sus experiencias les dejo el link <a href="https://discord.gg/P4wZGsQ">https://discord.gg/P4wZGsQ</a></p>
<ul>
<li>Conceptos extraídos de:
<ul>
<li>Ruby <a href="https://www.ruby-lang.org/es/about/">https://www.ruby-lang.org/es/about/</a></li>
<li>Gemas <a href="https://rubygems.org/">https://rubygems.org/</a></li>
<li>Tipado dinámico <a href="https://charlascylon.com/2017-05-10-dynamic-vs-static">https://charlascylon.com/2017-05-10-dynamic-vs-static</a></li>
<li>Lenguajes compilados e interpretados
<ul>
<li><a href="https://blog.makeitreal.camp/lenguajes-compilados-e-interpretados/">https://blog.makeitreal.camp/lenguajes-compilados-e-interpretados/</a></li>
<li><a href="https://www.toptal.com/ruby/the-many-shades-of-the-ruby-programming-language">https://www.toptal.com/ruby/the-many-shades-of-the-ruby-programming-language</a></li>
</ul>
</li>
<li>Filosofía Ruby
<ul>
<li><a href="https://www.informit.com/articles/article.aspx?p=18225">https://www.informit.com/articles/article.aspx?p=18225</a></li>
<li><a href="https://www.artima.com/intv/ruby.html">https://www.artima.com/intv/ruby.html</a></li>
</ul>
</li>
<li>Don’t Repeat Yourself (DRY) <a href="http://joaquin.medina.name/web2008/documentos/informatica/documentacion/logica/OOP/Principios/2012_07_30_OopNoTeRepitas.html">http://joaquin.medina.name/web2008/documentos/informatica</a><a href="http://joaquin.medina.name/web2008/documentos/informatica/documentacion/logica/OOP/Principios/2012_07_30_OopNoTeRepitas.html">/documentacion/logica/OOP/Principios/2012_07_30_OopNoTeRepitas.html</a></li>
<li>Metaprogramación <a href="https://medium.com/@hackvan/entendiendo-la-metaprogramaci%C3%B3n-con-ruby-7a0360ee67e7">https://medium.com/@hackvan/entendiendo-la-metaprogramación-con-ruby-7a0360ee67e7</a></li>
<li>DSL <a href="https://www.toptal.com/ruby/ruby-dsl-metaprogramming-guide">https://www.toptal.com/ruby/ruby-dsl-metaprogramming-guide</a></li>
<li>Ruby Influencia otros lenguajes
<ul>
<li><a href="https://royalsocietypublishing.org/doi/10.1098/rsif.2015.0249">https://royalsocietypublishing.org/doi/10.1098/rsif.2015.0249</a></li>
<li><a href="https://es.slideshare.net/AlexanderEcheverra/lenguaje-de-programacin-ruby-69781302">https://es.slideshare.net/AlexanderEcheverra/lenguaje-de-programacin-ruby-69781302</a></li>
</ul>
</li>
<li>Ecosistema Ruby
<ul>
<li><a href="https://www.jetbrains.com/lp/devecosystem-2020/">https://www.jetbrains.com/lp/devecosystem-2020/</a></li>
<li><a href="https://www.jetbrains.com/es-es/lp/devecosystem-2020/ruby/">https://www.jetbrains.com/es-es/lp/devecosystem-2020/ruby/</a></li>
</ul>
</li>
</ul>
</li>
</ul>Victor FrancoRuby es un lenguaje de programación interpretado, reflexivo y orientado a objetos (todo es un objeto, incluso los números). Combina una sintaxis inspirada en Python y Perl con características de programación orientada a objetos similares a Smalltalk. Comparte también funcionalidad con otros lenguajes de programación como Lisp, Lua, Dylan y CLU. Además de todo esto es totalmente libre. No sólo gratis, sino también libre para usarlo, copiarlo, modificarlo y distribuirlo.Metodologías de aprendizaje2020-10-07T18:59:35+00:002020-10-07T18:59:35+00:00https://vifrac.com/ingles/metolodol%C3%ADgas/curva%20del%20olvido/m%C3%A9todo%20leitner/metodolog%C3%ADas%20de%20aprendizaje/metodologias_de_aprendizaje<p>Intentare explicar algunos conceptos referentes a métodos de aprendizaje que normalmente implemento en mis sesiones de estudio, espero sean de utilidad para ustedes, hoy pondremos en practica ejemplos para aprender ingles.</p>
<p>Según Noam Chomsky, máximo exponente de la escuela generativista, los humanos tienen innata una gramática universal (concepto abstracto que abarca todas las lenguas humanas).</p>
<p>La diferencia entre la gramática universal (GU) y las distintas gramáticas particulares (GGPP) radica en que la primera se relaciona con la disposición de un conjunto de principios ―como el «principio de proyección», el «principio de dependencia de la estructura», el «principio de ligamiento», la «teoría del caso», el «criterio temático» y algunos otros―, mientras que las GGPP se vinculan a las múltiples variaciones que pueden hacer las lenguas de los parámetros de esos principios. Las GGPP no son más que combinaciones de elementos finitos que pueden dar lugar a múltiples lenguas e idiomas que en esta teoría son llamadas lengua.</p>
<p>Stuart Webb sugiere que la clave es la frecuencia con la que las palabras que aprendemos aparecen en el uso diario del idioma que estamos estudiando. Si aprendes solo 800 de las palabras más utilizadas en inglés, podrá comprender el 75% del idioma tal como se habla en la vida normal, pero para comprender a los actores en el cine o la televisión necesitaremos conocer al menos las 3.000 palabras más comunes, si queremos familiarizarnos con el idioma escrito, debemos aprender de 8.000 a 9.000.</p>
<p>Por otro lado el autor de Sobre la memoria (1885), Hermann Ebbinghaus, nos sugiere una medida en cuanto a la curva del olvido o la pérdida de retentiva en el transcurso tiempo y que ello depende en gran medida factores como la dificultad de la materia (por ejemplo si es absurdo o tiene sentido), su representación (véase regla mnemotécnica) y factores fisiológicos como el estrés y el sueño.</p>
<figure>
<a href="/assets/images/spacedRepetition.png"><img src="/assets/images/spacedRepetition.png" /></a>
<figcaption>Repeticion espaciada y curva del olvido.</figcaption>
</figure>
<p>Dicha curva del olvido la podemos contrarrestar con metodologías de aprendizaje espaciado como el método Leitner, se trata de un sistema que consiste en introducir fichas con información en distintas cajas. La lógica del sistema hace que los temas más sencillos de aprender aparezcan con menos frecuencia, mientras que los temas complicados aparecen un mayor número de veces.</p>
<figure>
<a href="/assets/images/metodoLeitner1.jpg"><img src="/assets/images/metodoLeitner1.jpg" /></a>
<figcaption>Cajas leitner.</figcaption>
</figure>
<figure>
<a href="/assets/images/metodoLeitner2.png"><img src="/assets/images/metodoLeitner2.png" /></a>
<figcaption>Metodo leitner.</figcaption>
</figure>
<p>De modo que para probar si hay algo de verdad en lo que estos autores sugieren basta con aprenderse 24 palabras diarias (2 palabras por hora en un espacio de 12 horas) durante 34 días, lo que al finalizar este tiempo tendremos en nuestro vocabulario 800 nuevas palabras de las más frecuentemente utilizadas en ingles.</p>
<p>Conceptos extraídos de:</p>
<ul>
<li>Noan Chomsky
<ul>
<li><a href="https://chomsky.info/articles/">https://chomsky.info/articles/</a></li>
<li><a href="https://es.wikipedia.org/wiki/Noam_Chomsky">https://es.wikipedia.org/wiki/Noam_Chomsky</a></li>
<li><a href="https://i.pinimg.com/564x/7c/38/ae/7c38aeba9541c99e968e98635e7e4a13.jpg">https://i.pinimg.com/564x/7c/38/ae/7c38aeba9541c99e968e98635e7e4a13.jpg</a></li>
</ul>
</li>
<li>Stuart Webb
<ul>
<li><a href="https://www.bbc.com/mundo/noticias-44592024">https://www.bbc.com/mundo/noticias-44592024</a></li>
<li><a href="https://www.edu.uwo.ca/faculty-profiles/stuart-webb.html">https://www.edu.uwo.ca/faculty-profiles/stuart-webb.html</a></li>
</ul>
</li>
<li>Curva del olvido
<ul>
<li><a href="https://es.wikipedia.org/wiki/Hermann_Ebbinghaus">https://es.wikipedia.org/wiki/Hermann_Ebbinghaus</a></li>
<li><a href="https://www.youtube.com/watch?v=hrGbwutALpA">https://www.youtube.com/watch?v=hrGbwutALpA</a></li>
<li><a href="https://www.repeticionespaciada.com/">https://www.repeticionespaciada.com/</a></li>
</ul>
</li>
<li>Método Leitner
<ul>
<li><a href="https://psicocode.com/estudiante/un-metodo-de-estudio-divertido-el-sistema-leitner/">https://psicocode.com/estudiante/un-metodo-de-estudio-divertido-el-sistema-leitner/</a></li>
<li><a href="https://www.youtube.com/watch?v=4yzQIFWNHSc">https://www.youtube.com/watch?v=4yzQIFWNHSc</a></li>
<li><a href="https://www.youtube.com/watch?v=TB7sHXSgk6w">https://www.youtube.com/watch?v=TB7sHXSgk6w</a></li>
</ul>
</li>
</ul>Victor FrancoIntentare explicar algunos conceptos referentes a métodos de aprendizaje que normalmente implemento en mis sesiones de estudio, espero sean de utilidad para ustedes, hoy pondremos en practica ejemplos para aprender ingles.Herramietas que pueden ser de utilidad (links)2020-07-01T03:10:35+00:002020-07-01T03:10:35+00:00https://vifrac.com/desarrollo%20web/an%C3%A1lisis%20de%20datos/marketing%20digital/tools<p>Les dejo algunas herramientas que he recopilado y pueden ser de su interes!</p>
<h1 id="herramientas-">Herramientas <br /></h1>
<p>============================= <br />
Informacion sobre herramientas.
^-\s([\w].+)</p>
<ul>
<li>
<p><a href="#$1">$1</a></p>
</li>
<li>
<p>Siempre aprendiendo</p>
</li>
</ul>
<h3 id="indice">Indice</h3>
<ul>
<li><a href="#Lógica_de_programación">Lógica de programación</a></li>
<li>Siempre aprendiendo</li>
<li>Plataformas</li>
<li>Funcionalidades</li>
<li>Design</li>
<li>Material Design en Web</li>
<li>Íconos para developers!</li>
<li>Sitios para inspiración!</li>
<li>Colores</li>
<li>Frameworks</li>
<li>Ayuda para desarrolladores</li>
<li>Fuentes</li>
<li>Ruby</li>
<li>ShoesRB</li>
<li>Rails</li>
<li>Gemas Rails</li>
<li>javaScript!</li>
<li>Librerías android</li>
<li>API’s para Developers</li>
<li>CSS</li>
<li>Scraper</li>
<li>Games moviles</li>
<li>Machine lerning</li>
<li>Google Docs</li>
<li>Pentesting</li>
</ul>
<h3 id="lógica-de-programación">Lógica de programación<a name="Lógica_de_programación"></a></h3>
<ul>
<li>Ejercicios - <a href="https://projecteuler.net/">https://projecteuler.net/</a></li>
<li>Ejercicios - <a href="code.google.com/codejam">https://code.google.com/codejam/</a></li>
<li>Ejericicios - <a href="topcoder.com/community/competitive-programming/tutorials">https://www.topcoder.com/community/competitive-programming/tutorials/</a></li>
</ul>
<h3 id="siempre-aprendiendo">Siempre aprendiendo</h3>
<ul>
<li>CodeFights - <a href="codefights.com">https://codefights.com</a></li>
<li>Material Design Implementation in Android - <a href="speakerdeck.com/mathieu_calba">https://speakerdeck.com/mathieu_calba</a></li>
<li>Guideline, JSON Api - <a href="jsonapi.org">http://jsonapi.org/</a></li>
<li>Swift Data Structures - <a href="waynewbishop.com/swift">http://waynewbishop.com/swift</a></li>
<li>Compartir código en tiempo real, - CodeShare - <a href="codeshare.io">http://codeshare.io/</a></li>
<li>Rank paises por costos y beneficios para pdevelopers, NomadList - <a href="nomadlist.com">https://nomadlist.com</a></li>
<li>Startup Launch List - <a href="startuplaunchlist.com">http://startuplaunchlist.com/</a></li>
<li>LiveCodingTV - <a href="livecoding.tv">https://www.livecoding.tv/</a></li>
<li>Primer - <a href="yourprimer.com">https://www.yourprimer.com/</a></li>
<li>Lineas de tiempo - <a href="goo.gl/QFkhZE">https://goo.gl/QFkhZE</a></li>
<li>Visualizacion de información - <a href="goo.gl/ixXSpQ">https://goo.gl/ixXSpQ</a></li>
</ul>
<h3 id="plataformas">Plataformas</h3>
<ul>
<li>Carga de imagenes - Cloudinary - <a href="cloudinary.com">http://cloudinary.com</a></li>
<li>Proteccion de ataques DOS - Cludflare - <a href="cloudflare.com">https://www.cloudflare.com/</a></li>
<li>imagen en forma de poligonos - Kubist - <a href="williamngan.github.io/kubist">http://williamngan.github.io/kubist/</a></li>
<li>Mejor paginas de errores - <a href="better-error-pages.statuspage.io">https://better-error-pages.statuspage.io</a></li>
<li>Creador de escenas para landings, ImmagicPic - <a href="immagipic.com">http://www.immagipic.com/</a></li>
<li>Crear Slides - <a href="slides.com">http://slides.com/</a></li>
<li>Redimencionar imagenes, TinyPNG - <a href="tinypng.com">https://tinypng.com/</a></li>
<li>Diferencias de visualización entre android y IO, UI OH MY - <a href="uiohmy.com">http://uiohmy.com/</a></li>
<li>Descargar videos sin copyrigth, Coverr - <a href="coverr.co">http://www.coverr.co/</a></li>
<li>Crear documentacion, CodePicnic - <a href="codepicnic.com">https://codepicnic.com</a></li>
<li>Crear shapes y descargarlas en SVG, Paths - <a href="jxnblk.com/paths">http://jxnblk.com/paths</a></li>
<li>font-end / back-end, Meteor - <a href="meteor.com">https://www.meteor.com/</a></li>
</ul>
<h3 id="funcionalidades">Funcionalidades</h3>
<ul>
<li>Awesomplete - <a href="leaverou.github.io/awesomplete">https://leaverou.github.io/awesomplete</a></li>
<li>Crear animaciones en las fuentes dela pagina - DOM Animator - <a href="tholman.com/dom-animator">http://tholman.com/dom-animator/</a></li>
<li>Autocompletado y pistas en la caja de texto - <a href="twitter.github.io/typeahead.js">https://twitter.github.io/typeahead.js/</a></li>
<li>Animación para mas info, - FlipViewPager - <a href="github.com/Yalantis/FlipViewP">https://github.com/Yalantis/FlipViewP</a></li>
<li>Animaciones para andriod, - RecyclerView Animatorsyou - <a href="github.com/wasabeef/recyclerv">https://github.com/wasabeef/recyclerv</a></li>
<li>Creación de avatares - UI Faces - <a href="uifaces.com">http://uifaces.com/</a></li>
<li>Material Design Avatars - <a href="oxygenna.com/freebies/mate">http://www.oxygenna.com/freebies/mate</a>…</li>
<li>Busqueda avanzada local - SwiftType - <a href="swiftype.com">https://swiftype.com/</a></li>
<li>Crear carruseles - Slick - <a href="kenwheeler.github.io/slick">http://kenwheeler.github.io/slick/</a></li>
<li>Barra de progreso al estilo youtube - NProgress - <a href="ricostacruz.com/nprogress">http://ricostacruz.com/nprogress/</a></li>
<li>videos en un ciclo, Fancy Footage - <a href="fancyfootage.club">http://fancyfootage.club/</a></li>
<li>Scroll Infinito en Android - <a href="github.com/vinaysshenoy/mugen">https://github.com/vinaysshenoy/mugen</a></li>
<li>GEolocalizacion en angular, ngGeolocator - <a href="github.com/deiwin/ngGeolocator">https://github.com/deiwin/ngGeolocator</a></li>
<li>Visualizacion de datos en formato tabla, ClusterizeJS - <a href="nexts.github.io/Clusterize.js">http://nexts.github.io/Clusterize.js/</a></li>
<li>“Escribir” con imagenes, Type to Design - <a href="typetodesign.com">http://typetodesign.com/</a></li>
<li>Sacar principales colores de una imagen, - VibrantJS - <a href="jariz.github.io/vibrant.js">https://jariz.github.io/vibrant.js/</a></li>
<li>Mapas de calor, - HeatMapJS - <a href="patrick-wied.at/static/heatmapjs">https://www.patrick-wied.at/static/heatmapjs/</a></li>
<li>Visualización y dashboard, Slemma - <a href="slemma.com">https://slemma.com/</a></li>
<li>Tarjetas tipo tinder, - Koloda - <a href="github.com/Yalantis/Koloda">https://github.com/Yalantis/Koloda</a></li>
<li>Template portafolios, - Squeezebox - <a href="codyhouse.co/gem/squeezebox-portfolio-template">https://codyhouse.co/gem/squeezebox-portfolio-template</a></li>
<li>Convertir video a webem, - Webmjs - <a href="github.com/Kagami/webm.js">https://github.com/Kagami/webm.js</a></li>
<li>Verificar que soporta cada navegador, Modernizr - <a href="modernizr.com">https://modernizr.com/</a></li>
<li>Vsualizacion de videos, VideoJS 5.0 - <a href="videojs.com">http://videojs.com/</a></li>
</ul>
<h3 id="design">Design</h3>
<ul>
<li>Sweet Alert - <a href="tristanedwards.me/sweetalert">http://tristanedwards.me/sweetalert</a></li>
<li>Ridiculously Responsive Social Sharing Buttons - <a href="kurtnoble.com/labs/rrssb">http://kurtnoble.com/labs/rrssb/</a></li>
<li>Scrollorama - <a href="johnpolacek.github.io/scrollor">http://johnpolacek.github.io/scrollor</a></li>
<li>Animaciones para mostrar “cargando”, Loaders.css - <a href="connoratherton.com/loaders">http://connoratherton.com/loaders</a></li>
<li>Animacioes modales, Material Design Modals - <a href="codepen.io/ettrics/pen/Jdjdzp">http://codepen.io/ettrics/pen/Jdjdzp</a></li>
<li>Botones metalicos, Conical radians - <a href="codepen.io/thebabydino/pen/qdPRpN">https://codepen.io/thebabydino/pen/qdPRpN</a></li>
<li>Grit de columnas, Fluidable - <a href="fluidable.com">http://fluidable.com/</a></li>
<li>Mejorar el diseño de formularios, Epic Form & Input Field - - <a href="goo.gl/sVzFbC">https://goo.gl/sVzFbC</a></li>
<li>Ampliacion de bootstraps, Jasny Bootstrap - <a href="jasny.net/bootstrap">http://www.jasny.net/bootstrap/</a></li>
<li>Visualización de movimiento, PopMotion - <a href="popmotion.io">http://popmotion.io/</a></li>
</ul>
<h3 id="material-design-en-web">Material Design en Web</h3>
<ul>
<li><a href="google.com/design">http://www.google.com/design/</a></li>
<li><a href="polymer-project.org">https://www.polymer-project.org/</a></li>
<li><a href="fezvrasta.github.io/bootstrap">http://fezvrasta.github.io/bootstrap-</a></li>
<li><a href="materializecss.com">http://materializecss.com/</a></li>
<li><a href="ui.lumapps.com">http://ui.lumapps.com/</a></li>
<li><a href="materialup.com">http://www.materialup.com/</a></li>
<li>Precargado de - Material desing - <a href="git.aaronlumsden.com/material">http://git.aaronlumsden.com/material/</a></li>
<li>Material Design Concept for Whatsapp - <a href="goo.gl/366Qnv">https://goo.gl/366Qnv</a></li>
<li>Pull Down to Refresh - <a href="codepen.io/suez/pen/oXLroX">http://codepen.io/suez/pen/oXLroX/</a></li>
<li>Material Calendar - <a href="antoniodinardo.com/TEST/calendar">http://antoniodinardo.com/TEST/calendar/</a></li>
<li>Random palet color in material - <a href="codecrafted.net/randommaterial">http://codecrafted.net/randommaterial</a></li>
<li>MaterialUI - <a href="material-ui.com">http://material-ui.com</a></li>
<li>MDL - <a href="getmdl.io">http://www.getmdl.io</a></li>
</ul>
<h3 id="íconos-para-developers">Íconos para developers!</h3>
<ul>
<li>Transformicons - <a href="transformicons.com">http://www.transformicons.com/</a></li>
<li>Material Design Icons by Google - <a href="github.com/google/material-de">https://github.com/google/material-de</a>…</li>
<li>Font Awesome - <a href="fortawesome.github.io/Font-Awe">http://fortawesome.github.io/Font-Awe</a>…</li>
<li>SVG - <a href="alexk111.github.io/SVG-Morpheus">http://alexk111.github.io/SVG-Morpheus/</a></li>
<li>The Noun Project - <a href="thenounproject.com">http://thenounproject.com/</a></li>
<li><a href="flaticons.net">http://flaticons.net/</a></li>
<li><a href="flaticon.com">http://www.flaticon.com/</a></li>
<li>Privicons - <a href="github.com/iamjessklein/privi">https://github.com/iamjessklein/privi</a></li>
<li>To Icon - <a href="toicon.com">http://www.toicon.com/</a></li>
<li>Nucleo Icons - <a href="dribbble.com/shots/2015061-Nu">https://dribbble.com/shots/2015061-Nu</a></li>
<li>Evil Icons - <a href="evil-icons.io">http://evil-icons.io/</a></li>
<li>Happicons - <a href="uisurf.com/downloads/happycons">http://uisurf.com/downloads/happycons/</a></li>
<li>IconateJS - <a href="bitshadow.github.io/iconate">http://bitshadow.github.io/iconate/</a></li>
<li>Smarticons - <a href="smarticons.co">https://smarticons.co/</a></li>
<li>Endless Icons - <a href="endlessicons.com">http://www.endlessicons.com/</a></li>
<li>Free isometric material icons - <a href="dribbble.com/shots/2110122-Free-set-of-Isometric-Material-Icons">https://dribbble.com/shots/2110122-Free-set-of-Isometric-Material-Icons</a></li>
<li>Smart House Icons - <a href="dribbble.com/shots/2084609-Smart-House-Icon-Set-Free">https://dribbble.com/shots/2084609-Smart-House-Icon-Set-Free</a></li>
<li>File Type Icons - <a href="epicpxls.com/items/epic-landing-page-icons">https://www.epicpxls.com/items/epic-landing-page-icons</a></li>
<li>Cute Icons - <a href="designshock.com/cute-icons">http://www.designshock.com/cute-icons/</a></li>
<li>Logos en SVG - <a href="gilbarbara.github.io">http://gilbarbara.github.io</a></li>
<li>IconMoon - <a href="icomoon.io">https://icomoon.io</a></li>
<li>Birply Icons - <a href="iconstore.co/icons/birply-icons">http://iconstore.co/icons/birply-icons/</a></li>
</ul>
<h3 id="sitios-para-inspiración">Sitios para inspiración!</h3>
<ul>
<li>1000 Chrome Experiments - <a href="1000.chromeexperiments.com">http://1000.chromeexperiments.com/</a></li>
<li>CodePen - <a href="codepen.io">http://codepen.io/</a></li>
<li>Awwwards - <a href="awwwards.com">http://www.awwwards.com/</a></li>
<li>CSS Winner - <a href="csswinner.com">http://www.csswinner.com/</a></li>
<li>Dribbble - <a href="dribbble.com">https://dribbble.com/</a></li>
<li>Coder Wall - <a href="coderwall.com">https://coderwall.com/</a></li>
<li>30 species in 30 elements - <a href="species-in-pieces.com">http://www.species-in-pieces.com/</a></li>
<li>Websites over the years - <a href="tutorialzine.com">http://tutorialzine.com</a></li>
<li>Interface para apps To DO UI - Kit - <a href="invisionapp.com/do">http://www.invisionapp.com/do</a></li>
<li>Chill the Lion - <a href="codepen.io/Yakudoo/pen/YXxmYR">http://codepen.io/Yakudoo/pen/YXxmYR</a></li>
<li>Landing page, Lapa - <a href="lapa.ninja">http://lapa.ninja/</a></li>
<li>Mockups con gatos, CatKit - <a href="github.com/cesarferreira/CatKit">https://github.com/cesarferreira/CatKit</a></li>
<li>StyleGuidesIO - <a href="styleguides.io">http://styleguides.io/</a></li>
<li>Really Good Emails - <a href="reallygoodemails.com">http://reallygoodemails.com/</a></li>
<li>Crear imagenes - <a href="goo.gl/K2EYwJ">https://goo.gl/K2EYwJ</a></li>
</ul>
<h3 id="colores">Colores</h3>
<ul>
<li>Paleta Colores - <a href="coolors.co/898952-b2945b-d0e562-b6d369-93c48b">https://coolors.co/898952-b2945b-d0e562-b6d369-93c48b</a></li>
<li>Degradados - <a href="uigradients.com">http://uigradients.com/</a></li>
<li>Shade - <a href="jxnblk.com/shade">http://jxnblk.com/shade</a></li>
<li>Conical gradients today - <a href="lea.verou.me/2015/06/conical-gradients-today">http://lea.verou.me/2015/06/conical-gradients-today/</a></li>
<li>ColorChart - <a href="htmlcolorcodes.com/color-chart">http://htmlcolorcodes.com/color-chart/</a></li>
<li>Cohesive Colors - <a href="javier.xyz/cohesive-colors">http://javier.xyz/cohesive-colors/</a></li>
</ul>
<h3 id="frameworks">Frameworks</h3>
<ul>
<li>Bootflat - <a href="bootflat.github.io/index.html">http://bootflat.github.io/index.html</a></li>
<li>Angular 2 - <a href="angular.io">https://angular.io</a></li>
<li>FlexBox Grid - <a href="flexboxgrid.com">http://flexboxgrid.com/</a></li>
<li>FlipSide - <a href="lab.hakim.se/flipside">http://lab.hakim.se/flipside/</a></li>
<li>Aplicaciones web para java y scala, Play Framework - <a href="playframework.com">https://www.playframework.com/</a></li>
<li>Lumen by Laravel - <a href="lumen.laravel.com">http://lumen.laravel.com/</a></li>
<li>Crear aplicaciones medicas - ResearchKit - <a href="github.com/ResearchKit/Resear">https://github.com/ResearchKit/Resear</a>…</li>
<li>CRea interfaces descriptivas con lenguaje natural, - SemanticUI - <a href="semantic-ui.com">http://semantic-ui.com/</a></li>
</ul>
<h3 id="ayuda-para-desarrolladores">Ayuda para desarrolladores</h3>
<ul>
<li>Ver quien trabaja con tecnologías espesificas StackShare - <a href="techstacks.io">https://techstacks.io/</a></li>
<li>Ver cuanto codigo escribes, TechStacksIO - <a href="techstacks.io">http://techstacks.io/</a></li>
<li>Pedir ayuda, OfficeHours - <a href="officehours.io">https://officehours.io/</a></li>
<li>ver que tecnologia maneja una pagina, - wappalyzer - <a href="wappalyzer.com">https://www.wappalyzer.com/</a></li>
</ul>
<h3 id="fuentes">Fuentes</h3>
<ul>
<li>Google Fonts en Github - <a href="github.com/google/fonts">https://github.com/google/fonts</a></li>
</ul>
<h3 id="ruby">Ruby</h3>
<ul>
<li>Ruby DSL - <a href="leighhalliday.com/creating">http://leighhalliday.com/creating</a></li>
<li>Crear interfaces con Ruby, ShoesRB - <a href="shoesrb.com">http://shoesrb.com/</a></li>
</ul>
<h3 id="shoesrb">ShoesRB</h3>
<ul>
<li><a href="shoesrb.com/Angular">http://shoesrb.com/Angular</a></li>
<li>Introducción al nuevo route de Angular - <a href="medium.com/angularjs-meetup-s">https://medium.com/angularjs-meetup-s</a></li>
<li>Libreria de graficos, N3Charts - <a href="n3-charts.github.io/line-chart">http://n3-charts.github.io/line-chart</a></li>
</ul>
<h3 id="rails">Rails</h3>
<ul>
<li>Acceder a api’s, RestClient - <a href="github.com/rest-client/rest-client">https://github.com/rest-client/rest-client</a></li>
<li>Hora de país donde se esta viendo la pagina, - Local Time by Basecamp - <a href="github.com/basecamp/local_time">https://github.com/basecamp/local_time</a></li>
<li>Material Icons para Rails - <a href="github.com/Angelmmiguel/material_icons">https://github.com/Angelmmiguel/material_icons</a></li>
</ul>
<h3 id="gemas-rails">Gemas Rails</h3>
<ul>
<li>Control imput, Dynaspan - <a href="github.com/danielpclark/dynaspan">https://github.com/danielpclark/dynaspan</a></li>
</ul>
<h3 id="javascript">javaScript!</h3>
<ul>
<li>Visualización de datos, Data-Driven Documents - <a href="d3js.org">https://d3js.org</a></li>
<li>Visualización de animaciones, - Velocity.js - <a href="velocityjs.org">http://velocityjs.org/</a></li>
<li>Visualización de código en web, Pims - <a href="prismjs.com">https://prismjs.com/</a></li>
<li>Visualización de código en web, Ace.JS - <a href="ace.c9.io">https://ace.c9.io/</a></li>
<li>Visualización de imagenes tipo instagram, masonery - <a href="masonry.desandro.com">https://masonry.desandro.com/</a></li>
<li>Screencats, JSCAPTURE - <a href="mgechev.github.io/jscapture">https://mgechev.github.io/jscapture/</a></li>
<li>Visualización de fechas, momentJS - <a href="momentjs.com">https://momentjs.com/</a></li>
<li>Verificar codigo de JS, IS.JS - <a href="is.js.org">https://is.js.org/</a></li>
<li>Generacion de vistas interactivas (componentes) - React - <a href="facebook.github.io/react/index">https://facebook.github.io/react/index</a></li>
<li>Alternativa a phonegap y proyecto cordoba - React Native - <a href="facebook.github.io/react-native">http://facebook.github.io/react-native/</a></li>
<li>Simular scroll con narrativa en 3d, - SpaceJS - <a href="slashie.org/space.js">http://www.slashie.org/space.js/</a></li>
<li>Vizualizacion de imagenes - Layzr.js - <a href="callmecavs.github.io/layzr.js">http://callmecavs.github.io/layzr.js/</a></li>
<li>Compilador de emmaSC6 - Babel - <a href="babeljs.io">http://babeljs.io/</a></li>
<li>Notificaciones de aplicaciones - MessengerJS - <a href="github.hubspot.com/messenger/d">http://github.hubspot.com/messenger/d</a></li>
<li>Plantillas para javascrip (templating js) - HoganJS - <a href="twitter.github.io/hogan.js">http://twitter.github.io/hogan.js/</a></li>
<li>Validación y componentes para bootstrap, SmokeJS - <a href="alfredobarron.github.io/smoke/#">http://alfredobarron.github.io/smoke/#/</a></li>
<li>Modificar la barra de scroll, jQuery Custom Scrollbar - <a href="manos.malihu.gr/jquery-custom-content-scroller">http://manos.malihu.gr/jquery-custom-content-scroller/</a></li>
<li>Visualizar el con el scroll, ScrollRevealJS - <a href="scrollrevealjs.org">http://scrollrevealjs.org/</a></li>
<li>crear apps multiplataforma, NativeScript - <a href="nativescript.org">https://www.nativescript.org/</a></li>
</ul>
<h3 id="librerías-android">Librerías android</h3>
<ul>
<li>Los 3 botoncitos de “typing…”, - Jumping Beans - <a href="github.com/frakbot/JumpingBeans">https://github.com/frakbot/JumpingBeans</a></li>
<li>Intro para apps android, AppIntro - <a href="github.com/PaoloRotolo/AppIntro">https://github.com/PaoloRotolo/AppIntro</a></li>
<li>Logearse en con estrategias OAUTH, - Hemdall.droid - <a href="github.com/trivago/Heimdall.droid">https://github.com/trivago/Heimdall.droid</a></li>
<li>Vista que sale de abajo. BottomSheet - <a href="github.com/Flipboard/bottomsheet">https://github.com/Flipboard/bottomsheet</a></li>
<li>para acceder - sqlLITE, Storio - <a href="github.com/pushtorefresh/storio">https://github.com/pushtorefresh/storio</a></li>
</ul>
<h3 id="apis-para-developers">API’s para Developers</h3>
<ul>
<li>google developers - <a href="developers.google.com/apis-explorer/#p">https://developers.google.com/apis-explorer/#p/</a></li>
<li>Mandar mensajes SMS , Twilio - <a href="twilio.com">https://www.twilio.com/</a></li>
<li>Notificaciones entre plataformas, Parse - - <a href="parseplatform.org">https://parseplatform.org/</a></li>
<li>Pagos PAYPAL - <a href="developer.paypal.com">https://developer.paypal.com/</a></li>
<li>Aplicaciones en real time (chat, eventos, enviar datos), PUBNUB - <a href="pubnub.com">https://www.pubnub.com/</a></li>
<li>Analytics para desarrolladores, <a href="KEEN.IO">http://KEEN.IO</a> - <a href="keen.io">https://keen.io/</a></li>
<li>convierte api-rest en una interface de java - Andriod - Retrofit - <a href="square.github.io/retrofit">http://square.github.io/retrofit/</a></li>
<li>Compilado de apis - <a href="github.com/toddmotto/public-apis">https://github.com/toddmotto/public-apis</a></li>
</ul>
<h3 id="css">CSS</h3>
<ul>
<li>Toolkit guia para fron-end de github - Primer - <a href="primercss.io">http://primercss.io/</a></li>
<li>Diseño de precargados, - Loaders.css - <a href="connoratherton.com/loaders">http://connoratherton.com/loaders</a></li>
<li>Animacion de elementos en CSS - BounceJS - <a href="bouncejs.com">http://bouncejs.com/</a></li>
<li>Animacion de elementos, - AnimatePlus - <a href="github.com/bendc/animate-plus">https://github.com/bendc/animate-plus</a></li>
<li>Animación de elementos , GSAP - <a href="greensock.com">http://greensock.com/</a></li>
<li>Crear sombras-, - Long Shadows - <a href="sandbox.juan-i.com/longshadows">http://sandbox.juan-i.com/longshadows/</a></li>
</ul>
<h3 id="scraper">Scraper</h3>
<ul>
<li>Informacion sobre algo / anonimato web - <a href="github.com/AmdAdam/theHarvester">https://github.com/AmdAdam/theHarvester</a></li>
</ul>
<h3 id="games-moviles">Games moviles</h3>
<ul>
<li>interface para crear juegos moviles, Mobile Game GUI - <a href="graphicburger.com/mobile-game-gui">https://graphicburger.com/mobile-game-gui/</a></li>
</ul>
<h3 id="machine-lerning">Machine lerning</h3>
<ul>
<li>Annyang speech recognition - <a href="talater.com/annyang">https://www.talater.com/annyang/</a></li>
<li>Parsear datos con diferente informacion, KnwlJS - <a href="loadfive.com/os/knwl">http://loadfive.com/os/knwl/</a></li>
</ul>
<h3 id="google-docs">Google Docs</h3>
<p>-Mejorar funcionalidades - <a href="makeuseof.com/tag/google-docs-addons">https://www.makeuseof.com/tag/google-docs-addons/</a></p>
<h3 id="pentesting">Pentesting<a name="Pentesting"></a></h3>
<ul>
<li>Base de datos de exploit’s - <a href="exploit-db.com">https://www.exploit-db.com</a></li>
<li>Expreciones regex - <a href="https://www.debuggex.com/">https://www.debuggex.com/</a></li>
<li>Expreciones regex - <a href="https://regexr.com/">https://regexr.com/</a></li>
<li>Historial web - <a href="web.archive.org">https://web.archive.org</a></li>
<li>De quién es el dominio - <a href="whois.sc">http://whois.sc</a></li>
<li>
<h2 id="-">-</h2>
</li>
</ul>Victor FrancoLes dejo algunas herramientas que he recopilado y pueden ser de su interes!