¡INSCRÍBETE A CUALQUIER CURSO CON UN 50% DE DESCUENTO PARA NUEVOS CLIENTES!

En esta entrada vamos a ver cómo crear una lista de tareas con javascript haciendo uso de algunas cosas ya aprendidas como los arrays aunque veremos cosas nuevas para agilizar un poco el curso.

La idea será a través de un campo de texto y un botón ir añadiendo nuevas tareas y que éstas vayan apareciendo una detrás de otra debajo de la última.

Curso Javascript: Lista de tareas
Curso Javascript: Lista de tareas

Si no conoces bower te invito a que revises este tutorial ya que añadiremos bootstrap haciendo uso de bower.

Lo primero de todo es añadir bootstrap, así que ejecuta la siguiente línea desde la terminal.


Ahora crea un archivo llamado index.html y añade el siguiente código.


Si te fijas, sólo añadimos bootstrap, un archivo todo.js que pasamos a crear ahora y un poco de html, dentro de la lista desordenada con id todoList será donde vayamos añadiendo los nuevos elementos.

Ahora crea un archivo llamado todo.js y añade el siguiente código que pasamos a explicar.


Ese es todo el código que necesitamos para hacer que nuestra lista de tareas funcione con javascript, si te fijas he comentado todo el código para que sea más sencillo de seguir.

El array todos sólo lo utilizamos para tener un índice, aunque podríamos hacerlo de muchas formas, creo que así está bien.

Espero que te guste y te sea útil, cualquier duda no dudes en comentar.

Saludos.