Mi ruta de apredizaje como desarrollador web
Hola mi nombre es Alberto Cauich y quiero platicarte como empeze mi carrera
en el mundo de desarrollo web, como te imaginaras tambien estuve perdido a la
hora de iniciar mi aprendizaje ya que no sabia por donde empezar, era nuevo en
esto de programar y no tenia idea de que era un editor de codigo, pero gracias a
Google y a Youtube y haciendo la busqueda correcta supe por donde empezar no
fue un camino facil ya que anduve por muchos foros y grupos de redes sociales
preguntado por donde empezar que si era mejor esto que aquello y asi me la pasaba,
pero la mayoria aunque queria ayudar simplemente me daban respuestas genericas
con la cual solo me confudia mas de lo que ya estaba.
Afortunadamente yo ya pase por todo eso y por eso ahora te voy a facilitar la ruta de
apredizaje que debes seguir si quieres entrar en este mundo del desarrollo web o mas
bien dicho tu carrera como "Front End developer".
Presta mucha atencion ya que te voy a compartir la ruta de apredizaje como desarrollador
web que deberias seguir al adentrarte en este mundo de la programacion, lo ire
enlistando desde lo mas importante asta lo mas esencial, la ruta de aprendizaje quedaria de
esta manera:
1.-HTML
2.-CSS
3.-JAVASCRIP
4.-FRAMEWORK
¿Porque aprender primero HTML?
La respuesta es muy sencilla, html es la base principal o la estructura de una pagina web, sin html
no podemos crear un sitio web y agregar contenido. Te preguntaras ¿como se agrega contenido a la
estructura de html? bueno para empezar tenemos que crear etiquetas las cuales serviran como
contenedor de nuestro contenido ya sea texto, imagenes, videos etc.
Te recomiendo empezar aprender html semantico con lo cual haremos uso del tema de especifidad,
de la misma manera resaltaremos la importacia de cada etiqueta de nuestro sitio web, el cual le indicara a google de que trata nuestro contenido.
A continuacion te enlistare las etiquetas que deberias usar, antes hare mension de una etiqueta muy
utilizada y que no deberias usar por temas de malas practicas de programacion y se trata de la famosa
etiqueta "div" te preguntaras ¿y en que momento puedo usarla? mi recomendacion es nunca salvo unos casos concretos y cuyo contenido no tenga mucha relevancia, bueno
ya dicho esto te compartire las etiquetas que deberias usar en html semantico:
<header>
<nav>
<section>
<article>
<aside>
<main>
<summary>
<footer>
<figure>
CSS
Cando hayas comprendido como aplicar html semantico, ahora toca seguir con css.
CSS puede ser un poco facil y frustrante a la vez, ya que comprender el orden de las cosas puede llevar a un sin fin de dolores de cabeza, pero no es motivo para no dedicarle el tiempo de aprendizaje que merece ya que sera nuestro aliado a la hora de estilizar el contenido de nuestro sitio web.
En base a mi experiencia te recomiendo que te enfoques en aprender en primera instacia el modelo de caja y entender el posicionamiento de los elementos. Para eso haremos uso de css flex o css grid para posicionar los elementos de tu proyectó, una vez tengas claro como funciona el modelo de caja, el posicionamiento con flexbox y css grid ya podras adentrarte a como aplicar colores, unidades de medida, efectos y crear animaciones.
JAVASCRIP
Ahora toca hablar de este popular lenguaje de programación Javascript. Cuando ya hayas entendido a la perfección html y css ya estarás listo para pasarte a lo más frustrante del desarrollo web y es aprender Javascript, pero no te desanimes, tal vez mi palabras puedan ser un poco desalentadoras pero siempre hay una luz al fin del túnel.Antes de empezar definamos un poco este lenguaje de programación, Javascript es un lenguaje multiparadigma orientado a objetos si como lo lees todo en Javascript es un objeto aunque en múltiples ocasiones parezcan funciones, el cual también es de un tipado dinámico eso significa que el tipo siempre estará asociado al valor no a la variable.
Ahora te preguntaras ¿que uso se le da a Javascript en la programación web? bueno al ser un lenguaje multiparadigma podemos hacer muchas cosas, pero el uso más habitual en el desarrollo web es agregar funciones embebidas en páginas html y convertir en dinámica el contenido de una página web estatica, animar elementos de la página, cambiarlos de tamaño o moverlos de posiciones, crear contenido interactivo como por ejemplo juegos, validación de datos de un formulario, envío de transmisión de datos, navegación de los usuarios etc. Como podrás darte cuenta podemos crear múltiples acciones con este lenguaje de programación, pero como todo para aprender las bases lleva tiempo y dedicación pero no te preocupes te voy a dar un pequeño empujoncito para que sepas por donde empezar, bueno esta es una recomendación mía en base a mi experiencia.
Te recomiendo empezar por aprender estos conceptos basicos de JavaScript:
1.-Declarar una variable y mandar a llamar su valor.
2.-Crear arrays y recorrer la lista.
3.-Crear objetos y agregarle valores.
4.-Hacer uso de funciones.
5.-Hacer uso de sentencias de bucle como if, else y while.
FRAMEWORK
Ahora toca el turno de los frameworks, vamos hablar de los dos más populares se tratan de React y Angular, pero antes que nada dejemos en claro una cosa React no es en si un framework más bien es una librería de open source creado y mantenido por Facebook, a diferencia de Angular que es un framework completo creado y mantenido por google.ANGULAR
Te dare daré una breve descripción de el framework de Angular, la principal ventaja de Angular es que al ser desarrollado por Google tiene soporte directo con ellos, también proporciona una documentación detallada para facilitar el camino a los desarradores que usen su framework.
Angular también promete menos tiempo en codificación y también ayuda a la creación de aplicaciones rápidas y asombrosas, tambien permite crear interfaz de usuario simples y potentes, de igual manera al ser un framework bidirecional de datos enlaza perfectamente JavaScript y Html para facilitarle el trabajo a los desarroladores.
Angular tambien te ofrece plantillas que te ahorrara tiempo a la hora de modificar o reparar aplicaciones, tambien posee un conjunto de APIs que permiten crear etiquetas de Html personalizables que podemos reutilizar es decir podemos reutilizar codigo y ahorrarnos tiempo en codificacion.
Tambien se puede crear aplicaciones moviles y web.
REACT
Cómo había mencionado anteriormente Facebook a desarrollado su propia librería open source y la nombró React.Está librería React javascript asta ahora es muy popular y la mayoría de los desarrolladores optan por esa librería por la facilidad de implentarla en sus proyectos.
React es utilizado principalmente para interfaz de usuario pero también es compatible para crear aplicaciones web y móviles.
React es fácil de aprender por lo que implementarlo en un proyecto será sencillo, también es compatible con SEO por lo que se podría esperar tiempos de carga rápidos y un mejor posicionamiento en los motores de búsqueda, de igual manera se puede hacer uso de código casi similar tanto del lado servidor como del lado cliente.
Ahora que ya tienes una idea cuál es el principal uso que se le dan a estas dos tecnologías, escojer una u otra será cuestión de necesidades, personalmente en mi opinión y como recomendación si estás empezando con frameworks y librerías te recomiendo empezar con React ya que no necesitas dominar perfectamente javascript, con tener un dominio del lenguaje básico-intermedio será suficiente para poder aprender React ya que su curva de aprendizaje es más sencilla de comprender.
a diferencia de angular