> ## 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 com React

> Crie um projeto full-stack Base44 com backend Base44 e frontend React baseado em Vite

Siga este quickstart para fazer scaffold de um projeto, definir uma entidade e executar seu app localmente. Este projeto inclui um cliente SDK da Base44 pré-configurado, componentes de UI e estilização Tailwind CSS.

<Note>A CLI requer Node.js 20.19.0 ou superior.</Note>

## Configuração

<Steps>
  <Step title="Instale a CLI da Base44">
    Instale a CLI da Base44 globalmente:

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

  <Step title="Crie um projeto">
    Crie um novo projeto Base44:

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

    Se você ainda não estiver logado, o comando vai solicitar que você autentique.

    Selecione **Start from a template** quando solicitado, depois siga as instruções para configurar seu projeto, enviar entidades e implantar seu site.
  </Step>
</Steps>

Quando concluído, você verá o nome do seu projeto, um link para seu dashboard Base44 e a URL da sua aplicação ao vivo.

A estrutura do projeto gerado:

<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 mais informações sobre os arquivos neste projeto, veja [Estrutura do projeto](/developers/backend/overview/project-structure).

Este projeto inclui uma [entidade](/developers/references/entities/introduction) `Task` de exemplo em `base44/entities/task.jsonc` que foi enviada à Base44 durante a criação do projeto. Você pode modificar esta entidade ou criar outras.

## Próximos passos

Agora que o backend Base44 está integrado ao seu projeto, você pode:

* Usar o [SDK](/developers/references/sdk/getting-started/overview) para adicionar mais funcionalidade ao seu frontend.
* Adicionar [entidades](/developers/backend/resources/entities/overview), [funções de backend](/developers/backend/resources/functions) e [agentes](/developers/backend/resources/agents-config). Se está trabalhando em TypeScript, [gere tipos](/developers/references/sdk/getting-started/dynamic-types) para obter autocomplete e segurança de tipo.
* Testar localmente executando [`base44 dev`](/developers/references/cli/commands/dev) para o backend e `npm run dev` para o frontend. Veja [Desenvolvimento local](/developers/backend/overview/local-dev/local-development-overview) para instruções de configuração.
* Implantar atualizações com [`base44 deploy`](/developers/references/cli/commands/deploy).
* Abrir seu site implantado com [`base44 site open`](/developers/references/cli/commands/site-open).

Seu projeto inclui as [Base44 skills](/developers/backend/overview/base44-skills) que ensinam assistentes de codificação de IA a trabalhar com a Base44. Você pode abrir seu projeto no Cursor, Claude Code ou seu assistente de IA preferido e descrever o que quer construir.

## Veja também

* [Referência de comandos da CLI](/developers/references/cli/commands/introduction): Todos os comandos da CLI disponíveis
* [Estrutura do projeto](/developers/backend/overview/project-structure): Como os recursos do projeto são organizados
* [Entidades](/developers/references/entities/introduction): Saiba sobre configuração de schema do banco de dados
* [Apps de exemplo](https://github.com/base44/apps-examples): Projetos de exemplo para aprender

<Note>Esta página foi traduzida usando IA. Para informações mais precisas e atualizadas, consulte a [versão em inglês](/). </Note>