Codealo Commerce con NextJs

Este repositorio existe a la par del curso de ReactJs con NextJs de Codealo.

Aquí puedes encontrar la lista de contenido y los videos publicados.

Videos

Documentación de API

Documentación en Notion

Setup

Aquí dejamos las instrucciones para crear configurar la aplicación desde 0 utilizando tus conocimientos de la consola.

1. Crear proyecto de NextJs con TypeScript

npx create-next-app@latest --ts commerce

2. Copiar codigo a carpeta local y borrar carpeta de commerce

Linux / macOS

cp -a ./commerce/. ./
rm -r commerce

PowerShell

Get-ChildItem -Path ".\commerce\*" -Recurse | Move-Item -Destination ".\"
Remove-Item ".\commerce" -Recurse

Se debio de haber copiado el código de la carpeta commerce a la principal del proyecto.

3. Agregar TailwindCss

Puedes encontrar la guía aquí: https://tailwindcss.com/docs/guides/nextjs

yarn add -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

Editar tailwind.config.js a lo siguiente

module.exports = {
  content: [
    "./pages/**/*.{js,ts,jsx,tsx}",
    "./components/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

Agregar las directivas a ./styles/globals.css

@tailwind base;
@tailwind components;
@tailwind utilities;

4. Correr proyecto

yarn dev

Navega a http://localhost:3000

Debes de ser presentado con la aplicación base.

Ayuda

Si necesita ayuda o tienes algun comentario puedes enviar un email a johnnie@codealo.dev