Ruta para ser programador web en el 2024 💻

Summary

Este video ofrece una guía detallada para convertirse en programador web full stack en 2024, abarcando desde las bases del frontend y backend hasta las tecnologías emergentes como React y Next.js. Destaca la importancia de aprender más allá de las tecnologías, incluyendo fundamentos de ciencias de la computación y habilidades para entrevistas de trabajo, para asegurar un lugar en la industria tecnológica.

Takeaways

• 🚀 Para ser programador web full stack en 2024, es importante entender los diferentes tipos de programadores: frontend, backend, full stack y devops.
• 🌐 El programador frontend se encarga de crear la estructura visual y estética de páginas web y aplicaciones, utilizando tecnologías como HTML, CSS y JavaScript.
• 💻 El programador backend trabaja con servidores, bases de datos y APIs para gestionar y proporcionar la información necesaria al frontend.
• 🔄 El programador full stack tiene habilidades tanto en frontend como en backend, lo que le permite trabajar en todas las capas de una aplicación.
• 🛠️ Los programadores devops se encargan de la publicación y mantenimiento de aplicaciones, así como de la automatización de procesos.
• 📚 Antes de comenzar con la programación profesional, es fundamental aprender sobre el sistema operativo, el navegador web y los editores de texto (IDE).
• 🌐 Crear páginas web estáticas implica掌握基本的HTML, CSS y JavaScript, que son esenciales para dar forma y estilo a la página, así como para agregar interacciones básicas.
• 🌐 Para publicar un sitio web, se necesita comprender cómo funciona el internet, los proveedores de alojamiento y los registradores de dominios.
• 🛠️ Las herramientas como la terminal, Git, GitHub y las herramientas de inteligencia artificial como Chat GPT son fundamentales para mejorar la productividad y la colaboración en proyectos de programación.
• 📈 Aprender sobre diseño adaptativo, SEO y accesibilidad es clave para que las páginas web sean visualmente atractivas y estén disponibles para todos los usuarios en diferentes dispositivos.
• 🎓 La preparación para entrevistas y conocimiento de ciencias de la computación son cruciales para asegurar un buen desempeño en el ámbito profesional y para encontrar oportunidades laborales en la industria tecnológica.

Q & A

¿Qué es un programador front end y qué hace?

Un programador front end utiliza tecnologías para crear la estructura visual, el contenido y las animaciones de páginas web y aplicaciones. Son responsables de todo lo que se ve en el navegador, desde la apariencia hasta la interacción del usuario.

¿Qué es un programador back end y cómo difiere de un front end?

Un programador back end trabaja en la parte del servidor, creando APIs y manipulando bases de datos para que el front end pueda mostrar información y realizar acciones. Se diferencia del programador front end en que trabaja en la infraestructura y el procesamiento de datos en lugar de la apariencia y la experiencia del usuario final.

¿Qué es un programador full stack?

Un programador full stack es alguien que trabaja tanto en el front end como en el back end, es decir, desarrolla tanto la parte visual y de interacción de la aplicación como la lógica y base de datos subyacente.

¿Qué es DevOps y cuál es su relación con los programadores?

DevOps se refiere a la operación de desarrolladores, y en el contexto de los programadores, implica la gestión del ciclo de vida de un software, desde el desarrollo hasta la implementación y el mantenimiento. Los programadores DevOps trabajan en proyectos más grandes y son responsables de la publicación y mantenimiento de aplicaciones.

¿Qué es HTML y cómo se utiliza en la creación de páginas web?

HTML (HyperText Markup Language) es un lenguaje de marcado de texto que se utiliza para crear la estructura de las páginas web. Es el fundamento de cualquier sitio web y define cómo se muestran los elementos, como texto, imágenes y enlaces.

¿Qué es CSS y cómo funciona con HTML?

CSS (Cascading Style Sheets) es un lenguaje de estilos utilizado para dar formato a las páginas web creadas con HTML. Funciona junto con HTML para definir el diseño visual de la página, incluyendo colores, fuentes, tamaños, organizaciones de elementos y animaciones básicas.

¿Qué es JavaScript y cómo amplía las funcionalidades de las páginas web estáticas?

JavaScript es un lenguaje de programación que se utiliza para agregar interacción y dinamismo a las páginas web estáticas. Permite crear funciones más complejas, como manipular el contenido de la página en respuesta a acciones del usuario, realizar solicitudes al servidor y actualizar la página sin recargarla完全.

¿Qué es el Document Object Model (DOM) y cómo se relaciona con JavaScript?

El Document Object Model (DOM) es una representación estructurada del contenido de una página web en el navegador. JavaScript utiliza el DOM para interactuar con los elementos de la página, permitiendo cambios en tiempo real en la estructura, estilos y contenido de la página.

¿Qué es un IDE y cómo ayuda en el desarrollo de proyectos de programación?

Un IDE (Integrated Development Environment) es un software que proporciona una plataforma para el desarrollo de código. Ofrece herramientas avanzadas como resaltado de sintaxis, depuración de código, gestión de proyectos y automatización de tareas, lo que mejora la eficiencia y la productividad del programador.

¿Qué es Git y cómo es esencial en la colaboración y control de versiones en programación?

Git es un sistema de control de versiones que permite a los desarrolladores rastrear y gestionar cambios en el código. Es fundamental para la colaboración en proyectos, ya que permite a diferentes miembros del equipo trabajar en el mismo proyecto sin conflictos y permite reversiones y pruebas de diferentes versiones del código.

¿Qué es la optimización de motores de búsqueda (SEO) y por qué es importante para las páginas web?

La optimización de motores de búsqueda (SEO) es el proceso de mejorar la visibilidad de un sitio web en los resultados de búsqueda de Google u otros motores de búsqueda. Es importante porque aumenta la probabilidad de que los usuarios encuentren y visiten el sitio, lo que puede resultar en más tráfico y, potencialmente, más clientes o usuarios.

Outlines

00:00

🚀 Introducción a la programación web full stack en 2024

Este video presenta la ruta para convertirse en programador web full stack en 2024, un año clave para ingresar a la industria tecnológica. El video ofrece información valiosa para el año 2024 y anima a suscibtirse para no perder ningún contenido. Además, se menciona una promoción especial en la Academia X de programación y se agradece a Hostinger por su patrocinio. Se destaca la importancia de definir los tipos de programadores y su función, ya que el objetivo principal es encontrar soluciones a problemas, más que simplemente aprender tecnologías. Los tipos de programadores mencionados incluyen al front end, back end, full stack y devops, así como la diferencia entre programadores y diseñadores o full stack designers.

05:00

🌐 Comenzando con las páginas web estáticas

Este segmento aborda cómo crear páginas web estáticas, que son fundamentales para cualquier negocio en línea. Se explica que las páginas estáticas son simples, con estructuras y estilos estáticos, y pueden incluir animaciones básicas. Se describen los archivos de texto y los editores de texto (IDEs) necesarios para su creación, así como la importancia de aprender HTML, el lenguaje de marcado para la estructura de páginas web. También se introduce a CSS, que permite dar estilo a las páginas web, y se menciona la extensión '.css'. La analogía de la construcción de una casa se utiliza para explicar la relación entre HTML y CSS.

10:02

🛠️ Aprendiendo JavaScript y la interacción dinámica

En este apartado, se introduce JavaScript como un lenguaje de programación que rompe límites en la web estática, permitiendo interacciones como botones que desencadenan eventos, animaciones, o la carga de datos en línea. Se explica que JavaScript se escribe en archivos '.js' y se integra con HTML y CSS a través del DOM (Document Object Model), permitiendo manipular el contenido y la estructura de la página. Además, se mencionan las herramientas y conocimientos adicionales necesarios para publicar un sitio web en internet, como el funcionamiento de la misma, los proveedores de alojamiento y los registradores de dominios.

15:03

🔧 Herramientas y tecnologías avanzadas para programadores

Este segmento cubre una variedad de herramientas y tecnologías esenciales para los programadores, incluyendo la terminal para ejecutar comandos, Git para control de versiones y colaboración, y GitHub para alojar proyectos. También se mencionan herramientas de inteligencia artificial como Chat GPT para mejorar la productividad, Bit para servir archivos y optimizar proyectos, y Node Package Manager (npm) para instalar bibliotecas en proyectos. Se destaca la importancia del diseño adaptativo, SEO y accesibilidad para que las páginas sean visibles y usables por todos los usuarios.

20:05

📱 Creando aplicaciones a través de frameworks modernos

Este párrafo se enfoca en la creación de aplicaciones más complejas utilizando frameworks modernos como React, que permite crear componentes reutilizables y aplicaciones de página única (SPA). Se describen las ventajas de React y se mencionan alternativas como Angular, Vue y Svelte. Además, se introduce HTMX, que mejora el HTML estándar para crear páginas interactivas sin JavaScript extenso. Se destaca la importancia de aprender backend para procesamiento de datos y automatizaciones personalizadas, y se mencionan tecnologías como Node.js, Express, Python, Django, C# y .NET. También se menciona la relevancia de bases de datos, lenguaje SQL y sistemas NoSQL como MongoDB.

25:06

🌟 Conquista el mercado laboral con tus habilidades de programación

Este segmento enfatiza la importancia de encontrar un trabajo en el campo de la programación, ya que dominar las tecnologías es solo el primer paso. Se sugiere que una buena preparación en ciencias de la computación, habilidades blandas y una sólida preparación para entrevistas son cruciales para éxito en la industria. Se menciona un curso de algoritmos, entrevistas y diseño de sistemas para profundizar en estas áreas. Finalmente, se anima al espectador a mejorar sus habilidades a través de la Academia X y a seguir el camino para convertirse en un programador en 2024.

Keywords

💡Programador Web Full Stack

Es un desarrollador que tiene habilidades tanto en el frontend (desarrollo del lado del usuario, como páginas web) como en el backend (desarrollo del lado del servidor). En el video, se menciona la importancia de aprender tanto las tecnologías del lado del cliente como del servidor para poder crear aplicaciones web completas y más complejas.

💡Frontend

Se refiere al lado del desarrollo web que es visible para el usuario final. Incluye la creación de la estructura visual y la interacción con el usuario a través de páginas web y aplicaciones. El frontend utiliza tecnologías como HTML, CSS y JavaScript para crear la parte del cliente de una aplicación.

💡Backend

Es la parte del desarrollo web que se ejecuta en el servidor y no es visible para el usuario. Se encarga de gestionar la base de datos, la lógica de la aplicación y la comunicación con el frontend. El backend es esencial para la funcionalidad subyacente de una aplicación web.

💡DevOps

Es un enfoque que combina las operaciones de desarrollo de software (development) y las operaciones de infraestructura de tecnología de información (operations). Los profesionales de DevOps trabajan en la automatización y el mantenimiento de la infraestructura, así como en la implementación de mejoras continuas en el proceso de desarrollo.

💡HTML

Es un lenguaje de marcado utilizado para crear la estructura básica de las páginas web. HTML define los elementos de la página y cómo se relacionan entre sí, proporcionando significado al contenido de la página web.

💡CSS

Es un lenguaje de estilo utilizado para definir la presentación de un documento escrito en un lenguaje de marcado, como HTML. CSS controla el diseño de la página, incluyendo el estilo de las fuentes, los colores, la disposición de los elementos y las animaciones.

💡JavaScript

Es un lenguaje de programación que se utiliza principalmente en el lado del cliente para agregar interacción dinámica y funciones complejas a las páginas web. JavaScript permite a los desarrolladores crear aplicaciones web más interactivas y atractivas para el usuario.

💡React

Es una biblioteca de JavaScript diseñada para crear interfaces de usuario de aplicaciones web de manera eficiente. React permite a los desarrolladores crear componentes reutilizables que mejoran la organización y la escalabilidad del código.

💡Node.js

Es un entorno de ejecución de JavaScript que permite el uso del lenguaje de programación JavaScript fuera del navegador web. Node.js es utilizado principalmente para el desarrollo de aplicaciones web y servicios backend.

💡Base de datos

Es un conjunto organizado de datos que se almacenan y acceden de forma sistemática para su uso en aplicaciones. Las bases de datos son esenciales para el almacenamiento, recuperación, manipulación y administración de información en aplicaciones web y otros sistemas.

💡SEO

Es el proceso de mejorar la visibilidad de un sitio web en los resultados de búsqueda de un motor de búsqueda. Las técnicas de SEO incluyen la optimización de contenido, la estructura de la página y la experiencia del usuario para aumentar el rango en los resultados de búsqueda.

Highlights

Este video ofrece información para el año 2024 sobre cómo convertirse en programador web full stack.

El año 2024 es propicio para ingresar a la industria tecnológica.

Se destaca la importancia de suscribirse a la academia de programación para recibir promociones.

Se definen los tipos de programadores: front end, back end, full stack y devops.

El programador front end trabaja con lo que se ve en un navegador, utilizando tecnologías para crear la estructura y estilo de páginas web.

El programador back end trabaja con servidores, bases de datos y APIs.

El programador full stack es capaz de trabajar tanto en el front end como en el back end.

Los programadores devops se encargan de la publicación y mantenimiento de proyectos.

Se aborda la importancia de aprender a crear páginas web estáticas antes de entrar en programación profesional.

Se mencionan las tecnologías básicas para crear páginas web estáticas: HTML, CSS y JavaScript.

Se explica cómo funciona la publicación de sitios web en internet utilizando proveedores de alojamiento y registradores de dominio.

Se habla sobre herramientas como la terminal, Git, GitHub y Chat GPT que son esenciales para el programador.

Se menciona la importancia del diseño adaptivo y la optimización de motores de búsqueda (SEO).

Se introducen frameworks modernos como React y HTMX para el desarrollo front end.

Se describen las tecnologías del backend como Node.js, Express, MongoDB y las bases de datos SQL.

Se mencionan las herramientas de desarrollo en la nube como AWS, Google Cloud y Azure.

Se habla sobre Docker y Kubernetes como tecnologías para manejar contenedores y orquestrar servidores.

Se menciona la importancia de aprender sobre sistemas operativos y lenguajes de programación para el backend.

Se sugiere la utilidad de frameworks como Next.js y GraphQL para aplicaciones con mejor SEO.

Se mencionan Electron y React Native para crear aplicaciones de escritorio y móviles a partir de aplicaciones web.

Se enfatiza la importancia de las entrevistas de trabajo y la preparación para obtener un empleo en el campo de la programación.

Transcripts

en este video vamos a ver la ruta para

ser programador web full stack en el año

2024 y este video llega cargado de

información para el año 2024 Este es el

año para que ingreses en la industria

tecnológica y antes de empezar te invito

a que te suscribas para que no te

pierdas ninguno de mis videos pero antes

Prepárate para una promoción increíble

en este Black Friday en mi academia de

programación Academia X No olvides

suscribirte a nuestros emails para

recibir la promoción y gracias a

hostinger por auspiciar este video y más

sobre ellos más adelante si más que

decir empecemos antes de decirte los

nombres de todas las tecnologías que vas

a aprender es muy importante definir los

tipos de programadores que existen Y qué

es lo que hacen porque al final del día

existen miles de tecnologías pero

nuestro trabajo como programadores no es

aprender miles de tecnologías nuestro

trabajo es encontrar soluciones a

problemas así que el primer tipo de

programador que existe es el programador

Front end y lo que hace el programador

frontend es utilizar tecnologías para

todo lo que ves en un navegador frontend

es lo que tú ves cuando accedes a una

página web cuando accedes a una

aplicación es desde el lado del cliente

y el programador frontend va a utilizar

distintas tecnologías para crear la

estructura de páginas web y aplicaciones

también Ordenar el contenido de estos

proyectos también Añadir estilos a estos

proyectos y también animaciones y hacer

pedidos al servidor para obtener

información adicional muchas veces los

programadores frand se encargan de

publicar estos proyectos al internet

esto para proyectos pequeños También

tenemos el programador backend y los

programadores backend trabajan en

programación para servidores es decir

ellos trabajan con bases de datos para

obtener información crean apis que son

formas de enviar información al frontend

y a otros consumidores de esta

información y estos programadores los

vas a encontrar en proyectos más

complejos y también existe el

programador full stack el programador

fullstack es el que hace frontend y

también hace backend es decir trabaja en

el lado del cliente y también trabaja en

el lado del servidor finalmente existe

un área que se llama devops y en Muchos

trabajos vas a encontrar programadores

devops devops significa operación de

desarrolladores y lo que ellos hacen en

proyectos más grandes es encargarse

totalmente de la publicación y

mantenimiento del frontend del backend y

otras automatizaciones Claro en este

campo también vas a escuchar tal vez de

los diseñadores o dep designer muchas

veces los programadores como nosotros

trabajamos con diseñadores pero nosotros

no hacemos los diseños muchas veces

Ellos nos pasan los diseños y nosotros

los transformamos en páginas web o

aplicaciones pero si has escuchado de

dep designers son programadores que

también son diseñadores al al mismo

tiempo y ahora hablemos de las

tecnologías pero las tecnologías no se

deberían mencionar solas esto es porque

todo el objetivo de nuestra carrera es

crear soluciones no es necesariamente

tecnologías porque en el mundo de la

programación las tecnologías vienen y

van así que lo primero que vas a

aprender es Cómo crear páginas web

Porque esa es una de las soluciones más

básicas que casi todos los negocios

piden por supuesto antes de empezar con

programación profesional necesitas

conocer lo básico de tu sistema

operativo como trabajar con archivos

como trabajar con carpetas también

necesitas saber cómo trabajar con un

navegador porque ahí es donde vas a ver

tus proyectos web tal vez conoces de

negocios como una peluquería un

restaurante o un negocio de asesoría

financiera cualquier tipo de negocio Hoy

en día necesita una página web y por eso

tienes que aprender Cómo crear páginas

web estáticas Y cómo publicarlas en el

internet las páginas web estáticas son

páginas bastante simples que tienen una

estructura que no cambia mucho tienen

unos estilos también estáticos y pueden

tener alguna animación tal vez Es uno

que otro botón pero tienen interacción

limitada estas páginas son perfectas

para negocios pequeños que desean

promocionarse aparecer tal vez en una

búsqueda de Google pero la naturaleza

del negocio no está en la página web Y

estos proyectos son de los más simples

que hay antes de crear páginas web

estáticas necesit saber que estas se

crean con archivos archivos de texto y

esos archivos de texto se editan con un

editor de texto También conocido como

ide o en inglés integrated development

environment que son editores de texto

más avanzados que tienen bastantes

herramientas para programadores una de

estas que es muy importante es el

resaltado de color de texto para que tú

puedas identificar diferentes partes de

tu código con diferentes colores porque

aquí la mayoría de tecnologías que vas a

aprender se escriben en archivos de

texto y cada tecnología va a tener

diferentes extensiones para crear

páginas web estáticas vas a aprender

html html o hypertext markup Language es

un lenguaje de marcado de texto que se

enfoca en crear la estructura de páginas

web y también de dar significado Al

contenido es decir cuando escribes

código de html simplemente vas a crear

un archivo de texto con la extensión

html y esto es suficiente para crear la

estructura de esta página como analogía

puedes pensar en la estructura de una

casa ahora la siguiente tecnología para

páginas web estáticas es css css o

cascading Style sheets tampoco es un

lenguaje de programación es un lenguaje

de estilos y cs trabaja de manera

conjunta con html para que puedas dar

estilos a tu html con el css Puedes

cambiar el color de las letras el tamaño

de las letras el fondo de la página

Puedes cambiar los tamaños de imágenes

los bordes de las imágenes puedes

organizar elementos de html en forma de

una malla puedes hacer que elementos

floten uno sobre otro Incluso css te

permite Añadir animaciones básicas y css

también se guarda en archivos de texto

estos tienen la extensión pun css y

debes importarlo en tu html puedes

pensar en css como la pintura para

pintar tu casa los Marcos de la ventana

el tipo de madera en el piso y unos

cuadros en tu casa para que se vea bien

Así que html y css van de la mano y

realmente con este par de tecnologías ya

podrías crear páginas web estáticas

Ahora si quieres llevar tu página web

estática a otro nivel vas a aprender

javascript javascript es un lenguaje de

programación es el lenguaje de

programación de la web y aprender un

lenguaje de programación rompe todos los

límites ya que permite hacer lo que tu

creatividad dicte en páginas web

estáticas lo puedes utilizar para

presionar un botón y que algo suceda tal

vez aparece una alarma o inicia una

animación O tal vez tienes una galería

de fotos y deseas presionar un botón y

que esta galería muestre fotos distintas

tal vez deseas cargar datos de otro

servicio en línea y con javascript tú

puedes obtener esos datos y ponerlos en

tu página web Incluso en una página web

estática una analogía para pensar en

javascript es tal vez en tu casa las

conexiones a las luces la conexión a la

electricidad tal vez abrir tu fuente de

agua o la calefacción de tu casa como

ves te permite mucha más complejidad en

tu página web que es completamente

necesario hoy en día para que tus

páginas web sean bastante interesantes y

obviamente eso va a crear una mejor

presentación para la página lo que puede

traer muchos más clientes a la

peluquería o al restaurante que te

contrató para hacer esa página ahora

javascript también se escriben archivos

de texto estos tienen la extensión js y

los puedes importar en tu archivo de

html ahora te debes preguntar cómo se

comunica javascript con estos otros

lenguajes que son distintos y La

respuesta es con el don el dom o

document object model es una tecnología

que está dentro de los navegadores que

permite convertir el html y el css en

javascript para que javascript lo pueda

manipular de esta manera tú puedes

cambiar el contenido de html puedes

mover la estructura de html Y también

puedes cambiar los estilos de css por

ejemplo con un botón podrías hacer que

se reemplace una imagen con otra esto en

html y también que cambie el color de

fondo eso con css Así que estas cuatro

tecnologías son las primeras que vas a

vender y estas son suficientes para

crear páginas web estáticas pero no son

suficientes para trabajar

profesionalmente en este campo porque

una vez que tengas tu archivo de html

css y javascript necesitas publicarlo al

internet Entonces aquí es donde viene

otros conocimientos que necesitas que

van desde Cómo funciona el internet

hasta conocer más sobre proveedores de

alojamiento donde vas a subir tus

archivos para que estén disponibles en

el internet y también sobre

registradores de dominio que es donde

vas a comprar tu dominio personalizado

Como por ejemplo academia gu on x.com en

servicios de alojamiento tien servicios

gratuitos tien servicios pagados y

muchos de estos servicios de alojamiento

también son registradores de dominio que

es donde tú puedes comprar un nombre

para tu dominio por ejemplo una compañía

como hostinger ofrece servicio de

alojamiento y también venta de dominios

y para publicar tu sitio web te invito a

revisar hostinger que se viene con una

promoción genial en este Black Friday

aprovecha los mejores precios del año en

su plan business incluye dominio gratis

200 gigs en disco nbme cdn sss

ilimitados puedes administrar tu Hosting

dominio e email desde el H panel e

incluye herramientas de Inteligencia

artificial para la creación de sitios

web También incluye copias de seguridad

diarias sin consumir los gigs del plan

escáner de malware y wordpress

administrado selector de php actualizado

integración con git y ssh y más con un

10% de descuento adicional usando el

código programador x ideal para

programadores con esto ya puedes crear

tu página web estática y ya puedes

también publicarla pero todavía todavía

no es un trabajo profesional porque en

un trabajo profesional vas a necesitar

varias herramientas ahora las

herramientas necesarias para crear

proyectos profesionales son muchísimas y

tienen distintos objetivos por ejemplo

una herramienta muy importante es la

terminal la terminal te permite correr

comandos en tu computador para trabajar

con archivos y carpetas de manera

bastante rápida un ejemplo es si quieres

crear muchísimos archivos te tomaría

mucho tiempo hacerlo manualmente en

cambio con la terminal puedes hacer esto

simplemente con un comando y así vas a

aprender diferentes comandos en la

terminal para que mejore muchísimo la

productividad de tu proyecto y la

terminal va a ser un poco distinto

dependiendo del sistema operativo para

sistemas operativos unix Como por

ejemplo Linux y macos puedes aprender un

shell como bash o como cshell que tienen

comandos muy similares para estos dos

sistemas operativos también puedes usar

los mismos comandos en Windows con wsl o

en Windows también podrías utilizar

powershell Pero la idea es la misma que

tengas más herramientas para correr

comandos en tu sistema operativo y así

trabajar de manera más eficiente otro

ejemplo de uso de de la terminal es que

te permite correr tu programa que tú

escribiste con tu lenguaje de

programación y tú vas a correr tus

programas que tú mismo vas a crear con

tu lenguaje de programación desde la

terminal ahora otra herramienta esencial

para programadores es kit kit es un

sistema de control de versiones Qué es

eso es simplemente una herramienta que

guarda el historial de todos los cambios

que haces en tus archivos de esta manera

puedes regresar al pasado si deseas

recuperar cambios que hiciste Y esta

herramienta también te permite colaborar

con otros de desarrolladores tal vez los

dos están trabajando en el mismo

proyecto al mismo tiempo y git te

permite crear un proyecto como si fuera

un árbol con bastantes ramas y cada

desarrollador puede trabajar en

diferentes ramas y yit se asegura de que

todo funcione bien al final y que los

cambios de diferentes desarrolladores No

colisionen ahora otra herramienta que va

de la mano con git es github y github

realmente es un servicio de la nube es

un servicio gratuito en donde tú puedes

subir tu código a la nube Y si te

preguntas qué es la nube son simplemente

computadoras en otras partes partes del

mundo que ofrecen servicios que tú

puedes utilizar entonces tú puedes crear

tu proyecto tus páginas estáticas las

subes a git trabajas con otros

programadores y al final incluso puedes

crear una rama que digas Esta es la rama

versión uno y esta es la que voy a sacar

al público y puedes seguir trabajando en

otra rama de git Es una herramienta

indispensable para programadores hoy en

día También tenemos otras herramientas

relacionadas con la Inteligencia

artificial una de estas es chat gpt y

creo que el día de hoy ningún

programador debería programar sin chat

gpt esto es porque te puede ayudar

muchísimo con tu productividad no solo

creando código automático para ti sino

también respondiendo a dudas que tengas

mientras estás programando Y este año

que viene vas a ver una inundación de

herramientas de Inteligencia artificial

por supuesto hoy en día tienes otras

herramientas como bit y bit Es una

herramienta que se enfoca en dos cosas

La primera es servir tus archivos de

html css y javascript creando un

servidor local que simula que esta

página es servida en el internet y así

puedes desarrollar tu página web en

tiempo real haciendo cambios en html en

css en javascript y viendo los cambios

en tiempo real y la segunda parte de

esta herramienta que se llama vit es que

te permite optimizar tu proyecto porque

cuando tú escribes tu código es

humanamente leí Y eso está bien pero

cuando quieres pasarlo a un cliente o

publicarlo en internet tiene que ser

minificado para que las personas que

visiten esa página no tengan que esperar

mucho tiempo hasta que se bajen Y por

supuesto existen muchísimos tipos de

optimizaciones aquí puedes optimizar el

código puedes optimizar las imágenes

puedes optimizar todos los recursos de

tu página web con herramientas como bit

pero también tienes otras alternativas

que se están usando menos hoy en día

como por ejemplo webpack y una

herramienta más que vas a aprender es

mpm mpm viene de node package manager

que es el administrador de paquetes de

node si te preguntas qué es Note solo

espera un momento que eso lo vamos a ver

en el lado de backend pero debes saber

que npm te permite instalar bibliotecas

Por ejemplo si deseas crear animaciones

bastante complejas ya existen muchísimas

bibliotecas para estas animaciones en

línea y son totalmente gratis con npm tú

accedes a un registro de millones de

bibliotecas creadas por otros

desarrolladores y las puedes instalar en

tu proyecto y así las puedes utilizar

para hacer proyectos mucho más

interesantes sin que tengas que crear

todo desde cero algo más que no deseo

pasar es hablar sobre diseño adaptivo

como Sabes hoy en día los dispositivos

móviles son utilizados mucho más que

computadoras de escritorio entonces tú

tienes que optimizar cómo se ven tus

proyectos en dispositivos móviles en

ipads en escritorio y Para eso vas a

utilizar ciertas téc técnicas de css y

es algo indispensable hoy en día para

páginas web estáticas un concepto

importante aquí es seo search engine

optimization esto se traduce a

optimización de motores de búsqueda y

aquí vas a aprender técnicas para que

tus páginas web ranquen más alto en

Google esto es simplemente haciendo

cambios en html mejorando ciertas

imágenes y también es importante aquí

conocer sobre accesibilidad

accesibilidad son prácticas para que tus

páginas web puedan ser vistas por

cualquier persona por ejemplo para

personas que tienen dificultad viendo

diferentes colores o personas que solo

pueden navegar con el teclado la idea

aquí es hacer que tus páginas sean

accesibles a todos y con esto hemos

cubierto la parte más básica que es

crear páginas web estáticas muchas

personas comienzan en esta área y yo

también me incluyo uno de mis primeros

proyectos fue una página web para

Nintendo a través de una consultoría Y

esa página web tenía bastantes

animaciones era bastante interesante y

me tomó más de 3 meses crearla a tiempo

completo así que ya que sabes estas

tecnologías vamos al siguiente nivel por

por supuesto el siguiente nivel trae

mejores oportunidades laborales pero al

mismo tiempo requiere más esfuerzo y

requiere mucha más preparación como

programador el nivel anterior era el

nivel de desarrollo web este siguiente

nivel es el nivel de ingeniería de

software y el Software que vas a crear

como programador web son aplicaciones

cuando piensas en aplicaciones grandes

tienes que pensar en Facebook Google

Maps Amazon para realizar compras Todas

estas son aplicaciones bastante grandes

Pero existe Todo nivel de aplicaciones

desde aplicaciones pequeñas creadas en

en menos de un año por un equipo hasta

aplicaciones inmensas creadas por miles

de personas en muchos años y Cuando

entras en el mundo de las aplicaciones

entras en un mundo mucho más diverso

realmente existen bastantes opciones

para crear aplicaciones ya no es tan

simple como páginas web estáticas como

te diste cuenta con páginas web

estáticas tú no tenías que trabajar

mucho en el Back end es decir el lado de

los servidores pero cuando trabajas con

aplicaciones es casi seguro que vas a

trabajar en el Back end pero no entremos

ahí todavía porque cuando trabajamos con

aplicaciones no solo entra la

complejidad de que necesitamos un Back

end también el Front end tiene que ser

más robusto y para esto vas a aprender

react react es una biblioteca de

javascript y de hecho la puedes instalar

con mpm y una vez que la instales en tu

proyecto de html css y javascript vas a

tener acceso a la filosofía detrás de

esta biblioteca esta biblioteca se

enfoca en crear componentes es decir te

permite que tú escribas html css y

javascript simplificado para crear un

componente y así tú puedas reutilizar

estos componentes en tu proyecto por

ejemplo un componente puede ser un botón

de esta manera tú solo creas un botón

para tu proyecto y puedes reutilizarlo

en diferentes páginas en diferentes

lugares de esta manera va a ser más

fácil para ti crear aplicaciones porque

son complejas no quieres volver a

escribir el mismo html css y javascript

varias veces y este es el enfoque de

react pero tiene muchas más piezas

cuando trabajas con react tienes que

aprender un concepto que se llama single

page application que te permite crear

toda tu aplicación simplemente con html

css javascript e instalando react y

funciona casi como un sitio web estático

Pero puedes hacer que sea mucho más

complejo como una aplicación y en lo que

se diferencia un sitio web de una

aplicación es que la aplicación

obviamente es más compleja pero la

aplicación normalmente hace pedidos de

datos al backend también no solo es un

proyecto para visualizarlo es un

proyecto con el que interactúas para

hacer tu trabajo del día a día por

ejemplo Google Maps es una app con

bastantes funcionalidades que te

permiten Navegar encontrar lugares que

has visitado encontrar diferentes

negocios Entonces como puedes ver esta

aplicación es bastante compleja es

bastante grande y Tiene bastantes piezas

y por supuesto para react tienes muchas

alternativas hoy en día tienes angular

tienes View tienes svelte que hacen algo

Bastante similar simplemente son otras

bibliotecas que te permiten crear

aplicaciones mucho más rápido Claro que

cada uno de estos proyectos va a tener

su propia filosofía de cómo se debe

crear una aplicación Así que cuando

aprendes uno no es Exactamente igual a

otra pero Todas se enfocan en lo mismo

que es crear aplicaciones y de igual

manera que una página web estática un

spa puede ser publicado de manera muy

similar a publicar una página web

estática Así que react te va a ayudar en

el lado frontend ahora en el 2024

tenemos a htmx que se posiciona como una

mejora moderna sobre html estándar y

facilita la creación de páginas web

interactivas sin necesidad de javascript

extenso permite actualizaciones

parciales de la página y manejo de

eventos directamente desde html

resultando en un desarrollo más sencillo

y rápido pero ahora sí como programador

backend o programador full stack tienes

que aprender también el backend Y por

qué es necesario aprender a programar

para el backend esto es porque una

aplicación va a requerir mucho más

procesamiento de datos y realizar otras

automatizaciones que tienen que ser

hechas de manera personalizada ya no es

como las páginas estáticas que solo las

subimos al internet para que sean

visualizadas aquí va a haber una

interacción entre el Front end y el

backend entonces cada acción en el Front

end puede causar una acción en el Back

end y necesitamos crear el código del

backend para que procese acciones o

envíe datos las tecnologías que vas a

aprender en el backend son no.js y

Express nojs simplemente es un ambiente

donde tú puedes correr el lenguaje de

programación javascript pero no lo

corres en el navegador lo corres en este

ambiente y en este ambiente tú puedes

crear servidores que se llaman

servidores porque sir sirven datos

sirven archivos sirven información y

estos programas los puedes publicar en

distintas partes del mundo ahora al

aprender no.js vas a aprender Express y

Express es una biblioteca pero se le

conoce como framework o marco de

desarrollo que puedes instalar con mpm

en no.js para crear servidores de manera

mucho más rápida tiene muchas

funcionalidades para crear rutas y así

cuando el frontend haga pedidos al

backend tú puedes servir exactamente lo

que necesita el frontend dependiendo de

la ruta por supuesto hay tecnologías que

son análogas a esta y otras opciones a

nojs y Express son python y Django que

hacen algo muy similar pero con otra

filosofía también tienes csharp y dnet

que son enfocadas en Windows y tienes

Java y screen Pero la idea es que tú vas

a poder crear servidores Y a partir de

estos servidores tú puedes servir

información incluso puedes utilizar

estos servidores para servir tus sitios

web o tu aplicación ahora en el 2024 Pon

se destaca como una alternativa

eficiente a nojs ofreciendo tiempo tios

de ejecución y arranque más rápido

gracias a su compilador y tiempo de

ejecución optimizados en sig integrando

un gestor de paquetes y herramientas de

desarrollo en un solo binario así que

podemos estar viendo a Bun reemplazando

a nojs ahora otra pieza esencial en el

backend son las bases de datos Y desde

ahí es de donde vienen todos los datos

que necesitas una base de datos es

simplemente un programa optimizado que

va a guardar todos los datos que

necesitas guardar y para acceder a estos

datos necesitas un lenguaje de consultas

el lenguaje más popular es sql y al

escribir sql tú puedes obtener lo que

desees de esta base de datos puedes

obtener todos los datos puedes obtener

un solo dato puedes obtener los datos

ordenados como desees puedes modificar

los datos puedes incluso borrar los

datos todo esto con sql y a estas

operaciones se las llama crud create

read update delete que es crear leer

modificar y borrar por supuesto también

existen bases de datos que no son sql

una de las más populares es mongodb A

diferencia de las bases de datos sql que

son como tablas rígidas las bases de

datos no sql tienen diferentes

filosofías y muchas veces son más

flexibles esto puede ser Útil para

proyectos que no requieren tanta rigidez

Entonces ahora si estás poniendo todo el

panorama completo vas a ver que tienes

el frontend tienes el backend tienes la

base de datos en proyectos pequeños

todos estos pueden estar en la misma

computadora remota y pueden ser servidos

a un usuario pero en proyectos más

complejos vas a tener una computadora

que sirve el frontend otra el backend

otra la base de datos Y en proyectos más

complejos necesitas arquitecturas mucho

más complejas Ahí es donde viene el

término diseño de sistemas es Cómo vas a

diseñar todo este sistema Cómo diseñas

todo el sistema de una aplicación y aquí

vienen muchísimas piezas por supuesto

menciono una que otra vas a aprender

sobre cdns dns microservicios

microfrontends sistemas distribuidos

escalabilidad Y en este momento que

hablamos de diseño de sistemas tienes

que saber que hay servicios de la nube y

tú simplemente tienes que pagar por tu

servicio y utilizarlos algunos de estos

servicios son aws que es donde Yo

trabajé por un año y medio también

tienes Google Cloud tienes azure Y estos

servicios básicamente te ofrecen muchas

piezas para crear tu aplicación

rápidamente Por ejemplo puedes contratar

una base de datos de ellos y simplemente

subes los datos pagas por lo que usas y

la puedes publicar con el click de un

botón Lo mismo para backend Y si tienes

una aplicación que es bastante compleja

puedes subirla toda a aws así tú no

tienes que preocuparte de la

infraestructura porque aw es una

compañía que tiene computadoras en todas

partes del mundo tienes est servidores

tú pagas por su uso y ellos se aseguran

de que tu aplicación sea desplegada en

todas partes del mundo o las partes que

tú eligas también puedes realizar

monitoreo y puedes tener múltiples

backends si deseas y aquí te menciono un

par de tecnologías que son bastante

importantes en el lado backend una de

estas es docker y docker realmente es un

contenedor en donde tú puedes poner tu

código y cuando lo publiques a

diferentes servidores no vas a tener

ningún problema este servicio se creó

porque antes al publicar tu código a

distintos sistemas operativos podían

haber incompatibilidades pero al

utilizar docker te aseguras que tu

programa va a funcionar sin problemas y

otra tecnología relacionada con docker

es kubernetes kubernetes es un

orquestrador de contenedores y esto si

es que tienes muchos Back ends

simplemente este orquestrador Orquesta

Cómo se van a ir publicando En qué orden

y así tú puedes manejar bastantes

servidores es de manera más controlada

ahora también debes aprender algunas

tecnologías en el lado backend que son

bastante útiles y tienen una filosofía

distinta a los spas Por ejemplo si tú

quieres crear una aplicación que tenga

mejor seo tú no lo haces en el frontend

porque los motores de búsqueda no

funcionan muy bien con aplicaciones que

son dinámicas entonces tú puedes

utilizar react en el backend para que

genere sitios estáticos Y estos sitios

estáticos van a tener mejor seo entonces

una tecnología para utilizar react en el

backend que es muy buena es nextjs Y de

paso puedes también aprender una

tecnología como graphql que te permite

hacer pedidos del Front end al backend

de manera bastante simple con esto ya

tienes todo lo que se necesita para

crear aplicaciones por supuesto muchas

aplicaciones hoy en día no solo

funcionan en la web también funcionan en

diferentes dispositivos como en el

escritorio y también en dispositivos

móviles para esto hay un par de

tecnologías que son muy útiles hoy en

día una de estas es electron que te

permite convertir tu aplicación web en

una aplicación de escritorio y otra

tecnología bastante popular es react

native que hace Exactamente lo mismo

pero transforma tus aplicaciones de

react en aplicaciones para tu

dispositivo móvil porque en dispositivos

móviles también trabajamos con otros

sistemas operativos en Android tú vas a

utilizar Java y cotlin y en iOS tú vas a

utilizar Swift entonces react native

permite crear aplicaciones de react que

funcionen en los dos sistemas Pero por

supuesto Estos son Campos más

especializados en los que te puedes

enfocar después de aprender programación

web ahora con esto ya hemos cubierto

toda la parte técnica del trabajo de ser

frontend backend full stack e incluso

devops y arquitectos pero nos falta una

de las partes más importantes encontrar

trabajo puedes aprender todas estas

tecnologías pero si no te va bien en una

entrevista de trabajo solo vas a poder

utilizar estas tecnologías como Hobby o

para tu emprendimiento personal que si

no es algo que esté seguro que va a

funcionar podría ser una pérdida de

tiempo total Yo trabajé en mi tiempo

libre por 3 años en una aplicación que

lamentablemente no llegué a convertirla

en un producto monetizable aprendí

muchísimo de esa experiencia pero por

eso mismo No quiero que esto te pase a

ti por eso sí es importante que al

conocer todas estas tecnologías tu

objetivo sea encontrar un trabajo y ahí

tú vas a poder ganar mucha más

experiencia y seguir creciendo en este

campo Así que lo siguiente que vas a

aprender para encontrar un trabajo es lo

básico de ciencias de la computación

esto es Cómo funcionan los sistemas

binarios también la anotación bgo

estructuras de datos algoritmos Y esta

área se enfoca en Cómo resolver

problemas de código de la manera más

eficiente Por qué es importante esto

porque esto es lo que te preguntan en

compañías como Google meta Amazon

Netflix Apple todo esto lo cubro en mi

curso de algoritmos en Academia X otra

parte esencial para encontrar trabajo en

este campo es tener una buena

preparación para entrevistas esto

incluye Cómo responder a distintas

preguntas habilidades blandas Cómo

optimizar el uso de tiempo de tus

entrevistas todo esto Solo se puede

aprender con experiencia y esto lo vas a

aprender en el curso de entrevistas y

finalmente el curso de diseño de

sistemas está enfocado en arquitectura y

Cómo diseñar sistemas de manera

eficiente porque eso es lo que preguntan

para posiciones senior en compañías al

aprender todos los conceptos sobre

diseño de sistemas puedes apuntar a

tener mejores posiciones en una compañía

simplemente por dar una buena entrevista

demostrando esos conocimientos y con

esto Te deseo lo mejor Espero que te

conviertas en programador en el año 2024

Recuerda que todos estos conocimientos

están en Academia X Y mis cursos los

sigo mejorando a través del tiempo a

medida que salen nuevas tecnologías Así

que espero que te animes a estudiar

conmigo y eso es todo lo que necesitas

aprender si te gustó este video dale un

like si quieres ver más videos como este

suscríbete y si no quieres perderte

ningún video activa las notificaciones

Eso es todo nos vemos en la próxima chao