Sí. Ya sé. Les prometí una serie llena de emoción, peligro, código escalable… ¿y qué obtuvieron a cambio? Decepción. Les decepcioné. ¡Pero he vuelto!
Previously on… Programando una webap
Bue. Habíamos definido hacer todo web y usar la arquitectura básica de un front y un back.
Entonces, en este capítulo voy a elegir un stack. Un stack es el conjunto de lenguajes y herramientas que voy a usar en el proyecto. Algo así como la lista de ingredientes.
Esto va a definir, sin dudas, mis limitaciones y mis ventajas. Hay lenguajes que tienen ciertas características que los hacen mejores para ciertas situaciones. Pero ahora sería medio difícil de explicar. Por eso, simplemente les voy a decir qué stack elegí y por qué.
Para empezar vamos a ir al fondo de la cuestión. Y cuando me refiero al fondo, me refiero al back del back, o sea a la base de datos. Porque si en un extremo está el front del front, es decir, básicamente HTML y CSS que define lo que estoy viendo en el navegador, atrás de eso está el código Javascript que corre en el navegador para que eso funcione, y detrás de ese Javascript, habría un framework seguramente, para que esto de manejar lo que sucede en la pantalla no sea un dolor de espalda.
Detrás de todo eso está el navegador, luego un servidor que le devuelve el código al navegador, y, finalmente, detrás hay un servicio que corre en un servidor web y que está escrito en cierto lenguaje. Y ese servicio guarda todo lo que pasa, tu mail, tu contraseña, tus datos, los datos de los centros educativos, en fin… una base de datos.
Y ustedes dirán: sí sí, entiendo, una base de datos, pero ¿qué es? Bueno, para hacerlo corto el código manipula datos, pero esos datos en algún momento tienen que ser guardados. Los programas corren en el ámbito de la memoria RAM, y esta se vacía cuando la máquina se apaga, se reinicia, etc.
Por eso, para que el programa recupere la data que necesita, la tiene que guardar y leer de una base de datos. Si quieren que ahonde más en el tema, me dejan un comentario. En este caso voy a usar Firebase porque va a ser lo más fácil para mostrarles. Otras bases de datos necesitan más explicaciones.
Para manipular esos datos, o sea, para escribir mi backend, voy a usar Node.js. ¿Por qué? Porque es mi lenguaje principal, es donde voy a poder ser rápido y escribir buen código. En otra ocasión quizás elija otro lenguaje como Go, que es una tecnología que todavía no usé desde cero para armar una app.
Ese código de mi backend lo voy a alojar y a correr, o sea, le voy a dar la responsabilidad de ejecutar ese backend y mantenerlo vivo, en Vercel. Simplemente voy a decir que Vercel es lo mejor que existe. Y en otro capítulo ahondar en el porqué.
Ese backend va a ser una pequeña API REST. Que quiere decir que voy a usar HTTP para llevar y traer data del front al back. Y para cada cosa que manipule voy a tener una URL.
Por ejemplo: todo lo que tenga que ver con los usuarios de mi web app va a vivir en una dirección, tipo http://myapi.com/api/users, y voy a usar verbos HTTP para decirle a esta URL si lo que quiero es crear un usuario, modificar o borrar uno, o lo que sea. Lo vamos a ver en detalle más adelante.
Para mi front, voy a usar React sobre Next.js. Esto también es porque Next es lo mejor, por comodidad y porque quiero avanzar rápido en esta webapp, les debo muchos capítulos. Pero seguramente en próximas temporadas utilizaré Vue o Svelte.
Voy a usar React y, para consumir la data de mi API, usaré este hermoso hook llamado SWR (otra joya creada por Vercel).
Además, voy a usar Material UI para mi user interface, así puedo avanzar rápidamente para luego poder escalar esto en algo más propio, ya que Material es muy copado para ser customizado. O sea, modificado para que luzca como tu onda.
Para alojar mi front hecho en React sobre Next voy a usar Vercel también y ya van a ver por qué es tan buena opción.
Sobre la arquitectura de mi back y mi front ahondaré mientras avance.
Y ya en el próximo cap vamos a empezar a ver código de nuestro back.
Así que amigas amigos eso es todo por el momento. Y ya saben, si les gustó, si les sirvió o si simplemente son lo más, denle like al video, suscríbanse al canal y compartan.
Prometo ritmo y sustancia en esta serie.
¡Nos vemos!