Creando aplicaciones de Next.js y publicándolas en Vercel usando mono repositorios con Yarn Workspaces

Arquitectura de la plataforma

Arquitectura propuesta para la plataforma: Proyecto para el administrador y los clientes.

Uso de mono repositorios

Esquema del proyecto haciendo uso de multi repositorios

Yarn

$ npm install --global yarn
$ yarn --version
$ mkdir ecommerce
$ cd ecommerce
$ yarn init
question name (testdir): ecommerce
question version (1.0.0):
question description: The most awesome eccomerce
question entry point (index.js):
question git repository:
question author: John Doe
question license (MIT):
question private:
success Saved package.json
✨ Done in 87.70s.
{
"name": "ecommerce",
"version": "1.0.0",
"description": "The most awesome eccomerce",
"main": "index.js",
"author": "John Doe",
"license": "MIT"
}
{
"name": "ecommerce",
"version": "1.0.0",
"description": "The most awesome eccomerce",
"main": "index.js",
"author": "John Doe",
"license": "MIT",
"private":true,
"workspaces":["ecommerce-admin", "ecommerce-client"]
}

Creando las aplicaciones de Next.js

$ yarn create next-app
Directorio después de la creación de la aplicación ecommerce-admin
$ cd ecommerce-admin$ yarn dev
Pantalla de bienvenida de la aplicación de Next.js
Elimina lo que se indica en la flecha
$ yarn create next-app
Directorio de la aplicación ecommerce-client
Pantalla de bienvenida de la aplicación ecommerce-client de Next.js
Elimina lo que se indica en la flecha que son archivos git

Creando repositorio Git

$ git init
/node_modules
/node_modules# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.# Ecommerce-admin dependencies/ecommerce-admin/node_modules
/ecommerce-admin/.pnp
/ecommerce-admin/.pnp.js
# testing
/ecommerce-admin/coverage
# next.js
/ecommerce-admin/.next/
/ecommerce-admin/out/
# production
/ecommerce-admin/build
# misc
/ecommerce-admin/.DS_Store
/ecommerce-admin/*.pem
# debug
/ecommerce-admin/npm-debug.log*
/ecommerce-admin/yarn-debug.log*
/ecommerce-admin/yarn-error.log*
# local env files
/ecommerce-admin/.env.local
/ecommerce-admin/.env.development.local
/ecommerce-admin/.env.test.local
/ecommerce-admin/.env.production.local
# vercel
/ecommerce-admin/.vercel
# Ecommerce-client dependencies/ecommerce-client/node_modules
/ecommerce-client/.pnp
/ecommerce-client/.pnp.js
# testing
/ecommerce-client/coverage
# next.js
/ecommerce-client/.next/
/ecommerce-client/out/
# production
/ecommerce-client/build
# misc
/ecommerce-client/.DS_Store
/ecommerce-client/*.pem
# debug
/ecommerce-client/npm-debug.log*
/ecommerce-client/yarn-debug.log*
/ecommerce-client/yarn-error.log*
# local env files
/ecommerce-client/.env.local
/ecommerce-client/.env.development.local
/ecommerce-client/.env.test.local
/ecommerce-client/.env.production.local
# vercel
/ecommerce-client/.vercel
$ git add .
$ git commit -m ":rocket: Init my monorepo"

Publicando en Vercel

Seleccionando el directorio de la aplicación a publicar
git diff --quiet HEAD^ HEAD ./
Ignorando el build en un proyecto cuando se agregaron cambios a otro

Conclusiones

--

--

I’m honduran, software engineer and mathematics student at UNAH. Soccer and movies enthusiast.

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Fabricio Murillo

Fabricio Murillo

I’m honduran, software engineer and mathematics student at UNAH. Soccer and movies enthusiast.