🚀 Cómo Desplegar un Proyecto de Next.js con Prisma y PostgreSQL en Railway (Paso a Paso)

Railway es una plataforma que te permite desplegar aplicaciones modernas de forma muy sencilla, y en este tutorial aprenderás a desplegar un proyecto de Next.js que utiliza Prisma como ORM y PostgreSQL como base de datos.


📦 Paso 1: Crear tu Proyecto con Next.js y TypeScript

Primero, necesitas tener instalado Node.js y npm. Luego crea tu proyecto:

npx create-next-app@latest mi-proyecto-prisma --ts
cd mi-proyecto-prisma

Esto te creará una estructura de proyecto lista para usar con TypeScript.


📚 Paso 2: Instalar y Configurar Prisma

Instala Prisma y el cliente de Prisma:

npm install prisma --save-dev
npm install @prisma/client

Inicializa Prisma en tu proyecto:

npx prisma init

Esto generará dos cosas importantes:

  • Una carpeta prisma/ con el archivo schema.prisma.
  • Un archivo .env con una variable llamada DATABASE_URL que usaremos más adelante.

🛢️ Paso 3: Crear tu Base de Datos en Railway

  1. Ve a https://railway.app y crea una cuenta o inicia sesión.
  2. Crea un nuevo proyecto y selecciona la opción "Provision PostgreSQL".
  3. Una vez creado, haz clic en "Connect" y copia la cadena de conexión. Se verá algo como esto:
postgresql://usuario:contraseña@host:puerto/nombrebd
  1. Pega esa URL en tu archivo .env, reemplazando el valor de DATABASE_URL:
DATABASE_URL="postgresql://usuario:contraseña@host:puerto/nombrebd"

🧱 Paso 4: Definir tu Esquema Prisma

Edita prisma/schema.prisma con tus modelos. Por ejemplo:

datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

generator client {
  provider = "prisma-client-js"
}

model User {
  id    Int     @id @default(autoincrement())
  email String  @unique
  name  String?
  posts Post[]
}

model Post {
  id        Int     @id @default(autoincrement())
  title     String
  content   String?
  published Boolean @default(false)
  author   User    @relation(fields: [authorId], references: [id])
  authorId Int
}

Este esquema define un modelo User y Post con relaciones entre sí.


📥 Paso 5: Crear la Base de Datos y el Cliente Prisma

  1. Ejecuta la migración inicial:
npx prisma migrate dev --name init

Esto creará las tablas en tu base de datos (usando DATABASE_URL) y generará el cliente de Prisma.

  1. Genera manualmente el cliente cuando lo necesites con:
npx prisma generate

🔌 Paso 6: Crear un Archivo para Reutilizar Prisma

Crea lib/prisma.ts para evitar instancias duplicadas del cliente:

import { PrismaClient } from '@prisma/client';

const globalForPrisma = global as unknown as { prisma: PrismaClient };

export const prisma =
  globalForPrisma.prisma ||
  new PrismaClient({
    log: ['query'],
  });

if (process.env.NODE_ENV !== 'production') globalForPrisma.prisma = prisma;

Luego importa prisma desde ahí en tus páginas o API routes.


🌐 Paso 7: Probar una Consulta (SSR o API)

Ejemplo en pages/index.tsx:

import { GetServerSideProps } from 'next';
import { prisma } from '../lib/prisma';

export const getServerSideProps: GetServerSideProps = async () => {
  const posts = await prisma.post.findMany({
    where: { published: true },
    include: { author: true },
  });

  return { props: { posts } };
};

export default function Home({ posts }) {
  return (
    <div>
      <h1>Posts publicados</h1>
      {posts.map((post) => (
        <div key={post.id}>
          <h2>{post.title}</h2>
          <p>Autor: {post.author.name}</p>
        </div>
      ))}
    </div>
  );
}

🚀 Paso 8: Preparar para Desplegar en Railway

a) Instala Railway CLI (opcional pero útil):

npm install -g railway

b) Inicia sesión y vincula el proyecto:

railway login
railway init

Selecciona tu proyecto existente con la base de datos que creaste.

c) Ejecuta las migraciones en Railway:

railway run npx prisma migrate deploy

Esto aplicará las migraciones en la base de datos remota.


📤 Paso 9: Desplegar la App

Railway puede desplegar el proyecto automáticamente desde GitHub:

  1. Conecta tu repositorio GitHub al proyecto en Railway.
  2. Railway detectará que es una app de Node.js/Next.js y usará npm run build && npm start por defecto.
  3. Asegúrate de tener en package.json:
"scripts": {
  "dev": "next dev",
  "build": "next build",
  "start": "next start"
}

También asegúrate de que la variable DATABASE_URL esté presente como Environment Variable en el panel de Railway.


🔍 Paso 10: Verificar Producción

Cuando el despliegue esté completo:

  1. Ve al dominio que Railway te asignó (https://mi-proyecto.up.railway.app)
  2. Verifica que tu app esté funcionando correctamente.
  3. Puedes ir agregando funcionalidades como rutas de API, panel de admin, etc.

📝 Extras

npx prisma studio

✅ Conclusión

Desplegar una app moderna con Next.js, Prisma y PostgreSQL nunca ha sido tan fácil gracias a Railway. Esta plataforma te permite evitar configuraciones complejas y enfocarte en escribir código.

Si ya tienes tu app Next.js lista, con este flujo puedes tenerla funcionando en la nube en menos de 30 minutos.


¿Quieres que prepare una versión de este tutorial como video o PDF? ¿O te gustaría que agregue autenticación con NextAuth? Escríbeme. 😄