Introducción a Next.js

Fecha: 12/23/2020 - Autor: Sebastian GomezNext.jsJavascriptNodeJSDesarrollo Web

¿Qué es Next.js

Primero, hablemos sobre React. Me gusta pensar en React como una librería que se encarga unicamente de la parte de la vista de nuestras aplicaciones. Solamente con con React tu no podrías construir rápidamente una aplicación completa. Tu necesitas un enrutador, un sistema de compilado, una manera de estilizar tus componentes y claro preocuparte por el la velocidad y el performance de tu sitio entre muchas otras cosas ... 😰.

Next.js es un framework full-stact completo que fue creado por el equipo de Vercel. React es usado como la librería de la vista, entonces si tu sabes React, aprender Next.js será super familiar para ti. Cuando construimos una aplicación desde cero con React, tu tienes muchas decisiones que tomar y muchas elecciones posibles. Next.js ya viene con esas decisiones tomadas es lo que se llama un framework "opinionado" es decir con un stack y un conjunto de librerías ya definidas. En teoría este es el toque secreto que estas decisiones ya vienen hechas basadas en la experiencia del equipo de Vercel de construir aplicaciones en producción con React.

Estas son algunas de las características que vienen listas cuando usas Next.js

¿Qué pasa entonces con "Create React App"?

Tal como Next.js, create-react-app (CRA) es la herramienta por defecto que usamos muchos desarrolladores para crear nuestras aplicaciones con React, y si no te has dado cuenta ya viene con un montón de librerías y de decisiones ya tomadas. Es más un starter o template para crear la aplicación más rápido pero aún así te quedan faltando cosas como routing, SSR y facilidad de construcción de tu API entro otras cosas.

Y ¿Gastby?

Gastby es muy similar a Next.js. Gastby también viene con convenciones y herramientas(librerías) también disponibles y útiles para crear una aplicación estática con React fácil y rápido. Sin embargo Gastby no es un framework full-stack y no puedes hacer cosas del lado del Backend como crear tu API Rest o server side rendering. Pero cuidado gastby si tiene increibles carácterísticas como soporte a GraphQL, optimización de imágenes y otras cosas que Next.js no tiene.

Entonces, ¿Cuando usar Next.js?

Esta es mi guía general sobre con qué herramienta construir tu aplicación de React.

¿Necesitas construir una Single Page Applition (SPA)?

Usa create-react-app (CRA)

¿Necesitas construir un sitio web estático como un blog que sea también una SPA?

Usa Next.js o Gastby

¿Necesitas usar SSR, tener una API y una SPA?

Usa Next.js

Eso es todo, espero que este post te sea de utilidad y lo puedas aplicar a algún proyecto que tengas en mente y que simplemente te haya ayudado a entender la naturaleza de Next.js.

Te dejo el enlace al siguiente post sobre Next.js, Comenzando con Next.js

Déjame un comentario si te sirvió o si quieres añadir alguna opinión o si tienes alguna duda no dudes en dejarme un comentario en la parte de abajo, recuerda que si te gustó también puedes compartir usando los links a las redes sociales en la parte de abajo.