El conocimiento es el nuevo dinero.
Aprender es la nueva manera en la que inviertes
Acceso Cursos

Cursor para el backend, código Claude para el frontend - He aquí por qué funciona

· 5 min de lectura
Cursor para el backend, código Claude para el frontend - He aquí por qué funciona

Recomiendo usar Cursor y Claude Code juntos.

Sobre todo si necesitas desarrollar una serie de funciones en un corto período de tiempo.

Creo que este enfoque tiene varias ventajas y al final hablaré de mi nuevo truco para gestionar los costes en Cursor.

Paso 1: Planificación

Cursor

Cuando inicio un proyecto, recibo los diferentes documentos de planificación elaborados por o3.

Aquí tenéis un ejemplo.

Prompt:
“Based on the feature below, propose a full implementation plan using best 
practices in Next.js.

Feature: [insert description]

Your plan should include:

- The main components, modules, or APIs to be created or modified
- The recommended folder and file structure
- Key architectural decisions (e.g. routing, data fetching strategy, 
state management)
- Any third-party libraries or tools to be used and why
- How to validate that the implementation works correctly 
(tests, checks, or manual steps)

Explain each decision with a brief rationale. Avoid overengineering.”

Código de Claude

Al mismo tiempo, le pido a Claude Code que explore diferentes enfoques para resolver el problema.

“I’m building a [brief description of your feature/project].

Give me 5 different ways to implement this in Next.js, covering different 
strategies, libraries, or architectural patterns.

For each, include:

A short name for the approach

- The core idea or principle
- The pros and cons
- When this approach makes the most sense

Highlight any pitfalls to avoid if I choose that option.

Normalmente, para lo anterior, me interesa encontrar nuevos paquetes.

Paso 2 — Divide y vencerás

Los documentos del paso 1 son fundamentales como contexto.

Luego le pido a Claude Code que elabore un plan de divide y vencerás.

"I’m building a feature in Next.js:
[insert short feature description]

I want to divide the implementation into two non-overlapping tracks:

Cursor will handle one part (e.g. backend logic, schema, API routes, 
database config)

Claude Code will handle another (e.g. frontend components, layout, 
UI logic, UX flow)

Your job is to:

- Analyse the feature and identify all the major tasks involved
- Split those tasks into two logical and separate sets — one for 
Cursor, one for Claude Code

For each set, describe:

- What should be built
- Which files or folders it will touch
- Any dependencies or assumptions it needs from the other set
- Clear boundaries to avoid overlap

Any coordination points (e.g. agreed schema, shared API contract)

Optimise the division so both sides can work in parallel without blocking 
or conflicting."

Este plan básicamente asigna una lógica y un plan de coordinación, así como puntos de control.

Como puedes ver, utilizo Cursor para lo siguiente

  • lógica de backend
  • Esquema
  • Rutas de API
  • Configuración de la base de datos

¿Por qué será? Sinceramente, odio el enfoque de backend de Claude Code; es lento y engorroso, y no se acerca ni de lejos a la velocidad de Cursor para ejecutar comandos como pnpm push y build sin fallar.

La experiencia general con su terminal no es tan buena. No tienen funciones de tiempo de espera.pasar a segundo planod, y un montón de excelentes características que mejoran la calidad de vida que tiene Cursor.

Además, prefiero que estos cambios arquitectónicos aparezcan en Cursor junto con el historial del chat, para poder verlos.

Mientras Cursor trabaja en eso, le pido a Claude Code que trabaje en esto.

Los componentes globales del front-end. Ahora dedico mucho más tiempo a configurar los componentes globales del proyecto para asegurarme de que la IA no reinvente la rueda en cada página nueva.

¿Cómo se ve eso?

He estado experimentando con estas indicaciones sobre los límites del diseño.

Me gusta asegurarme de que tenga todos estos componentes limpios y luego suelo probarlos en una serie de nuevas páginas de prueba.

A veces, incluso si estas páginas no están conectadas, no hay problema.

Por otro lado, el cursor tiene esto

Para que quede claro, de los dos puntos anteriores, lo que más me interesa en primer lugar es Cursor, el esquema del backend y su funcionamiento. Esa es la parte importante que hay que configurar correctamente.

Luego le pido a Claude Code que se revise a sí mismo.

Una vez que Cursor haya terminado con el backend, le pediré a Claude Code que haga una revisión de lo que ha creado.

Cursor has completed the backend for this feature, and I (Claude Code) have now implemented the frontend components. Please perform a comprehensive review.

## Review Checklist

1. **API Integration**
   - Review the API contract and schema from Cursor
   - Confirm the frontend is using the data correctly

2. **Frontend Code Quality**
   - Flag any structural issues
   - Note any naming inconsistencies
   - Identify inefficient or redundant code
   - Check for logic that could break with edge cases

3. **Architecture and Coupling**
   - Identify any unclear or tight coupling between frontend and backend

4. **Improvements**
   - Suggest changes for:
     - Maintainability
     - Performance
     - Accessibility

5. **Best Practices**
   - Confirm adherence to Next.js and React conventions

6. **Scalability Risks**
   - Flag anything that might cause problems at scale (more users, more data)

Me gusta bastante esta separación de responsabilidades, ya que establece un control para verificar que las cosas no se descontrolen.

Tras la revisión, suelo recibir una lista de tareas pendientes como esta.

En resumen, el flujo se ve así.

Puede que esto parezca una exageración, pero esta es la razón por la que lo hago.

El tiempo es dinero

Trabajo en una agencia de software. Cuanto más eficiente sea con mi tiempo, más dinero ganaré. Por lo tanto, tener varias tareas en paralelo me beneficia directamente.

Me gusta que cada parte haga algo diferente.

No sé si eso dice algo sobre mi forma de pensar, pero me gusta tener un lugar para la lógica del backend y otro para la lógica del frontend.

He comprado el Cursor a precios muy bajos.

Al lograr que Cursor se centre únicamente en el trabajo de backend, he conseguido reducir los costes considerablemente hasta los 60 dólares mensuales.

Así que ahora mi coste total es de 100 dólares al mes por el plan Claude Code + 60 dólares por el plan Cursor.

La clave ha estado en estas indicaciones más largas y en definir claramente para qué estoy usando el cursor.

Si te ciñes a un rol de backend bien definido, podrás usar el producto intensivamente sin disparar los costes.

No me gusta Claude Code ni la terminal

Como ya comenté, creo que Cursor gestiona mejor varios aspectos al ejecutar comandos bash y pnpm. Si bien Claude Code también puede hacerlo, necesito que sea rápido.

Cuando este proceso vale la pena

He empezado a utilizar este proceso en la mayoría de los proyectos. Hay mucho margen de optimización en la frontera del diseño entre ambos.

Creo que merece la pena si tienes una idea clara de lo que estás construyendo y puedes deducir mucho sobre cómo se desarrollará el producto a partir de los archivos Markdown.

También diría que merece la pena si ya dominas prácticamente cualquier problema con IA. Puede que necesites practicar un poco, pero básicamente estoy contento de avanzar más rápido, ya que ahora me siento más cómodo solucionando y detectando fallos.

Gracias por leer Código en Casa.