> ## Documentation Index
> Fetch the complete documentation index at: https://docs.base44.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Quickstart de React

> Crea un proyecto full-stack de Base44 con un backend de Base44 y un frontend React impulsado por Vite

Sigue este quickstart para crear el esqueleto de un proyecto, definir una entidad y ejecutar tu app localmente. Este proyecto incluye un cliente SDK de Base44 preconfigurado, componentes de UI y estilos con Tailwind CSS.

<Note>El CLI requiere Node.js 20.19.0 o superior.</Note>

## Configuración

<Steps>
  <Step title="Instala el CLI de Base44">
    Instala el CLI de Base44 globalmente:

    ```bash theme={null}
    npm install -g base44@latest
    ```
  </Step>

  <Step title="Crea un proyecto">
    Crea un nuevo proyecto de Base44:

    ```bash theme={null}
    base44 create
    ```

    Si aún no has iniciado sesión, el comando te pedirá que te autentiques.

    Selecciona **Start from a template** cuando se te indique y luego sigue las indicaciones para configurar tu proyecto, enviar las entidades y desplegar tu sitio.
  </Step>
</Steps>

Cuando se complete, verás el nombre de tu proyecto, un enlace a tu panel de Base44 y la URL de tu aplicación en producción.

La estructura del proyecto generado:

<Tree>
  <Tree.Folder name="<your-project-name>" defaultOpen>
    <Tree.Folder name="base44" defaultOpen>
      <Tree.File name=".app.jsonc" />

      <Tree.File name="config.jsonc" />

      <Tree.Folder name="entities" defaultOpen>
        <Tree.File name="task.jsonc" />
      </Tree.Folder>
    </Tree.Folder>

    <Tree.Folder name="src" defaultOpen>
      <Tree.Folder name="api">
        <Tree.File name="base44Client.js" />
      </Tree.Folder>

      <Tree.Folder name="components">
        <Tree.Folder name="ui" />

        <Tree.File name="Base44Logo.jsx" />
      </Tree.Folder>

      <Tree.File name="App.jsx" />

      <Tree.File name="main.jsx" />

      <Tree.File name="index.css" />
    </Tree.Folder>

    <Tree.File name=".gitignore" />

    <Tree.File name=".nvmrc" />

    <Tree.File name="components.json" />

    <Tree.File name="index.html" />

    <Tree.File name="jsconfig.json" />

    <Tree.File name="package.json" />

    <Tree.File name="postcss.config.js" />

    <Tree.File name="README.md" />

    <Tree.File name="tailwind.config.js" />

    <Tree.File name="vite.config.js" />
  </Tree.Folder>
</Tree>

Para más información sobre los archivos de este proyecto, consulta [Estructura del proyecto](/developers/backend/overview/project-structure).

Este proyecto incluye una [entidad](/developers/references/entities/introduction) `Task` de ejemplo en `base44/entities/task.jsonc` que se envió a Base44 durante la creación del proyecto. Puedes modificar esta entidad o crear más.

## Siguientes pasos

Ahora que tu backend de Base44 está integrado con tu proyecto, puedes:

* Usar el [SDK](/developers/references/sdk/getting-started/overview) para añadir más funcionalidad a tu frontend.
* Añadir [entidades](/developers/backend/resources/entities/overview), [funciones de backend](/developers/backend/resources/functions) y [agentes](/developers/backend/resources/agents-config). Si trabajas en TypeScript, [genera tipos](/developers/references/sdk/getting-started/dynamic-types) para obtener autocompletado y seguridad de tipos.
* Probar localmente ejecutando [`base44 dev`](/developers/references/cli/commands/dev) para el backend y `npm run dev` para el frontend. Consulta [Desarrollo local](/developers/backend/overview/local-dev/local-development-overview) para las instrucciones de configuración.
* Desplegar actualizaciones con [`base44 deploy`](/developers/references/cli/commands/deploy).
* Abrir tu sitio desplegado con [`base44 site open`](/developers/references/cli/commands/site-open).

Tu proyecto incluye [skills de Base44](/developers/backend/overview/base44-skills) que enseñan a los asistentes de IA para programación cómo trabajar con Base44. Puedes abrir tu proyecto en Cursor, Claude Code o tu asistente de IA preferido y describir lo que quieres crear.

## Ver también

* [Referencia de comandos del CLI](/developers/references/cli/commands/introduction): Todos los comandos del CLI disponibles
* [Estructura del proyecto](/developers/backend/overview/project-structure): Cómo se organizan los recursos del proyecto
* [Entidades](/developers/references/entities/introduction): Aprende sobre la configuración de esquemas de base de datos
* [Apps de ejemplo](https://github.com/base44/apps-examples): Proyectos de muestra para aprender

<Note>Esta página se tradujo con IA. Para información más precisa y actualizada, consulta la [versión en inglés](/). </Note>
