Este es un ejemplo práctico de como crear una Apliacion de Nextjs como Framework web fulsltack en conjunto con MySQL como sistema gestor de base de datos y TailwindCSS como Frameworks. Ademas tambien aprenderas como subir imagenes a la nube gracias a Cloudinary.
Requerimientos
Antes de empezar es recomendado que conozcas de forma básica las siguientes tecnologías:
- Nodejs
- MySQL
Docker
En mi caso voy a estar usando MySQL desde Docker. si tambien quieres hacerlo, puedes ejecutar el siguiente comando:
docker run --name mymysql -p 3306:3306 -e MYSQL_ROOT_PASSWORD=password -d mysql
Paquete de MySQL
Algo muy importante a considerar en Nodejs es con que driver de conexion a MySQL vamos a estar trabajando. Esto es importante porque algunso solo soportan callbacks, o tienen una comunidad más activa, etc. Para este ejemplo el paque que voy a estar usando sera uno adaptado a Nextjs, llamado serverless-mysql
*
- mysqljs, https://github.com/mysqljs/mysql
- mysql2 npm, https://www.npmjs.com/package/mysql2#first-query
- mysql docker, https://hub.docker.com/_/mysql
Error de Autenticación
Si al desarrollar este ejemplo tienes un error al conectarte a Mysql o ejecutar una consulta que se parece a lo siguiente:
Error: Error: ER_NOT_SUPPORTED_AUTH_MODE: Client does not support authentication protocol requested by server; consider upgrading MySQL client
Puedes ejecutar lo siguiente en tu consola de Mysql:
ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password';
Y luego:
flush privileges;
Si haciendo lo anterior no funciona intenta sin añadir el @'localhost', la consulta quedaria asi.
ALTER USER 'root'@ IDENTIFIED WITH mysql_native_password BY 'password';
Más Recursos
- tailwind, https://v1.tailwindcss.com/components/navigation
- tailwind, https://tailwindui.com/components/marketing/sections/heroes
- flowbite, https://flowbite.com/docs/components/card/
- nextjs rewrites, https://nextjs.org/docs/api-reference/next.config.js/rewrites