Posts etiquetados ‘JavaScript’

Curso completo en español y en vídeo de Angular JS gratis

Ya nos tiene acostumbrados el maestro “Jesús Conde” a la calidad y actualidad de sus cursos, y justo para finalizar este año y empezar con pie derecho el próximo, llega de su creación el curso completo de Angular JS, herramienta bastante usada en la actualidad.

angularjs

Así que después del salto puedes seguir este curso el cual consta de 98 cortos vídeos, que nos llevan desde sus fundamentos hasta practicas que sin duda serán de gran utilidad a la hora de desarrollar profesionalmente en esta tecnología.

Leer el resto de la entrada »

Curso en vídeo de Node.js en Español

No cabe duda de la gran importancia que Node.js tiene en este momento. Por si no lo sabes, Node.js permite la ejecución de Javascript en la capa del servidor, comportándose como cualquier lenguaje del lado del servidor como lo es PHP, con entrada y salida de datos, esta basado en Javascript, su arquitectura es orientada a eventos y usa el motor Javascript V8.

nodejs

Gracias a el uso de Javascript es liviano y rápido, así mismo mediante el uso de sockets se puede aprovechar una conexión bi-direccional en tiempo real muy eficiente, esto lo hace ideal para aplicaciones que presentan datos en tiempo real como chats, entornos colaborativos, videojuegos y un amplio etc.

Que mejor que el maestro de maestros Jesús Conde, para enseñarnos este lenguaje tan de moda hoy día. En 29 vídeos en español y totalmente disponibles desde su canal, el maestro nos enseña Node.js desde lo básico hasta el uso de socket.io, siempre con practicas muy acertadas como la creación de un chat, además nos adentra al uso de MongoDB con Node.js. Si quieres aprender Node.js te super recomiendo estos 29 vídeos gratuitos, los puedes ver después del salto.

Leer el resto de la entrada »

SCRAPfy, editor de código simultaneo Online y gratuito

scrapfy

Navegando la Web me encuentro este interesante editor de código Online llamado “SCRAPfy“, el cual nos permite escribir código de forma colaborativa. Basta con seleccionar el lenguaje en el que deseamos escribir (PHP, Ruby, Python, Javascript, HTML, JSON, SQL, CSS, etc), luego pulsamos en el botón “Create”, después se nos generará una URL, la cual podremos compartir con otros programadores para trabajar de forma simultanea en tiempo real.

El editor nos resalta la sintaxis del lenguaje en el que estamos elaborando el código, también muestra el cursor en diferentes colores para cada colaborador al estilo de Google docs, además integra un chat y un chat con voz para comunicarnos con los otros programadores, también nos proporciona la posibilidad de cambiar de lenguaje una vez estamos trabajando, podremos descargar el archivo una ves completado y además podremos compartirlo en Gist.

SCRAPfy esta creado con Node.js, Peer js, Angular Js, WebRTC y AceCode Editor.

Sin duda una excelente herramienta para dar soporte, para trabajo (peer to peer) o para encontrar errores más fácilmente trabajando en equipo.

[Te puede interesar: Curso en vídeo de Django]

Enlace
sitio SCRAPfy

Bento, directorio de tutoriales y cursos Online para Desarrollo Web

bento

Navegando la Web, me encuentro un interesante directorio enfocado específicamente al desarrollo Web llamado “Bento“, el cual nos brinda enlaces a recursos como tutoriales, vídeos, cursos Online, guías interactivas, entre otros; con temas como HMTL, Javascript, CSS, Bases de datos como (MongoDB, CouchDB, etc), lenguajes de programación como (PHP, Python, Ruby, etc), además temas de desarrollo móvil como (Android, Windows Phone, etc) y la lista continua.

Algo interesante del directorio, es que si accedes a un tema especifico, después te proporciona los enlaces con los temas que deberías seguir estudiando, así nos sirve de guía para aprender y no perdernos en el mar de la información.

El directorio proporciona enlaces a sitios como Codecademy, Udacity, Tuts y a muchos más, que finalmente son los que nos entregan el material.

Sin duda un buen directorio para personas que desean aprender de desarrollo Web, y para aquellos avanzados que desean continuar aprendiendo.

Enlace
sitio Bento

oozled, cientos de recursos para Desarrollo, Diseño y Creatividad

oozledNavegando la Web me encuentro este interesante sitio “oozled.com”, página que nos brinda más de 600 recursos en 42 categorías de momento, que nos ayudarán con inspiración, código o diseños para nuestros proyectos Web.

Dentro de las categorías podremos encontrar recursos para Javascript, HTML5, CSS, frameworks como Laravel de PHP, iconos, fuentes, fotografía, diseño de interfaces, entre mucho más. Además podremos acceder a charlas y a una categoría dedicada al empleo.

Sin duda una excelente fuente no solo de recursos sino de inspiración, que nos provee con material gratuito y de pago, para la consecución de nuestros proyectos.

Enlace
oozled

CodeCombat aprende a programar Javascript mientras juegas

codecombat

Si has pensado en aprender a programar Javascript, existen muchas alternativas, pero una de ellas “CodeCombat” te enseña mientras juegas.

La aplicación Web te enseña los fundamentales de la programación de Javascript, todo lo que verías en un curso introductorio, mientras vas creando el código para sortear los diferentes obstáculos en el juego. Para ir de un nivel al otro, debes entender lo aprendido en la lección y demostrarlo creando el código que te permitirá avanzar.

El juego es del tipo RPG y brinda dos modos de juego, para un jugador y el multi jugador para los más avanzados, en esta opción nuestro código se debe enfrentar al de otros jugadores.

La compañía que fue fundada en febrero del año 2013 y esta a punto de graduarse de Y-Combinator la aceleradora de startups, ha dejado el código libre, además ha liberado un editor de niveles, que permite que creemos nuestro contenido. El juego y el aprendizaje es totalmente gratuito, CodeCombat pretende monetizar a través del reclutamiento, ya que ellos conocen bien a los programadores y como resuelven el juego por medio de sus algoritmos, así un empleador puede contratar un programador pagando una tarifa a CodeCombat.

[Tal ves te interesa: Curso Guía practica de Desarrollo Web Frontend]

Si te interesa aprender Javascript sin duda esta es una buena opción, ya que viene en varios idiomas entre ellos el español.

Leer el resto de la entrada »

Proyecto de la guía practica de Desarrollo Web Frontend

todo-list

Para aprender HTML5, CSS3 y Javascript lo mejor es realizar un proyecto practico, por eso miramos varias alternativas y ahora hemos elegido hacer una “Lista de tareas” o lo que se conoce en ingles como “ToDo list“, en la imagen superior podremos ver las diferentes partes que conforman la página que desarrollaremos, en la cual practicaremos temas muy frescos como es el responsive design, los Web Fonts o alineación, así también veremos como lograr el diseño, la estructura y funcionalidad con lo más reciente de HTML5 + CSS3 + Javascript.

Sino sabes de que se trata la guía te invito a que leas la presentación.

Si ya sabes de que se trata, te invitamos a que estés atento a la primera parte de la guía que esperamos sea de tu interés y por supuesto te ayude a ser un verdadero ninja del desarrollo Web Frontend.

Tendremos imágenes y lo necesario disponible de una fuente profesional que nos ayudará en el curso, para la primera parte de nuestra guía.

Curso: Guía practica de Desarrollo Web Frontend

guia-desarrollo-web

Desde “LoqueNecesita” queremos desarrollar una serie de artículos enfocados al desarrollo Web frontend, estos artículos se crearán en un orden especifico a la ves que vamos realizando practicas con determinado proyecto.

La idea es tratar temas acerca de HTML5, CSS3 y Javascript, veremos temas puntuales con relación a la nueva tecnología de HTML5, así como detalles y herramientas de CSS3, que nos ayudarán a lograr cosas muy comunes, como el centrado de texto tanto horizontal como vertical, alineación, sombras, curvas, fuentes, responsive design, etc. Así también queremos profundizar un poco en la programación con Javascript y como contribuye este a las grandes mejoras de la nueva Web, así también echaremos un vistazo a librerías del lenguaje muy comunes que nos pueden ayudar muchísimo.

La idea es ir desarrollando la guía practica entorno a un proyecto frontend, que anunciaremos en la primera parte, pero también están invitados a proponer un proyecto para desarrollar la guía practica. A medida que vamos avanzando, tal vez tengas mejores soluciones a implementaciones que queremos hacer, en tal caso te invitamos a que escribas tus soluciones al igual que tus comentarios y consultas, en los comentarios del articulo o en Facebook o Twitter, así estas también estarán dentro de la guía final que construiremos entre todos, por esto su participación es muy importante.

Al final unificaremos los artículos, los comentarios que contribuyen con soluciones, dudas o aportes, y así tendremos una guía de desarrollo web frontend lista para su descarga, que te servirá de referencia para el desarrollo de tus futuros proyecto, obviamente su código fuente estará disponible.

¿Te animas a aprender y aportar, en esta guía de desarrollo web frontend?

Si tu respuesta es afirmativa, compártelo con tus amigos en las redes sociales, y si quieres propone un proyecto que te gustaría desarrollar a medida que hacemos la guía.

Mostrar y Ocultar contenido con jQuery

Necesitaba crear algo así como “mostrar más” en donde tengo una parte de contenido visible y otra oculta que se muestra cuando hago clic sobre mostrar más, en la Web existen muchas soluciones acá comparto una solución que te puede servir.

Caso especifico: Una lista de categorías que muestra 5 y un enlace “mostrar más” que permite ver las demás, adicional si quieres agregas un enlace ocultar para regresar a mostrar solo 5.

Primero paso

Tenemos el código html con las categorías, consta de un div y dentro una lista desordenada con 10 categorías:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div id="contenedor">
  <ul class="categorias">
    <li>Categoria 1</li>
    <li>Categoria 2</li>
    <li>Categoria 3</li>
    <li>Categoria 4</li>
    <li>Categoria 5</li>
    <li>Categoria 6</li>
    <li>Categoria 7</li>
    <li>Categoria 8</li>
    <li>Categoria 9</li>
    <li>Categoria 10</li>
  </ul>
</div>

Luego tenemos un par de divs para poner los enlaces mostrar más y menos, hemos agregado el estilo cursor: pointer para que el texto parezca un enlace y uno de ellos esta oculto por defecto con display: none; como vemos a continuación:

1
2
<div class="mas" style="cursor: pointer;">mostrar mas</div>
<div class="menos" style="display: none; cursor: pointer;">mostrar menos</div>

Leer el resto de la entrada »

Tessel esta disponible para pre ordenes

tesselHace pocos día te hablamos de Tessel, pues ya el día de hoy nos anuncian que lo podremos pre ordenar, ellos han abierto su proyecto para buscar capital en el sitio de “Dragon Innovation“, la meta es recaudar US $50.000 de momento llevan poco más de US $15.000, sin duda un gran comienzo.

Podremos pre ordenar por US$89 el Tessel + un modulo tipo A ya te hablamos de los módulos un lector micro SD, acelerometro, Temperatura/Humedad, relé, o un Servo si se ordena pronto, apenas se agote este mismo kit costará US$99.

Por US$124 podremos reservar el Tessel + un modulo tipo B GPS, Bluetooth, Audio, o RFI. Por US$349 podremos reservar el Tessel + todos los modulos.

Por otro lado si te quieres unir al proyecto y colaborar podrás comprar una camiseta por US$20, módulos A en US$25 y B en US$50, entre otros.

Si te interesa el proyecto puedes reservar el tuyo en Dragon Innovation el sitio de crowdfunding para proyectos de hardware open.

Actualización: Ya no hay mas kit de US$89 disponibles y ya van por los US$24.000, sin duda éxito.

Nueva actualización: Tessel cumplió su meta ya US$54.000, si éxito.