Estudio de Tecnologías para Full Stack

bien entonces Esta es la guía de estudio que nos está diciendo el Grande amigo bien dice guía de estudio 2024 para probadores full stack lo primero que voy a decir es lo siguiente y quiero que estén muy atentos eh vamos a abrirlo directamente en una Tab así le puedo ir haciendo zoom Ahora sí eh Ahora sí Entonces miren tenemos empleabilidad sueldo y promesas futuras Me parece bien me parece bien a ver Denme un segundito tema de testing integration Ok obviamente kubernet sql perfecto ure python Java stack Open source quick remix Estos son las promesas futuras ojo para el mejor sueldo Entonces le he puesto arquitectura ccs atomic design back mejor pagado solidity imp herramient Ok me gusta que no está porque lo había visto en la lista y la verdad to para es basa que basa poder dar una solución que era un stack Perdón para una una aplicación estática bien después vino nextjs y nextjs era para aplicaciones dinámicas por eso lo tenemos acá y qué pasó después que nexs dejó de ser también para aplicaciones dinámicas y también se metió en el terreno de aplicaciones estáticas entonces G hizo olvídense de gas no olvídense bien tenemos a ver quiero ver cómo lo fue poniendo empleabilidad design systems storybook totalmente storybook realmente Es una de las cosas que más se utiliza a nivel laboral en las empresas gente hermosa eh les aviso storybook es Dios Ahora mismo dentro de las empresas se utiliza muchísimo para qué Para design systems que es un design System es una serie de reglamentaciones y eh componentes que uno crea a la hora de programar una aplicación ustedes dicen por ejemplo estos son los estilos Estos son eh Por ejemplo la paleta de colores que vamos a utilizar estos son los estilos de botones estos son los estilos de tablas de formularios etcétera Y si en algún lugar de tu aplicación queres utilizar un formulario esto tenés que utilizar y storybook es una muy buena herramienta que lo que te permite es poder justamente dar visibilidad a toda la organización de ese design System con ejemplos te muestra por ejemplo Cómo utilizar dicho componente cuáles son sus propiedades de todo espectacular Entonces qué más puso tywin odio Twin no lo puedo ni Vero la verdad es esa O sea si quieren hacer un proyecto chiquitito tywin después no me gusta para nada no me gusta para nada cero odio tywin no lo puedo ver gente me parece una vomitada de código extra así no más se los digo eh cualquier otra cosa me parece mejor si vos me decís a mí Twin o yo te digo o St components o haete directamente módulo de css y te dejas de [ __ ] me parece mejor todavía Así no más después tenemos nexs Exacto sí nexs creo que es de lo más utilizadora a nivel laboral justamente de la mano con react pero ojo con angular ahora está número dos porque todavía no se ha estabilizado angular 17 en lo laboral pero ojo ojo que se viene potente eh se viene una cosa con angular 17 que va a explotar y b bueno éxitos a mí no me gusta para nada eh No me gusta nox menos Eh entonces Igualmente es como lo está diciendo acá Me parece perfecto lo que dijo midu depende de la zona geográfica Por qué Porque creo que en Perú por ejemplo hay mucho más trabajo de angular en cualquier eh lugar de Asia viw viw está explotado hay mucho trabajo de View y después obviamente ya Estados Unidos y demás reacta también está muy muy potente muy potente Porque da mucha flexibilidad pero yo daría Otra cosita más eh no daría tanto también depende de zona geográfica sino que también lo pondría como un depende el contexto de la aplicación los requerimientos de la aplicación Por qué Porque digamos que nosotros tenemos la clásica una aplicación bancaria es una aplicación que necesita los requerimientos muy muy estables muy estables es más los cambios son complicadísimo que sucedan una vez que ya están establecidos los requerimientos o así Debería ser y el desarrollo es muy muy burocrático hay que hacer muchas cosas se necesita estabilidad y algo que de robustez angular no hay con que darle angular as ahora si tenés por ejemplo requerimientos muy cambiantes está haciendo un proyecto que todavía está buscando su Nicho está viste haciendo mucho pruebas de concepto react react es pero también les voy a decir una cosa Yo le voy a decir otra cosa y AC me pueden funar le diría hagan clip de lo que voy a decir ahora pero react está muy sobrevalorado muy sobrevalorado una vez que uno tiene cierta experiencia y empieza a toquetear otras tecnologías uno puede ver que hay soluciones mucho mejores que react para cosas flexibles spt kit que está hermoso si vos ahora agarrá y quer hacer una aplicación que es estática pero a la vez tiene viste neas esa esa velocidad y todo acá lo tenemos un astro de acá la china Astro está buenísimo para eso o mejor todavía queres algo más rápido todavía puedes hacer como dicen ahí htmx combinado con Astro si quieres lo pués combinar con Astro entonces Está hermoso hermoso tenés muchas soluciones de las cuales react ya está quedando atrás ya no es la Ah querés algo flexible react no hay muchas soluciones lindas ahora eh Y te das cuenta porque vos vas a agarrar eh te metes en sent Boom es rápido lindo muy flexible y muchas cosas que tenía react las veo complicadas las veo muy complicadas el manejo del State el manejo del context que tenés que andar metiendo un provider Pero si usas ese contexto fuera de ese Provider se explota todo no es más te digo una cosa angular se está poniendo muy flexible también eh ojito pero sí que hay ciertas soluciones como el tema de Astro que son soluciones que para cosas estáticas no hay Con qué darle es buenísimo es buenísimo buenísimo Eh Así que eso es lo que yo quiero decir sobre esto él lo puso me decían n en la parte de de muerto para mí no va Les explico es un depende es un depende muy grande y le voy a decir por porque a nivel laboral sí bien hay mucho trabajo y no des hay que decir las cosas como son pero por ahí para un proyecto personal selt Está increíble eh Está muy bueno el tema es que las empresas por mala suerte no quieren tirar para ese lado No sé por qué la verdad está muy bueno pero es como la clásica no a ver yo quiero también que piensen esto por empresas no se usan estas últimas tecnologías bien Por qué las empresas no usan Astro yo no veo muchas empresas con Astro les aviso por para hacer la landing page de la aplicación pero no harían una aplicación entera para clientes con manejo de esto del otro con Astro ya se los estoy diciendo primero que no es el foco no pero por qué no optan por estas cosas y quiero que entiendan esto si yo les digo ojo yo les digo que tienen un cierto límite de dinero y por ese cierto límite de dinero te ofrezco dos coches dos cochecitos por un lado ojo con esto Te voy a ofrecer un tesla un auto probado con buenas tecnologías que ahora mismo en el mercado y todo es Revolución tenés un tesla sos Dios que esto que lo otro pero por el mismo dinero te ofrezco la competencia directa con el tesla te ofrezco un nuevo auto que va a salir ahora que si vos te subís mentalmente le decís a dónde queres ir y va y y anda cuál elegirían ustedes el tesla que ya está probado que tiene todas las certificaciones que esto que lo otro o te la jugas y gastas tu dinero que estuviste años tratando de conseguir para comprar tu primer auto y te compras el prototipo Por así decirlo te vas al tesla porque es seguro confiable ya sabes que funciona esto es lo mismo en las empresas la empresa quiere agarrar y quiere utilizar cosas que están probadas que funcionan y que ya tienen una cierta estabilidad lo mismo pasaba con View View cuando salió las empresas no lo querían utilizar porque se es muy verde Entonces es así ustedes si tuvieran un banco Sí ustedes tuvieron que hacer una aplicación bancaria son un banco tienen que jugar con el dinero de la gente prácticamente o al revés tienen que tratar de no jugar con el dinero de la gente Entonces no van a probar tecnologías nuevas que puede ser que en una de de esas tenga un hueco de seguridad sino que se van a ir a cosas ya confiables cosas que saben que si yo empiezo el proyecto con esto lo voy a ver terminar porque está probado que con esto se puede llegar a terminar el proyecto yo no voy a ponerme a utilizar una tecnología prototipo se entiende viene con ese tema y la presidente nice cuenta claro el tema de View El problema es que demográficamente es muy potente en algunos lugares y en otros no Ese es el tema sí Ese es el tema vamos a llegar a más de 100 eh No te preocupes hoy hoy voy a estar más rato no se no se preocupen hoy es viernes joda joda joda bien a ver testing okay playb Para end to end Cypress para end to end los puso Cypress les estoy diciendo que está muy muy bueno pero le voy a hacer un cambio a lo que ha puesto acá midu no es react testing library es testing library directamente Por qué Porque gente hermosa de mi corazón si ustedes van a testing library miren lo que vamos a conseguir docs frameworks es solamente react testing library yo creo que no es react es View es angular es belt es Marco es pract es Reason es native es Cypress Cypress tiene para Cypress ojo y yo les digo para end to end la combinación perfecta es Cypress Plus testing library Hermosísimo así no más qué se usaba antes de react buena pregunta antes de react se utilizaba angular sí gente porque angular no es a ver angular siempre fue angular angular js el tema que cuando salió la nueva versión de angular el famoso angular 2 que ellos dijeron No es angular 2 porque va a haber 1 billones de versiones no existe más 1 dos y TR bien es angular js para decir que este es el angular anterior y angular sin nada para decir que este es el angular nuevo antes usaba angular js y antes de angular GS se usaba backbone backbone se usaba que no lo conocen Exacto con eso les digo entonces para mí jest hermoso hermoso de mi corazón me encanta jest lo utilizan todas las organizaciones es confiable espectacular Por qué bitest bueno obviamente por bjs bjs hermoso espectacular muy muy muy buen bandler de aplicaciones cuál es el problema porque es o porque no todas las aplicaciones están utilizando bitest sí no todas las aplicaciones todavía todavía Así no más se digo todavía se sigue utilizando en webpack y gente Yo tengo un proyecto en mi trabajo actual que literalmente eh usa webpack y se acaba de hacer eh prácticamente se hizo el año pasado por qué Porque vitest el año pasado todavía estaba un poquito verde y el cliente es una empresa bancaria y no vamos a jugar con el banco no entonces Bueno ahí lo tenemos es Just con tasting library Y anda muy bien anda muy muy muy bien Está hermoso eh Para continuous integration obviamente ghub actions y por mala suerte jenkins a mí jenkins no me gusta mucho no les voy a mentir pero es lo que más utilizan empresas está perfecto y me dicen por ahí el tema que vest utiliza por adentro rb y [Música] r es eso es la compilación de la aplicación directamente con módulos de sm r perd [Música] r git raro que todavía no hay ninguna alternativa de git eh nadie me va a preguntar qué se usaba antes de git quién me lo puede decir qué se usaba antes de git ojo con esto qué se usaba Antes de git yo lo usé sbn muy bien exactamente sbn sbn gente hermosa de mi corazón era como un Drive un Google Drive literal eh era agarrar tenías carpetitas y tirabas los archivos í adentro eso sincroniza y todo el mundo podía acceder a esas carpetitas pero no había control de nada Vos tirabas ha adentro si rompía rompías todo entonces tenías que ir manejando las carpetitas diciendo hasta la carpetita que tiene el cambio de esto tortoise mira u ojo eh terrible terrible no No decí que vino git decí que vino git madre mía nojs Okay sí obviamente Nosotros todo lo que compilamos lo hacemos con nojs ahora por ahora para todo el tema de backend obviamente aws no hay Con qué darle gente sigue siendo muy potente y le voy a decir el Por qué Ay F sila Qué grande el aws es la tecnología predominante para todo el tema de eh manejo y creación de aplicaciones literal eh tenemos otras alternativas sí tenemos otras alternativas tenemos por ejemplo al grande impresionante increíble de versel está buenísimo está impresionante siempre y cuando siempre y cuando puedas aprovechar todas las ventajas que tiene pero si vos queres estabilidad esto que el otro awc anda muy bien y todo esto que está acá yo utilicé Prácticamente todo o sea yo utilicé Dynamo db les digo la aplicación así más tocha así con aws que hice utilizamos aws lambdas con Dynamo db con tier PC tier PC Y utilizábamos también cómo se llamaba para el manejo de usuarios y autenticaciones autorizaciones utilizamos el cli de aws el nuevo una aplicación totalmente de javascript pura ojo con esto y utilizamos cognito exactamente muy interesante proyecto interesante Bueno kubernet sql Sigue siendo sql mysql y por sql pero eh yo agregaría también este tipo de soluciones eh Dynamo es muy potente muy potente y no es todo ese ql la realidad es que acá falta eh Acá está faltando y no es por un tema de sueldo es lo que le estoy diciendo acá falta sql predomina Sí pero es un segú de vuelta volvemos al segun si nosotros agarramos y nos metemos en todo el tema de lo que es System design sabemos lo pueden ver en mis videos de System design que sql no es la opción perfecta hay que está justamente no sql que Cuál es la diferencia uno es indexado y el otro no Entonces si nosotros agarramos Y tenemos una aplicación por ejemplo miren eh atentos tenemos una aplicación que es pero un manjar de cantidad de ems que tenemos adentro de entidades es mejor hacerlo con no sql y hacemos hacemos queries esas queries las hacemos bien bonitas espectaculares con buena performance obtenemos la información que nosotros queremos y lo utilizamos es más podremos utilizar un single Table design ahora si nosotros nos adentramos a que por ejemplo hay una cierta query que se hace muchísimo dentro de esta información tenemos que utilizar sql o lo tenemos que indexar tenemos que acceder rápido es información digamos que tenemos una tabla con eh todas las películas del mundo todas las películas pero acaba de salir openheimer y es boca de todos y todo el mundo quiere saber de openheimer tenemos dos o tres peticiones preguntando por mi pobre angelito y tenemos millones de peticiones yendo a openheimer qué vamos a hacer vamos a agarrar esa información la vamos a cachear y la vamos a guardar en una base de datos sql Entonces cuando vemos que una petición pregunta por openheimer lo que vamos a hacer es directamente no ir a consultar a nuestra super tabla con todas las cosas y hacer una super query para obtener esta información sino que lo que vamos a hacer es utilizar esta petición y directamente direccionar a una tabla sql indexada y acceder directamente a es Catch se entiende después hay técnicas y cosas para poder Cuando borrarlo esta información y demás Pero esta sería la idea entonces acá falta faltaría eso eh faltaría mi no sql por acá están de acuerdo me pueden decir Alan cualquier cosa lo está diciendo Me parece bien eh No hay ningún problema está todo bien está todo bien eh bien para arquitectura de cs a mí me gusta el atomic thinking y el atomic design a mí a mí me gusta atomic design es lo que más me interesa me gusta más que bem que atomic design es me encanta eh Back and for fren les voy a explicar rápidamente qué es esto Back and for fren es una forma de de pensar las aplicaciones en las cuales el bacen va a otorgar información al frontend cuando este lo necesite cuándo lo podemos utilizar digamos por ejemplo que tenemos una aplicación la cual tiene sí procesos muy potentes cálculos muy potentes sí cálculos muy potentes la verdad es que hacerlo en el frontend está mejor por qué porque son ciclos de cpu gratuitos que le robamos al usuario bien pero pero ahora si estos cálculos son tan potentes que me bloquean la máquina ahí es cuando podemos optar por Back and for fren que es decirle baken toma te paso mi cálculo matemático resuélvelo tú y me lo devuelves cuando lo tengas y mientras el usuario hace su vida y todo muy bonito no es el tema de hidratación es otra otro todo es es un tipo de arquitectura bien que puede ir con o sea hidratación es otra cosa totalmente para otra cosa olvídense de esto Esto es en una single page application en una eh aplicación con ser components lo que quieran eh está fantástico No pasa nada pero es esto el Back and for Front es tener una aplicación en la cual aquellas aquellas procesos aquellas lógicas que son muy tediosas para hacerlas en el frontend por tema de que puede afectar la performance o no tanto la performance sino el espacio que ocupa nuestra aplicación no sé si alguna vez les pasó que vamos a a una Tab hacemos inspeccionar elemento y cuando te das cuenta cuánto está pesando porque sí gente esto ocupa espacio en disco a veces se va la miércoles porque tenemos un no sé eh le hemos creado una base de datos al usuario en la web eso es una locura pero lo he visto Eh cuántos de ustedes por ejemplo han utilizado eh Index TV alguien lo ha utilizado sabían ustedes que pueden tener base de datos en la en el Front no Bueno podemos tener base de datos en el Front gente si ustedes agarran y por ejemplo inspeccionamos acá van a ver que si ustedes se van ahora a la parte de application y vienen acá existe Index db Index db es como local storage pero está indexado justamente es como tener una base de datos sql directamente en nuestra aplicación Entonces nosotros aquí podríamos guardar información y justamente acceder cuando quisiéramos bien Es más hay hasta orms para manejos de Index db ojo con esto miren Index db a ver y yo utilicé este dix utilicé dixi está muy bueno eh Está muy bueno cuándo podemos utilizar esto por ejemplo mira está para todos aparte Esto está muy bueno sí se puede encriptar se puede hacer lo que quieran está buenísimo igual Nunca guardan información sensible acá nunca la guarden eh Para es más para no para no tener que andar encriptando lo que pueden hacer es directamente tener en el Front en en dixi va dixi no vamos a decir bien no en Index TV podemos tener aquella información que el fren puede utilizar y que es de carácter público que no hay ningún tipo de problema y cualquier cosita que ustedes necesiten que sea privado lo consultamos con el backend eso se puede hacer eh eso se puede hacer bien eh bien Entonces eso entonces en qué casos por ejemplo podemos tener Index TV lo podemos tener siempre y cuando eh la información que estemos utilizados en el Front no sea muy cambiante digamos que tenemos una aplicación la cual el backend me devuelve información y esa información no cambia en todo el día y yo necesito utilizar dicha información para por ejemplo popular una tabla hacer cálculos matemáticos con dicha información popular una vista la cual tiene cálculos que se tienen que realizar para mostrar otra información etcétera Y es de vuelta información no cambiante entonces en vez de ir a agarrar y hacer 45 peticiones pidiendo usuario cada vez que entro una vista esa información como no cambia yo ya sé cuál es la guardo en Index se entiende así no más les gusta o no les gusta qué tan común es según según es si persiste información es una base de datos en el FR pero ahí está el problema a mí lo que me pasó que tenemos una aplicación la cual eran muchos datos muchísimo datos y hacíamos cálculos matemáticos los cuales se mostraban en el frontend y esos cálculos los guardábamos porque también eran muy potentes El problema es que podíamos tener fácilmente más de 100000 registros y el Index TV podía llegar a pesar 1 giga y no vamos a guardar un giga de información en el browser de un usuario porque nos matan gente nos Asesinan o no entonces hay que tener cuidado bien hay que tener cuidado con esto ahí está el tema sí Ah les gusta este formato del reacciona ven que se puede aprender mucho Después tenemos a ver eh qué más acá estamos no perdón bien después tenemos eh tipc yo utilicé tpc está buenísimo buenísimo para aplicaciones que actualmente están muy de moda que son las famosas monor repo bien aplicaciones en las cuales podemos encontrarnos en el mismo repositorio y que compartimos información podemos utilizar tpc tpc lo que me brinda de comodidad si quieren saber más de esto tengo videos de tpc por favor búsquenlo tengo todo explicado exagon architecture haciendo una aplicación con react trpc y un backend que dice así para para tener bien pero para que sepan entonces la idea de s es que nosotros podemos hacer peticiones al backend y ya sabemos todos los tipados no tenemos que replicar los tipados que tenemos en el frontend perdón en el backend en el frontend vieron la clásica esa que mira me tengo que poner en comunicación con el backend porque ellos me tienen que decir qué es lo que voy a recibir cuando hag un endpoint Y eso lo pongo acá Y si ellos lo llegan a cambiar yo tengo que ir y también tengo que cambiar mis modelos y así no tpc olvídate trpc Es como si yo eh fuera a mi código Vengo al código todo muy perfecto eh Vengo al command mapper y hago esto y me dice y mira acá va a recibir command que es un String y un payload que es un String y te va a devolver Jorge eso es tir PC bien es eso y lo interesante que tiene es que es como una mezcla también con con graphql Por qué Porque utiliza un único canal de comunicación es como un único endpoint y tenemos todo ahí Es como si yo importase bien Cuáles son los métodos que tengo en el backend para utilizar y lo utilizamos está buenísimo la verdad está muy bueno lo recomiendo eh el únic problemática los dos lugares tien que utilizar typescript por eso es la t es typescript bien eh los dos tienen que utilizar typ Eso quiere decir que las dos tecnologías tanto en el fren como en el backen tien que ser javascript para aplicaciones de node aplicaciones con podemos hacer una aplicación con aws eh tranquilísimo con aws cli y usas javascript espectacular está muy bueno bueno pwa obviamente las progressive web applications Lo bueno que tiene las progressive web applications es la facilidad de poder digamos mira lo voy a explicar con un ejemplo que es mucho más rápido si nosotros estamos trabajando en eh un proyecto mejor Mira tenemos dos empresas tenemos una empresa los cual tiene dos proyectos un proyecto son programadores de eh de iOS tenemos otro proyecto que son programadores de eh web de angular hasta ahí estamos bien no eso sería Pero lo lo hermoso no tener directamente un equipo de web y un equipo de Mobile buenísimo es lo más bonito para tener una aplicación performante tenemos un equipo que trabaja sobre la aplicación web Y tenemos otro equipo que va a trabajar sobre la aplicación Mobile y va a ser lo mejor de todo porque es nativo y anda lo más performante posible bueno no siempre es así no siempre tenemos el dinero como para andar pagando a dos personas a la vez entonces podemos utilizar pwas distinto con una aplicación híbrida ojo con esto tenemos aplicaciones nativas que son aquellas aplicaciones las cuales eh Son directamente hechos en el lenguaje nativo bien eh del dispositivo en el cual van a ejecutadas como puede ser iOS Android etcétera y después tenemos las aplicaciones híbridas que son directamente aplicaciones web pero van a ser compiladas luego al formato necesario para ser ejecutadas en los dispositivos como ionic ahí va a aparecer acá en el chat ionic con Córdoba el famoso Córdoba que ahora mucho mejor capacitor para qué hacemos esto de vuelta simplificamos Los costos hacemos nuestra aplicación normal y si necesitamos acceder a un dispositivo de Hardware como puede ser Qué cosa la cámara del teléfono o qué cosa la parte de reconocimiento facial biometría utilizamos capacitor que es una librería que me da acceso a estos estos elementos de hardware Pero qué pasa si mi aplicación no usa ni la cámara ni dispositivo de Hardware ni nada podemos hacer una progressive web application es una aplicación la cual sigue una serie de normas Como por ejemplo que sea offline que cuando tú utilizas la aplicación no te des cuenta que estás en una aplicación no nativa etcétera que es hacer una aplicación web siguiendo esas normas y ya está tenemos la posibilidad de que si yo por ejemplo no un segundo lo pueden hacer en el teléfono eh tranquilísimo digamos que yo estoy en Twitch verdad estoy en Twitch si yo en Twitch ahora vengo acá abajo y toco compartir y cuando sale el compartir pongo a ver si lo tengo por acá p eh Dónde está pum acá yo toco esta opción de acá que ya sé que por ahí no la van a leer Ah porque aparte estoy con el coso y no se Bueno hay una opción acá que es add to home screen eso lo que va a hacer es generar un icono que lo voy a poder acceder desde el menú de aplicaciones y va literalmente a aparecer como si yo estuviera utilizando una aplicación nativa Pero en ningún momento instalé nada esto no va a ningún Store no va a ningún lada y y y funciona perfecto y si quieren saberlo buscan pwaa acá lo tienen y directamente acá tenemos Pumba eh Los Pilares De qué es lo que se necesita para que una aplicación sea pwa sí les parece bien bien Perfecto entonces sigamos qu después tenemos continu development esto necesitamos obviamente testing visual chromatic es la verdad A ver cuál es ese testing visual chromatic ni sabía que existía chromatic Mira bueno que está yo le digo la verdad yo le digo la verdad y acá Viene un palo a mi conocimiento contra eh la guía de estudios 2024 que tenemos acá sí qué voy a decir qué puedo decir yo qué qué A ver qué puedo decir yo Qué saben ustedes ya que yo ya saben que que usted yo pienso de esta manera no muy bien Ale no existe el full stack para mí no existe full stack para mí a ver existen el full stack en el sentido de que hay programadores que tienen mucho conocimiento en algo y luego y luego podemos tener conocimiento de otra cosa Eso para mí es el full stack más normal yo por ejemplo especializo en arquitecturas y aplicaciones con grandes flujos de datos pero pero tengo conocimientos de la parte de styling de la parte de design System más que nada la parte de management no tanto en la parte de desarrollo se estiar obviamente pero no con animaciones y toda la cosa porque no es mi foco y después en backen también se backen pero me tenés quear un ratito o sea s mucho de conocimiento pero después a hora práctica no no tengo mucha práctica en eso porque sé lo suficiente como para poder comunicarme y entender que está bien y que no está bien utilizarse Estamos de acuerdo bien entonces para mí eso es lo más cercano a un full stack pero yo no lo nombraría full stack este tipo de guías de estudio sí lo único que va a hacer para mí es que una persona cuando entra acá eh primero se pega un tiro porque va a decir mira todo lo que tengo que saber te pones así voy a hacer un truco miren saben cómo te pones te pones así Mira así Colorado y te morís directamente te agarr AC la no para todos lados entonces la realidad de esto es que no gente por Dios no no ten que saber todo esto de En serio te lo estoy diciendo no tenés que saber todo esto más en el día de hoy si vas a trabajar en una empresa seria no estoy hablando de una startup estoy hablando de una empresa seria no te van a pedir todo esto ya te lo estoy nombrando no te van a pedir todo esto una empresa seria va a buscar una persona que le solucione el kilombo que está teniendo Ahora sí a mí mi empresa por qué me busco por management porque tengo muy buen management y después porque tengo muy buenas bases de programación obviamente de arquitecturas de poder saber cómo hacer de la mejor manera los requerimientos punto a mí no me contactaron para backend ni nada por eso solo tengo que saber mi parte y poder comunicarme con las demás partes Ya está si vos ahora querés trabajar en una startup las startup van a buscar los full stack porque no tienen dinero porque es una startup Van a tratar de economizar lo más posible Sí y ya se los estoy diciendo tengo 1000 conocidos ya te lo estoy diciendo conocidos amigos y amantes que tienen la problemática de que se han metido de lleno con el versito del full stack en una empresa y terminan en una empresa de los cuales todos los desarrolladores que hay son los SIM seniors no existe ningún senior no existe ninguna persona que lo lidere y esa persona que el full stack no tiene el conocimiento suficiente para realmente serc un full stack porque ahora voy a hacer una corrección sobre lo del full stack existe no y se quiere matar porque les piden hacer un millón de cosas y las van a hacer como pueden que es la realidad lo van a hacer como pueden bien Ahora cuál es la corrección que voy a hacer existe realmente el full stack sí existe pero es una persona muy difícil dec contrar es el famoso unicornio pero por Por qué es difícil de encontrar porque es una persona que ya tiene muchísimos años de experiencia gente muchísimos años de experiencia hay dos tipos de full stack el full stack que estaba en la época cuando yo inicié que literalmente las páginas web eran cuadrados bien entonces la gente re verdad no era Front era backend y el Front eran cosas cuadradas feas pero funcionaban eso era un full stack el chavón sabía cómo hacer un backend Cómo hacer el código subirlo p que se visualice que toca el botoncito que le peg n y se terminó era más fácil era mucho más fácil ahora es muy difícil ser Esta persona es muy difícil ser esta persona en serio se esto es muy difícil es casi es muy imposible ser esta persona con dos años de experiencia por ejemplo Sí en serio les digo esto es imposible Entonces no eh recomendación no se sientan mal si no saben todo esto yo no sé mucho de estas cosas y me interesan Sí pero no necesito porque es mi especialización ahora Si yo fuera un sí un freelancer al menos voy a tener que poder hacer una aplicación y tirarse de estas cosas sí voy a tener que saber un poquito de todo esto voy a tener que saber por ejemplo vamos a tirar un stack no voy a tener que saber nextjs voy a tener que saber hacer testing con Cypress voy a tener que utilizar eh jest con testing library para la parte de Front de unit testing Perdón voy a tener que utilizar git actions que es lo más fácil para continuous integration por ahí ni siquiera hago continuous integration porque yo soy yo solo eh voy a usar un repositorio de git en el backend puedo directamente utilizar aws y me hago una aplicación sencilla con Dynamo eh con como hablamos o no con cognito para manejo de usuarios utilizo por ailandas para pegarle y y sacando o por ahí no por ahí no uso landas y utilizo así no más bien eh Rest y listo eh Y después me utilizo una base de datos con sql que puede ser sqlite ya está full stack Ah sos full stack no no sos full stack es una persona que sabe todo un poquitito bien Es es una persona que sabe de todo un poquitito porque gracias a esto no estás sacando muchas cosas de arquitectura bien hay 1 maneras de renderizar un componente ahora mismo 1000 formas de rendering que tenemos la hidratación que tenemos eh Por ejemplo lo que sería eh A ver spas que son las single p applications después tenemos las eh ssr las server rendering luego tenemos los server components luego tenemos los eh statis generation luego tenemos se entiende lo que digo y todas estas cosas son diferentes arquitecturas que son solamente en el frontend no estamos hablando del backend son solamente de cosas del frontend que son nuevas No eso es lo peor de todo son cosas viejas Sí porque lo que vimos el otro día de htmx junto con lo que sería htmx con un un backen sí que es literalmente un template enine eh yo el otro día hice un proyectito muy chiquitito con noes hice un servidor de Express utilicé pug como template enine y utilicé htmx para agarrar hacer peticiones esto que el otro pum y sacar una aplicación web andando buenísimo bien y con Ahora yo soy full stack no soy una persona que un servidor rep pedorro decir la verdad bien utilicé una librería que la leí así no más por arriba y funcionó la aprendí rapidísimo y hice fren no hice nada de fren Solamente utilicé htmx ya está que es otra librería para no usar justamente javascript para que lo haga por mí Soy full stack no me Hi una aplicación que tiene Front Back Sí pero no soy full stack solamente apliqué cosas en el backend por ejemplo y me olvidé de toda la parte del frontend entonces ojo y como les digo eso no es nuevo Esto es viejísimo lo que acabo de decir porque los template engines que ent hermosa de mi corazón Si nosotros por ejemplo vamos a uno de los más conocidos que es handlebar que esto es un tipo de arquitectura de una aplicación pero tranquilísimo que son justamente los componentes servidos del lado del eh del servidor miren quiero que vean esto eh vamos a agarrar y vamos a ir a ghub este es handlebars en github quiero agarrar y quiero ver Cuándo surge el primer Release vamos a ver si es que lo tienen por ahí ni siquiera lo tenían acá ojo Es más mira este es el primer Release que estoy viendo espera eh handle Bars y vamos a poner npm por npm lo podemos sacar mejor a ver las publish eh Hace 5 meses Mira la cantidad de dependencia 80 versiones tiene miren miren miren 12 años tiene esto 12 años gente se entiende 12 años no es nuevo esto son Solamente cosas modas que van viniendo surgiendo que se dan cuenta que hay la single p application son la mejor del mundo sí hacemos muchas más cosas y lógica de lado de los frend vamos el frend es c vez más complicado Wow dijeron los frontend Ahora somos programadores que antes no le querían decían Ah ustedes no son programadores son maquetadores nos decían Ahora somos unos desarrolladores impresionantes y después se viene con que ah no pero hacer single p application afecta al co porque tarda mucho porque tenemos un poquitito también de de como es cont shift que tenemos el tema esto de que tarda mucho la imagen que tarda mucho hacer la petición y que esto y que el otro y que server components Claro que sí hacemos server rendering y ahora que el servidor me de los componentes rapidísimo buenísimo metemos html de una y con eso el servidor ya sabe todo y los scrollers digo y los scrollers saben todo lo que hay en la aplicación Dale o sea todo cambia todo cambia va y viene y es así y son modas y son cosas que hay que aprender lo que yo les puedo decir es que cada cosa que uno aprenda mejora para otro lugar es así bien pero son modas si yo no sé tir el PC soy un mal desarrollador no sos una persona que no ha tenido la necesidad me entendés no tuviste la necesidad de tocarlo ya está Déjense de [ __ ] un poco o sea no es que por ejemplo no voy a conseguir trabajo si no toco trpc no no vas a tocar los trabajos que pidan trpc Por qué Porque ellos han tenido una problemática y la han solucionado con trpc es la única solución No no es la única solución usas Rest listo se terminó Entonces vas a ir a los trabajos que van con Rest ya está nada más bien no quiere decir que sea mal trabajador sino que sos una persona que realmente ahora no hubo la necesidad de que lo toques no tuviste la problemática de eh que se soluciona con esta tecnología se terminó pero entienden Por qué digo esto Esto está bueno como un pantallazo para saber todo lo lo que hay ahora mismo no Qué son las cosas que se están utilizando y cosas así cosas que se vienen coincido con todo lo que está acá realmente coincido con todo lo que está acá eh pero la verdad es esa o sea son es como un pantallazo de cositas para investigar para leer para ver si son buenas opciones para problemáticas y cosas que tengas dentro de tu trabajo y listo no es algo que tenés que estudiar todo esto est es la guía definitiva de estudios de todo lo que tenés que saber para el 2024 no no no de última estudiarlo a nivel de saber qué problemática soluciona en qué contexto se puede llegar a aplicar y con eso ves Si algún día de mañana te toca esta problemática ya sabes que esta es la solución que tenés me entendés y ahí te lo pones a estudiar a fondo ahora no así no más se entiende bien les gusta esta manera de pensar los calma un poco la verdad eh los cambia un poco un poquitito Mira yo laboraba con larabel ojo así hice larabel en su momento y el arabel bien eh Bueno quick obviamente solid js Sí la verdad que sí eh Son sí pero más o menos ahí eh Quería dar solamente est esta idea de este pantallazo está muy bien la verdad que está está muy bien toda esta guía está muy bueno Y sí yo creo que para web html c javascript ypt es la que va no hay otra no hay otra es un monopolio terriblemente después dat Ai python sí Pero saben Por qué python por la librería por la cantidad de librerías que tiene ahora mismo para esto es eso Data backend Java sí Java en el sentido de que literalmente es uno de los que más utiliza ahora no a nivel mundial pero la verdad la verdad es que python es como el segundo y javascript también puede ser uno bueno para daten pero fácilmente ojo con eso rust es el futuro de la II rust es el futuro de muchas cosas así no más te lo digo así no más bueno Go también Go está buenísimo tengo ganas dentro de muy poquitito de hacer algo con rust con Go también tengo muchas ganas de hacer algo con con con goang muchas ganas a día lo vamos a hacer quiero agarrar quiero aender No es que quiero aprender vamos a cambiar la cosa quiero aplicar mis conocimientos de backend con un lenguaje diferente de javascript para poder agarrar no y y y poder lidiar con otras cosas expandir un poquitito más los Horizontes eh algo que me propuse Les comento es lo siguiente dentro de poquitito como ahí ya lo sabrán eh voy a tener un hijo ahora ya nada el mes que viene voy a tener un hijo y una de las cosas que me dije es mira durante dos meses no voy a streamear Sorry con eso no voy a hacer Stream De nada quiero hacer full full baby bien y después de ahí voy a volver a hacer streaming y todo pero no voy a estar ocioso en esos dos meses quiero ponerme a aprender algo diferente y quiero ponerme a leer mucho bien quiero ponerme a leer mucho de aws quiero tratar de meterme por acá y Quiero meterme en Go también en Go o rust estoy viendo bien una cosa así me encantaría la verdad que me encantaría así que por ahí vien muchas cositas eh

bien entonces Esta es la guía de estudio que nos está diciendo el Grande amigo bien dice guía de estudio 2024 para probadores full stack lo primero que voy a decir es lo siguiente y quiero que estén muy atentos eh vamos a abrirlo directamente en una Tab así le puedo ir haciendo zoom Ahora sí eh Ahora sí Entonces miren tenemos empleabilidad sueldo y promesas futuras Me parece bien me parece bien a ver Denme un segundito tema de testing integration Ok obviamente kubernet sql perfecto ure python Java stack Open source quick remix Estos son las promesas futuras ojo para el mejor sueldo Entonces le he puesto arquitectura ccs atomic design back mejor pagado solidity imp herramient Ok me gusta que no está porque lo había visto en la lista y la verdad to para es basa que basa poder dar una solución que era un stack Perdón para una una aplicación estática bien después vino nextjs y nextjs era para aplicaciones dinámicas por eso lo tenemos acá y qué pasó después que nexs dejó de ser también para aplicaciones dinámicas y también se metió en el terreno de aplicaciones estáticas entonces G hizo olvídense de gas no olvídense bien tenemos a ver quiero ver cómo lo fue poniendo empleabilidad design systems storybook totalmente storybook realmente Es una de las cosas que más se utiliza a nivel laboral en las empresas gente hermosa eh les aviso storybook es Dios Ahora mismo dentro de las empresas se utiliza muchísimo para qué Para design systems que es un design System es una serie de reglamentaciones y eh componentes que uno crea a la hora de programar una aplicación ustedes dicen por ejemplo estos son los estilos Estos son eh Por ejemplo la paleta de colores que vamos a utilizar estos son los estilos de botones estos son los estilos de tablas de formularios etcétera Y si en algún lugar de tu aplicación queres utilizar un formulario esto tenés que utilizar y storybook es una muy buena herramienta que lo que te permite es poder justamente dar visibilidad a toda la organización de ese design System con ejemplos te muestra por ejemplo Cómo utilizar dicho componente cuáles son sus propiedades de todo espectacular Entonces qué más puso tywin odio Twin no lo puedo ni Vero la verdad es esa O sea si quieren hacer un proyecto chiquitito tywin después no me gusta para nada no me gusta para nada cero odio tywin no lo puedo ver gente me parece una vomitada de código extra así no más se los digo eh cualquier otra cosa me parece mejor si vos me decís a mí Twin o yo te digo o St components o haete directamente módulo de css y te dejas de [ __ ] me parece mejor todavía Así no más después tenemos nexs Exacto sí nexs creo que es de lo más utilizadora a nivel laboral justamente de la mano con react pero ojo con angular ahora está número dos porque todavía no se ha estabilizado angular 17 en lo laboral pero ojo ojo que se viene potente eh se viene una cosa con angular 17 que va a explotar y b bueno éxitos a mí no me gusta para nada eh No me gusta nox menos Eh entonces Igualmente es como lo está diciendo acá Me parece perfecto lo que dijo midu depende de la zona geográfica Por qué Porque creo que en Perú por ejemplo hay mucho más trabajo de angular en cualquier eh lugar de Asia viw viw está explotado hay mucho trabajo de View y después obviamente ya Estados Unidos y demás reacta también está muy muy potente muy potente Porque da mucha flexibilidad pero yo daría Otra cosita más eh no daría tanto también depende de zona geográfica sino que también lo pondría como un depende el contexto de la aplicación los requerimientos de la aplicación Por qué Porque digamos que nosotros tenemos la clásica una aplicación bancaria es una aplicación que necesita los requerimientos muy muy estables muy estables es más los cambios son complicadísimo que sucedan una vez que ya están establecidos los requerimientos o así Debería ser y el desarrollo es muy muy burocrático hay que hacer muchas cosas se necesita estabilidad y algo que de robustez angular no hay con que darle angular as ahora si tenés por ejemplo requerimientos muy cambiantes está haciendo un proyecto que todavía está buscando su Nicho está viste haciendo mucho pruebas de concepto react react es pero también les voy a decir una cosa Yo le voy a decir otra cosa y AC me pueden funar le diría hagan clip de lo que voy a decir ahora pero react está muy sobrevalorado muy sobrevalorado una vez que uno tiene cierta experiencia y empieza a toquetear otras tecnologías uno puede ver que hay soluciones mucho mejores que react para cosas flexibles spt kit que está hermoso si vos ahora agarrá y quer hacer una aplicación que es estática pero a la vez tiene viste neas esa esa velocidad y todo acá lo tenemos un astro de acá la china Astro está buenísimo para eso o mejor todavía queres algo más rápido todavía puedes hacer como dicen ahí htmx combinado con Astro si quieres lo pués combinar con Astro entonces Está hermoso hermoso tenés muchas soluciones de las cuales react ya está quedando atrás ya no es la Ah querés algo flexible react no hay muchas soluciones lindas ahora eh Y te das cuenta porque vos vas a agarrar eh te metes en sent Boom es rápido lindo muy flexible y muchas cosas que tenía react las veo complicadas las veo muy complicadas el manejo del State el manejo del context que tenés que andar metiendo un provider Pero si usas ese contexto fuera de ese Provider se explota todo no es más te digo una cosa angular se está poniendo muy flexible también eh ojito pero sí que hay ciertas soluciones como el tema de Astro que son soluciones que para cosas estáticas no hay Con qué darle es buenísimo es buenísimo buenísimo Eh Así que eso es lo que yo quiero decir sobre esto él lo puso me decían n en la parte de de muerto para mí no va Les explico es un depende es un depende muy grande y le voy a decir por porque a nivel laboral sí bien hay mucho trabajo y no des hay que decir las cosas como son pero por ahí para un proyecto personal selt Está increíble eh Está muy bueno el tema es que las empresas por mala suerte no quieren tirar para ese lado No sé por qué la verdad está muy bueno pero es como la clásica no a ver yo quiero también que piensen esto por empresas no se usan estas últimas tecnologías bien Por qué las empresas no usan Astro yo no veo muchas empresas con Astro les aviso por para hacer la landing page de la aplicación pero no harían una aplicación entera para clientes con manejo de esto del otro con Astro ya se los estoy diciendo primero que no es el foco no pero por qué no optan por estas cosas y quiero que entiendan esto si yo les digo ojo yo les digo que tienen un cierto límite de dinero y por ese cierto límite de dinero te ofrezco dos coches dos cochecitos por un lado ojo con esto Te voy a ofrecer un tesla un auto probado con buenas tecnologías que ahora mismo en el mercado y todo es Revolución tenés un tesla sos Dios que esto que lo otro pero por el mismo dinero te ofrezco la competencia directa con el tesla te ofrezco un nuevo auto que va a salir ahora que si vos te subís mentalmente le decís a dónde queres ir y va y y anda cuál elegirían ustedes el tesla que ya está probado que tiene todas las certificaciones que esto que lo otro o te la jugas y gastas tu dinero que estuviste años tratando de conseguir para comprar tu primer auto y te compras el prototipo Por así decirlo te vas al tesla porque es seguro confiable ya sabes que funciona esto es lo mismo en las empresas la empresa quiere agarrar y quiere utilizar cosas que están probadas que funcionan y que ya tienen una cierta estabilidad lo mismo pasaba con View View cuando salió las empresas no lo querían utilizar porque se es muy verde Entonces es así ustedes si tuvieran un banco Sí ustedes tuvieron que hacer una aplicación bancaria son un banco tienen que jugar con el dinero de la gente prácticamente o al revés tienen que tratar de no jugar con el dinero de la gente Entonces no van a probar tecnologías nuevas que puede ser que en una de de esas tenga un hueco de seguridad sino que se van a ir a cosas ya confiables cosas que saben que si yo empiezo el proyecto con esto lo voy a ver terminar porque está probado que con esto se puede llegar a terminar el proyecto yo no voy a ponerme a utilizar una tecnología prototipo se entiende viene con ese tema y la presidente nice cuenta claro el tema de View El problema es que demográficamente es muy potente en algunos lugares y en otros no Ese es el tema sí Ese es el tema vamos a llegar a más de 100 eh No te preocupes hoy hoy voy a estar más rato no se no se preocupen hoy es viernes joda joda joda bien a ver testing okay playb Para end to end Cypress para end to end los puso Cypress les estoy diciendo que está muy muy bueno pero le voy a hacer un cambio a lo que ha puesto acá midu no es react testing library es testing library directamente Por qué Porque gente hermosa de mi corazón si ustedes van a testing library miren lo que vamos a conseguir docs frameworks es solamente react testing library yo creo que no es react es View es angular es belt es Marco es pract es Reason es native es Cypress Cypress tiene para Cypress ojo y yo les digo para end to end la combinación perfecta es Cypress Plus testing library Hermosísimo así no más qué se usaba antes de react buena pregunta antes de react se utilizaba angular sí gente porque angular no es a ver angular siempre fue angular angular js el tema que cuando salió la nueva versión de angular el famoso angular 2 que ellos dijeron No es angular 2 porque va a haber 1 billones de versiones no existe más 1 dos y TR bien es angular js para decir que este es el angular anterior y angular sin nada para decir que este es el angular nuevo antes usaba angular js y antes de angular GS se usaba backbone backbone se usaba que no lo conocen Exacto con eso les digo entonces para mí jest hermoso hermoso de mi corazón me encanta jest lo utilizan todas las organizaciones es confiable espectacular Por qué bitest bueno obviamente por bjs bjs hermoso espectacular muy muy muy buen bandler de aplicaciones cuál es el problema porque es o porque no todas las aplicaciones están utilizando bitest sí no todas las aplicaciones todavía todavía Así no más se digo todavía se sigue utilizando en webpack y gente Yo tengo un proyecto en mi trabajo actual que literalmente eh usa webpack y se acaba de hacer eh prácticamente se hizo el año pasado por qué Porque vitest el año pasado todavía estaba un poquito verde y el cliente es una empresa bancaria y no vamos a jugar con el banco no entonces Bueno ahí lo tenemos es Just con tasting library Y anda muy bien anda muy muy muy bien Está hermoso eh Para continuous integration obviamente ghub actions y por mala suerte jenkins a mí jenkins no me gusta mucho no les voy a mentir pero es lo que más utilizan empresas está perfecto y me dicen por ahí el tema que vest utiliza por adentro rb y [Música] r es eso es la compilación de la aplicación directamente con módulos de sm r perd [Música] r git raro que todavía no hay ninguna alternativa de git eh nadie me va a preguntar qué se usaba antes de git quién me lo puede decir qué se usaba antes de git ojo con esto qué se usaba Antes de git yo lo usé sbn muy bien exactamente sbn sbn gente hermosa de mi corazón era como un Drive un Google Drive literal eh era agarrar tenías carpetitas y tirabas los archivos í adentro eso sincroniza y todo el mundo podía acceder a esas carpetitas pero no había control de nada Vos tirabas ha adentro si rompía rompías todo entonces tenías que ir manejando las carpetitas diciendo hasta la carpetita que tiene el cambio de esto tortoise mira u ojo eh terrible terrible no No decí que vino git decí que vino git madre mía nojs Okay sí obviamente Nosotros todo lo que compilamos lo hacemos con nojs ahora por ahora para todo el tema de backend obviamente aws no hay Con qué darle gente sigue siendo muy potente y le voy a decir el Por qué Ay F sila Qué grande el aws es la tecnología predominante para todo el tema de eh manejo y creación de aplicaciones literal eh tenemos otras alternativas sí tenemos otras alternativas tenemos por ejemplo al grande impresionante increíble de versel está buenísimo está impresionante siempre y cuando siempre y cuando puedas aprovechar todas las ventajas que tiene pero si vos queres estabilidad esto que el otro awc anda muy bien y todo esto que está acá yo utilicé Prácticamente todo o sea yo utilicé Dynamo db les digo la aplicación así más tocha así con aws que hice utilizamos aws lambdas con Dynamo db con tier PC tier PC Y utilizábamos también cómo se llamaba para el manejo de usuarios y autenticaciones autorizaciones utilizamos el cli de aws el nuevo una aplicación totalmente de javascript pura ojo con esto y utilizamos cognito exactamente muy interesante proyecto interesante Bueno kubernet sql Sigue siendo sql mysql y por sql pero eh yo agregaría también este tipo de soluciones eh Dynamo es muy potente muy potente y no es todo ese ql la realidad es que acá falta eh Acá está faltando y no es por un tema de sueldo es lo que le estoy diciendo acá falta sql predomina Sí pero es un segú de vuelta volvemos al segun si nosotros agarramos y nos metemos en todo el tema de lo que es System design sabemos lo pueden ver en mis videos de System design que sql no es la opción perfecta hay que está justamente no sql que Cuál es la diferencia uno es indexado y el otro no Entonces si nosotros agarramos Y tenemos una aplicación por ejemplo miren eh atentos tenemos una aplicación que es pero un manjar de cantidad de ems que tenemos adentro de entidades es mejor hacerlo con no sql y hacemos hacemos queries esas queries las hacemos bien bonitas espectaculares con buena performance obtenemos la información que nosotros queremos y lo utilizamos es más podremos utilizar un single Table design ahora si nosotros nos adentramos a que por ejemplo hay una cierta query que se hace muchísimo dentro de esta información tenemos que utilizar sql o lo tenemos que indexar tenemos que acceder rápido es información digamos que tenemos una tabla con eh todas las películas del mundo todas las películas pero acaba de salir openheimer y es boca de todos y todo el mundo quiere saber de openheimer tenemos dos o tres peticiones preguntando por mi pobre angelito y tenemos millones de peticiones yendo a openheimer qué vamos a hacer vamos a agarrar esa información la vamos a cachear y la vamos a guardar en una base de datos sql Entonces cuando vemos que una petición pregunta por openheimer lo que vamos a hacer es directamente no ir a consultar a nuestra super tabla con todas las cosas y hacer una super query para obtener esta información sino que lo que vamos a hacer es utilizar esta petición y directamente direccionar a una tabla sql indexada y acceder directamente a es Catch se entiende después hay técnicas y cosas para poder Cuando borrarlo esta información y demás Pero esta sería la idea entonces acá falta faltaría eso eh faltaría mi no sql por acá están de acuerdo me pueden decir Alan cualquier cosa lo está diciendo Me parece bien eh No hay ningún problema está todo bien está todo bien eh bien para arquitectura de cs a mí me gusta el atomic thinking y el atomic design a mí a mí me gusta atomic design es lo que más me interesa me gusta más que bem que atomic design es me encanta eh Back and for fren les voy a explicar rápidamente qué es esto Back and for fren es una forma de de pensar las aplicaciones en las cuales el bacen va a otorgar información al frontend cuando este lo necesite cuándo lo podemos utilizar digamos por ejemplo que tenemos una aplicación la cual tiene sí procesos muy potentes cálculos muy potentes sí cálculos muy potentes la verdad es que hacerlo en el frontend está mejor por qué porque son ciclos de cpu gratuitos que le robamos al usuario bien pero pero ahora si estos cálculos son tan potentes que me bloquean la máquina ahí es cuando podemos optar por Back and for fren que es decirle baken toma te paso mi cálculo matemático resuélvelo tú y me lo devuelves cuando lo tengas y mientras el usuario hace su vida y todo muy bonito no es el tema de hidratación es otra otro todo es es un tipo de arquitectura bien que puede ir con o sea hidratación es otra cosa totalmente para otra cosa olvídense de esto Esto es en una single page application en una eh aplicación con ser components lo que quieran eh está fantástico No pasa nada pero es esto el Back and for Front es tener una aplicación en la cual aquellas aquellas procesos aquellas lógicas que son muy tediosas para hacerlas en el frontend por tema de que puede afectar la performance o no tanto la performance sino el espacio que ocupa nuestra aplicación no sé si alguna vez les pasó que vamos a a una Tab hacemos inspeccionar elemento y cuando te das cuenta cuánto está pesando porque sí gente esto ocupa espacio en disco a veces se va la miércoles porque tenemos un no sé eh le hemos creado una base de datos al usuario en la web eso es una locura pero lo he visto Eh cuántos de ustedes por ejemplo han utilizado eh Index TV alguien lo ha utilizado sabían ustedes que pueden tener base de datos en la en el Front no Bueno podemos tener base de datos en el Front gente si ustedes agarran y por ejemplo inspeccionamos acá van a ver que si ustedes se van ahora a la parte de application y vienen acá existe Index db Index db es como local storage pero está indexado justamente es como tener una base de datos sql directamente en nuestra aplicación Entonces nosotros aquí podríamos guardar información y justamente acceder cuando quisiéramos bien Es más hay hasta orms para manejos de Index db ojo con esto miren Index db a ver y yo utilicé este dix utilicé dixi está muy bueno eh Está muy bueno cuándo podemos utilizar esto por ejemplo mira está para todos aparte Esto está muy bueno sí se puede encriptar se puede hacer lo que quieran está buenísimo igual Nunca guardan información sensible acá nunca la guarden eh Para es más para no para no tener que andar encriptando lo que pueden hacer es directamente tener en el Front en en dixi va dixi no vamos a decir bien no en Index TV podemos tener aquella información que el fren puede utilizar y que es de carácter público que no hay ningún tipo de problema y cualquier cosita que ustedes necesiten que sea privado lo consultamos con el backend eso se puede hacer eh eso se puede hacer bien eh bien Entonces eso entonces en qué casos por ejemplo podemos tener Index TV lo podemos tener siempre y cuando eh la información que estemos utilizados en el Front no sea muy cambiante digamos que tenemos una aplicación la cual el backend me devuelve información y esa información no cambia en todo el día y yo necesito utilizar dicha información para por ejemplo popular una tabla hacer cálculos matemáticos con dicha información popular una vista la cual tiene cálculos que se tienen que realizar para mostrar otra información etcétera Y es de vuelta información no cambiante entonces en vez de ir a agarrar y hacer 45 peticiones pidiendo usuario cada vez que entro una vista esa información como no cambia yo ya sé cuál es la guardo en Index se entiende así no más les gusta o no les gusta qué tan común es según según es si persiste información es una base de datos en el FR pero ahí está el problema a mí lo que me pasó que tenemos una aplicación la cual eran muchos datos muchísimo datos y hacíamos cálculos matemáticos los cuales se mostraban en el frontend y esos cálculos los guardábamos porque también eran muy potentes El problema es que podíamos tener fácilmente más de 100000 registros y el Index TV podía llegar a pesar 1 giga y no vamos a guardar un giga de información en el browser de un usuario porque nos matan gente nos Asesinan o no entonces hay que tener cuidado bien hay que tener cuidado con esto ahí está el tema sí Ah les gusta este formato del reacciona ven que se puede aprender mucho Después tenemos a ver eh qué más acá estamos no perdón bien después tenemos eh tipc yo utilicé tpc está buenísimo buenísimo para aplicaciones que actualmente están muy de moda que son las famosas monor repo bien aplicaciones en las cuales podemos encontrarnos en el mismo repositorio y que compartimos información podemos utilizar tpc tpc lo que me brinda de comodidad si quieren saber más de esto tengo videos de tpc por favor búsquenlo tengo todo explicado exagon architecture haciendo una aplicación con react trpc y un backend que dice así para para tener bien pero para que sepan entonces la idea de s es que nosotros podemos hacer peticiones al backend y ya sabemos todos los tipados no tenemos que replicar los tipados que tenemos en el frontend perdón en el backend en el frontend vieron la clásica esa que mira me tengo que poner en comunicación con el backend porque ellos me tienen que decir qué es lo que voy a recibir cuando hag un endpoint Y eso lo pongo acá Y si ellos lo llegan a cambiar yo tengo que ir y también tengo que cambiar mis modelos y así no tpc olvídate trpc Es como si yo eh fuera a mi código Vengo al código todo muy perfecto eh Vengo al command mapper y hago esto y me dice y mira acá va a recibir command que es un String y un payload que es un String y te va a devolver Jorge eso es tir PC bien es eso y lo interesante que tiene es que es como una mezcla también con con graphql Por qué Porque utiliza un único canal de comunicación es como un único endpoint y tenemos todo ahí Es como si yo importase bien Cuáles son los métodos que tengo en el backend para utilizar y lo utilizamos está buenísimo la verdad está muy bueno lo recomiendo eh el únic problemática los dos lugares tien que utilizar typescript por eso es la t es typescript bien eh los dos tienen que utilizar typ Eso quiere decir que las dos tecnologías tanto en el fren como en el backen tien que ser javascript para aplicaciones de node aplicaciones con podemos hacer una aplicación con aws eh tranquilísimo con aws cli y usas javascript espectacular está muy bueno bueno pwa obviamente las progressive web applications Lo bueno que tiene las progressive web applications es la facilidad de poder digamos mira lo voy a explicar con un ejemplo que es mucho más rápido si nosotros estamos trabajando en eh un proyecto mejor Mira tenemos dos empresas tenemos una empresa los cual tiene dos proyectos un proyecto son programadores de eh de iOS tenemos otro proyecto que son programadores de eh web de angular hasta ahí estamos bien no eso sería Pero lo lo hermoso no tener directamente un equipo de web y un equipo de Mobile buenísimo es lo más bonito para tener una aplicación performante tenemos un equipo que trabaja sobre la aplicación web Y tenemos otro equipo que va a trabajar sobre la aplicación Mobile y va a ser lo mejor de todo porque es nativo y anda lo más performante posible bueno no siempre es así no siempre tenemos el dinero como para andar pagando a dos personas a la vez entonces podemos utilizar pwas distinto con una aplicación híbrida ojo con esto tenemos aplicaciones nativas que son aquellas aplicaciones las cuales eh Son directamente hechos en el lenguaje nativo bien eh del dispositivo en el cual van a ejecutadas como puede ser iOS Android etcétera y después tenemos las aplicaciones híbridas que son directamente aplicaciones web pero van a ser compiladas luego al formato necesario para ser ejecutadas en los dispositivos como ionic ahí va a aparecer acá en el chat ionic con Córdoba el famoso Córdoba que ahora mucho mejor capacitor para qué hacemos esto de vuelta simplificamos Los costos hacemos nuestra aplicación normal y si necesitamos acceder a un dispositivo de Hardware como puede ser Qué cosa la cámara del teléfono o qué cosa la parte de reconocimiento facial biometría utilizamos capacitor que es una librería que me da acceso a estos estos elementos de hardware Pero qué pasa si mi aplicación no usa ni la cámara ni dispositivo de Hardware ni nada podemos hacer una progressive web application es una aplicación la cual sigue una serie de normas Como por ejemplo que sea offline que cuando tú utilizas la aplicación no te des cuenta que estás en una aplicación no nativa etcétera que es hacer una aplicación web siguiendo esas normas y ya está tenemos la posibilidad de que si yo por ejemplo no un segundo lo pueden hacer en el teléfono eh tranquilísimo digamos que yo estoy en Twitch verdad estoy en Twitch si yo en Twitch ahora vengo acá abajo y toco compartir y cuando sale el compartir pongo a ver si lo tengo por acá p eh Dónde está pum acá yo toco esta opción de acá que ya sé que por ahí no la van a leer Ah porque aparte estoy con el coso y no se Bueno hay una opción acá que es add to home screen eso lo que va a hacer es generar un icono que lo voy a poder acceder desde el menú de aplicaciones y va literalmente a aparecer como si yo estuviera utilizando una aplicación nativa Pero en ningún momento instalé nada esto no va a ningún Store no va a ningún lada y y y funciona perfecto y si quieren saberlo buscan pwaa acá lo tienen y directamente acá tenemos Pumba eh Los Pilares De qué es lo que se necesita para que una aplicación sea pwa sí les parece bien bien Perfecto entonces sigamos qu después tenemos continu development esto necesitamos obviamente testing visual chromatic es la verdad A ver cuál es ese testing visual chromatic ni sabía que existía chromatic Mira bueno que está yo le digo la verdad yo le digo la verdad y acá Viene un palo a mi conocimiento contra eh la guía de estudios 2024 que tenemos acá sí qué voy a decir qué puedo decir yo qué qué A ver qué puedo decir yo Qué saben ustedes ya que yo ya saben que que usted yo pienso de esta manera no muy bien Ale no existe el full stack para mí no existe full stack para mí a ver existen el full stack en el sentido de que hay programadores que tienen mucho conocimiento en algo y luego y luego podemos tener conocimiento de otra cosa Eso para mí es el full stack más normal yo por ejemplo especializo en arquitecturas y aplicaciones con grandes flujos de datos pero pero tengo conocimientos de la parte de styling de la parte de design System más que nada la parte de management no tanto en la parte de desarrollo se estiar obviamente pero no con animaciones y toda la cosa porque no es mi foco y después en backen también se backen pero me tenés quear un ratito o sea s mucho de conocimiento pero después a hora práctica no no tengo mucha práctica en eso porque sé lo suficiente como para poder comunicarme y entender que está bien y que no está bien utilizarse Estamos de acuerdo bien entonces para mí eso es lo más cercano a un full stack pero yo no lo nombraría full stack este tipo de guías de estudio sí lo único que va a hacer para mí es que una persona cuando entra acá eh primero se pega un tiro porque va a decir mira todo lo que tengo que saber te pones así voy a hacer un truco miren saben cómo te pones te pones así Mira así Colorado y te morís directamente te agarr AC la no para todos lados entonces la realidad de esto es que no gente por Dios no no ten que saber todo esto de En serio te lo estoy diciendo no tenés que saber todo esto más en el día de hoy si vas a trabajar en una empresa seria no estoy hablando de una startup estoy hablando de una empresa seria no te van a pedir todo esto ya te lo estoy nombrando no te van a pedir todo esto una empresa seria va a buscar una persona que le solucione el kilombo que está teniendo Ahora sí a mí mi empresa por qué me busco por management porque tengo muy buen management y después porque tengo muy buenas bases de programación obviamente de arquitecturas de poder saber cómo hacer de la mejor manera los requerimientos punto a mí no me contactaron para backend ni nada por eso solo tengo que saber mi parte y poder comunicarme con las demás partes Ya está si vos ahora querés trabajar en una startup las startup van a buscar los full stack porque no tienen dinero porque es una startup Van a tratar de economizar lo más posible Sí y ya se los estoy diciendo tengo 1000 conocidos ya te lo estoy diciendo conocidos amigos y amantes que tienen la problemática de que se han metido de lleno con el versito del full stack en una empresa y terminan en una empresa de los cuales todos los desarrolladores que hay son los SIM seniors no existe ningún senior no existe ninguna persona que lo lidere y esa persona que el full stack no tiene el conocimiento suficiente para realmente serc un full stack porque ahora voy a hacer una corrección sobre lo del full stack existe no y se quiere matar porque les piden hacer un millón de cosas y las van a hacer como pueden que es la realidad lo van a hacer como pueden bien Ahora cuál es la corrección que voy a hacer existe realmente el full stack sí existe pero es una persona muy difícil dec contrar es el famoso unicornio pero por Por qué es difícil de encontrar porque es una persona que ya tiene muchísimos años de experiencia gente muchísimos años de experiencia hay dos tipos de full stack el full stack que estaba en la época cuando yo inicié que literalmente las páginas web eran cuadrados bien entonces la gente re verdad no era Front era backend y el Front eran cosas cuadradas feas pero funcionaban eso era un full stack el chavón sabía cómo hacer un backend Cómo hacer el código subirlo p que se visualice que toca el botoncito que le peg n y se terminó era más fácil era mucho más fácil ahora es muy difícil ser Esta persona es muy difícil ser esta persona en serio se esto es muy difícil es casi es muy imposible ser esta persona con dos años de experiencia por ejemplo Sí en serio les digo esto es imposible Entonces no eh recomendación no se sientan mal si no saben todo esto yo no sé mucho de estas cosas y me interesan Sí pero no necesito porque es mi especialización ahora Si yo fuera un sí un freelancer al menos voy a tener que poder hacer una aplicación y tirarse de estas cosas sí voy a tener que saber un poquito de todo esto voy a tener que saber por ejemplo vamos a tirar un stack no voy a tener que saber nextjs voy a tener que saber hacer testing con Cypress voy a tener que utilizar eh jest con testing library para la parte de Front de unit testing Perdón voy a tener que utilizar git actions que es lo más fácil para continuous integration por ahí ni siquiera hago continuous integration porque yo soy yo solo eh voy a usar un repositorio de git en el backend puedo directamente utilizar aws y me hago una aplicación sencilla con Dynamo eh con como hablamos o no con cognito para manejo de usuarios utilizo por ailandas para pegarle y y sacando o por ahí no por ahí no uso landas y utilizo así no más bien eh Rest y listo eh Y después me utilizo una base de datos con sql que puede ser sqlite ya está full stack Ah sos full stack no no sos full stack es una persona que sabe todo un poquitito bien Es es una persona que sabe de todo un poquitito porque gracias a esto no estás sacando muchas cosas de arquitectura bien hay 1 maneras de renderizar un componente ahora mismo 1000 formas de rendering que tenemos la hidratación que tenemos eh Por ejemplo lo que sería eh A ver spas que son las single p applications después tenemos las eh ssr las server rendering luego tenemos los server components luego tenemos los eh statis generation luego tenemos se entiende lo que digo y todas estas cosas son diferentes arquitecturas que son solamente en el frontend no estamos hablando del backend son solamente de cosas del frontend que son nuevas No eso es lo peor de todo son cosas viejas Sí porque lo que vimos el otro día de htmx junto con lo que sería htmx con un un backen sí que es literalmente un template enine eh yo el otro día hice un proyectito muy chiquitito con noes hice un servidor de Express utilicé pug como template enine y utilicé htmx para agarrar hacer peticiones esto que el otro pum y sacar una aplicación web andando buenísimo bien y con Ahora yo soy full stack no soy una persona que un servidor rep pedorro decir la verdad bien utilicé una librería que la leí así no más por arriba y funcionó la aprendí rapidísimo y hice fren no hice nada de fren Solamente utilicé htmx ya está que es otra librería para no usar justamente javascript para que lo haga por mí Soy full stack no me Hi una aplicación que tiene Front Back Sí pero no soy full stack solamente apliqué cosas en el backend por ejemplo y me olvidé de toda la parte del frontend entonces ojo y como les digo eso no es nuevo Esto es viejísimo lo que acabo de decir porque los template engines que ent hermosa de mi corazón Si nosotros por ejemplo vamos a uno de los más conocidos que es handlebar que esto es un tipo de arquitectura de una aplicación pero tranquilísimo que son justamente los componentes servidos del lado del eh del servidor miren quiero que vean esto eh vamos a agarrar y vamos a ir a ghub este es handlebars en github quiero agarrar y quiero ver Cuándo surge el primer Release vamos a ver si es que lo tienen por ahí ni siquiera lo tenían acá ojo Es más mira este es el primer Release que estoy viendo espera eh handle Bars y vamos a poner npm por npm lo podemos sacar mejor a ver las publish eh Hace 5 meses Mira la cantidad de dependencia 80 versiones tiene miren miren miren 12 años tiene esto 12 años gente se entiende 12 años no es nuevo esto son Solamente cosas modas que van viniendo surgiendo que se dan cuenta que hay la single p application son la mejor del mundo sí hacemos muchas más cosas y lógica de lado de los frend vamos el frend es c vez más complicado Wow dijeron los frontend Ahora somos programadores que antes no le querían decían Ah ustedes no son programadores son maquetadores nos decían Ahora somos unos desarrolladores impresionantes y después se viene con que ah no pero hacer single p application afecta al co porque tarda mucho porque tenemos un poquitito también de de como es cont shift que tenemos el tema esto de que tarda mucho la imagen que tarda mucho hacer la petición y que esto y que el otro y que server components Claro que sí hacemos server rendering y ahora que el servidor me de los componentes rapidísimo buenísimo metemos html de una y con eso el servidor ya sabe todo y los scrollers digo y los scrollers saben todo lo que hay en la aplicación Dale o sea todo cambia todo cambia va y viene y es así y son modas y son cosas que hay que aprender lo que yo les puedo decir es que cada cosa que uno aprenda mejora para otro lugar es así bien pero son modas si yo no sé tir el PC soy un mal desarrollador no sos una persona que no ha tenido la necesidad me entendés no tuviste la necesidad de tocarlo ya está Déjense de [ __ ] un poco o sea no es que por ejemplo no voy a conseguir trabajo si no toco trpc no no vas a tocar los trabajos que pidan trpc Por qué Porque ellos han tenido una problemática y la han solucionado con trpc es la única solución No no es la única solución usas Rest listo se terminó Entonces vas a ir a los trabajos que van con Rest ya está nada más bien no quiere decir que sea mal trabajador sino que sos una persona que realmente ahora no hubo la necesidad de que lo toques no tuviste la problemática de eh que se soluciona con esta tecnología se terminó pero entienden Por qué digo esto Esto está bueno como un pantallazo para saber todo lo lo que hay ahora mismo no Qué son las cosas que se están utilizando y cosas así cosas que se vienen coincido con todo lo que está acá realmente coincido con todo lo que está acá eh pero la verdad es esa o sea son es como un pantallazo de cositas para investigar para leer para ver si son buenas opciones para problemáticas y cosas que tengas dentro de tu trabajo y listo no es algo que tenés que estudiar todo esto est es la guía definitiva de estudios de todo lo que tenés que saber para el 2024 no no no de última estudiarlo a nivel de saber qué problemática soluciona en qué contexto se puede llegar a aplicar y con eso ves Si algún día de mañana te toca esta problemática ya sabes que esta es la solución que tenés me entendés y ahí te lo pones a estudiar a fondo ahora no así no más se entiende bien les gusta esta manera de pensar los calma un poco la verdad eh los cambia un poco un poquitito Mira yo laboraba con larabel ojo así hice larabel en su momento y el arabel bien eh Bueno quick obviamente solid js Sí la verdad que sí eh Son sí pero más o menos ahí eh Quería dar solamente est esta idea de este pantallazo está muy bien la verdad que está está muy bien toda esta guía está muy bueno Y sí yo creo que para web html c javascript ypt es la que va no hay otra no hay otra es un monopolio terriblemente después dat Ai python sí Pero saben Por qué python por la librería por la cantidad de librerías que tiene ahora mismo para esto es eso Data backend Java sí Java en el sentido de que literalmente es uno de los que más utiliza ahora no a nivel mundial pero la verdad la verdad es que python es como el segundo y javascript también puede ser uno bueno para daten pero fácilmente ojo con eso rust es el futuro de la II rust es el futuro de muchas cosas así no más te lo digo así no más bueno Go también Go está buenísimo tengo ganas dentro de muy poquitito de hacer algo con rust con Go también tengo muchas ganas de hacer algo con con con goang muchas ganas a día lo vamos a hacer quiero agarrar quiero aender No es que quiero aprender vamos a cambiar la cosa quiero aplicar mis conocimientos de backend con un lenguaje diferente de javascript para poder agarrar no y y y poder lidiar con otras cosas expandir un poquitito más los Horizontes eh algo que me propuse Les comento es lo siguiente dentro de poquitito como ahí ya lo sabrán eh voy a tener un hijo ahora ya nada el mes que viene voy a tener un hijo y una de las cosas que me dije es mira durante dos meses no voy a streamear Sorry con eso no voy a hacer Stream De nada quiero hacer full full baby bien y después de ahí voy a volver a hacer streaming y todo pero no voy a estar ocioso en esos dos meses quiero ponerme a aprender algo diferente y quiero ponerme a leer mucho bien quiero ponerme a leer mucho de aws quiero tratar de meterme por acá y Quiero meterme en Go también en Go o rust estoy viendo bien una cosa así me encantaría la verdad que me encantaría así que por ahí vien muchas cositas eh

Transcript for:Estudio de Tecnologías para Full Stack

Transcript for:
Estudio de Tecnologías para Full Stack