¿Qué proyectos de muestra son buenos para un principiante en JavaScript?

En primer lugar, supondré que está interesado en aprender front-end en su conjunto (HTML / CSS / JavaScript), y no solo JavaScript por sí solo. Si está interesado en aprender JavaScript para el back-end, también conocido como Node.js, entonces esta respuesta no será demasiado relevante.

El equivalente de “Hello World” en el mundo front-end sería una Lista de Todo, popularizada por el Ingeniero de Google Addy Osmani como TodoMVC. ¿Por qué? Debido a que cubre muchos conceptos fundamentales, como el manejo de la entrada de formularios, la interacción del usuario, el procesamiento de una lista dinámica de elementos donde hay inserciones, eliminaciones y cambios en el estado de visualización de los elementos. Estas son rutinas muy comunes en el front end y harán un buen proyecto para principiantes.

En estos días, TodoMVC se está utilizando como una comparación entre bibliotecas y marcos emergentes, para demostrar cuán fácil / difícil es hacer las rutinas mencionadas anteriormente e implementar una Lista de Todo también es una forma decente de aprender una nueva herramienta.

Sin embargo, para los principiantes que son nuevos en front-end, creo que aprender JavaScript vainilla es más importante que aprender frameworks. Por lo tanto, si tuviera que construir su primera Lista de tareas, use JavaScript simple (o jQuery como máximo). Obtendrá más valor de aprendizaje a través de ese proceso.

Aquí hay algunos buenos proyectos para un principiante en javaScript

NOTA: haga esto sin jQuery

  1. Juego de cartas: Juego de 21 , este proyecto realmente prueba cómo escribes tu lógica, solo busca en Google la mecánica y las reglas del juego. que te diviertas.
  2. Simple Calculator, este proyecto, realmente pone a prueba sus conocimientos sobre cómo utiliza los selectores y la escritura lógica en JavaScript,
  3. Validación de formulario de front-end, haga un formulario y luego escriba una validación simple alrededor del juego con un botón de envío, console.log los resultados. que te diviertas.
  4. Gambits de Greg, este es bastante complicado, pero aún pertenece a un nivel de principiante, solo investiga esto en línea, hay muchos ejemplos. que te diviertas.
  5. Cronómetro, este proyecto le enseñará el concepto de demoras y funciones de devolución de llamada. este proyecto usa setTimeOut setInterval, etc … diviértete.
  6. Su primera biblioteca de utilidades, esta se explica por sí misma, pero si aún no sabe qué es una biblioteca de utilidades, simplemente búsquela en línea y luego cree su propia versión simple. Este proyecto le enseñará cómo escribir funciones puras y funciones impuras, crear sus propias devoluciones de llamada, divertirse.

RECORDATORIO: es importante que no use jQuery en ninguno de estos proyectos.

También asegúrese de comprender el DOM y la BOM.

Aquí está la lista de algunos ejercicios y tareas de JavaScript.

Archivos de asignaciones de Javascript – Centro de capacitación web

Archivos de ejercicios de Javascript – Centro de formación web

Ejercicios sobre números

Estos deberían ser suficientes para comenzar.

Codewars: Codewars: entrena tus habilidades de codificación

javascript-puzzlers: o: ¿realmente sabes JavaScript?

freeCodeCamp: aprenda a codificar y ayudar a organizaciones sin fines de lucro

es6katas: aprenda ECMAScript6 haciéndolo

leetcode: LeetCode

nodechool.io: NodeSchool

hackerrank: HackerRank

Mega Lista de Proyectos: karan / Proyectos

Bueno, durante nuestra pasantía, nuestro supervisor nos pidió que creáramos un pequeño juego usando javascript, html y css y, para ser sincero, realmente me ayudó a comprender y apreciar más javascript.

Básicamente, la instrucción es así:

“¡Vas a crear un mini-juego que ayuda a un ninja a ganar dinero! Cuando comienzas el juego, tu ninja debe tener 0 de oro. El ninja puede ir a diferentes lugares (granja, cueva, casa, casino) y ganar diferentes cantidades de oro. En el caso de un casino, tu ninja puede ganar o perder hasta 50 de oro. Tu trabajo es crear una aplicación web que permita a este ninja ganar oro y mostrar las actividades pasadas de este ninja “.

Este ejercicio realmente me ayudó especialmente en el desarrollo de sitios web.

Si está buscando proyectos divertidos de JavaScript, puede probar los proyectos en el campo de código gratuito, son simples y desafiantes. Y no son solo algoritmos. ¡Puedes tener la sensación de construir algo!