# Criando minha primeira DApp

Neste widget específico você poderá inserir suas coleções em destaque ou ativos à venda. Para facilitar a criação do seu primeiro DApp, dividimos todas as informações em etapas (tanto no assistente DexAppBuilder quanto nesta documentação).

Primeiro de tudo [acesse este link](https://dexappbuilder.dexkit.com/admin/create), que o levará ao backend onde você criará e gerenciará seus DApps. Agora é mais fácil implantar qualquer dApp disponível na plataforma.

{% hint style="info" %}
Lembre-se de que você está interagindo com um produto Beta, portanto ele pode apresentar comportamentos inesperados. Se encontrar algum, por favor nos informe em [nosso servidor Discord](https://discord.com/invite/GJCRu4CYFH).
{% endhint %}

**Você está dentro? 🤓** Agora conecte sua carteira clicando no botão localizado no canto superior esquerdo. Você pode usar Metamask ou qualquer outra carteira Web3.

<figure><img src="/files/856eae9dfb6fb7f7f225642c7277bdd7ce06045c" alt="" width="382"><figcaption><p>Todas as suas carteiras conectadas serão exibidas aqui, inclusive as hardware wallets.</p></figcaption></figure>

## Primeiros passos

### Seção de configurações

1. **Nome do seu DApp (ou nome de domínio):** Seja criativo, ou apenas siga o caminho da sua marca. **Importante!** **Considere que este é o único recurso que não pode ser alterado depois de implantado** porque uma vez em produção essa opção não pode ser editada. Pense bem sobre isso.

{% hint style="info" %}
Certifique-se de que o nome do domínio esteja em letras minúsculas e sem caracteres especiais.
{% endhint %}

1. **E-mail do DApp:** Este e-mail não será publicado e é o método de contato que usaremos para enviar (com seu consentimento) nossa Newsletter e, se você for usuário Premium, você também receberá sua fatura nele. Você precisará confirmar este e-mail assim que criar o DApp.

<figure><img src="/files/c7867696717349f9669f76987f3169e65854a992" alt=""><figcaption><p>Depois de preencher o nome de domínio e seu e-mail, clique em «Create App»</p></figcaption></figure>

Após preencher essas duas linhas, clique no botão azul «CREATE APP», assine digitalmente na sua carteira. Você receberá uma mensagem pop-up que precisará da sua autorização.

{% hint style="info" %}
As assinaturas digitais na plataforma DexKit são seguras e gratuitas, então você pode usar qualquer carteira, mesmo sem fundos.
{% endhint %}

Se tudo correr bem você verá o modal a seguir:

<figure><img src="/files/d02b6e665991c9ce696c3d4b0c8b2baca5da9e08" alt=""><figcaption><p>Agora clique em «View App» para visitar o backend.</p></figcaption></figure>

#### Geral

<figure><img src="/files/3dbbbc19e41d2a1a5a52ff1061809d68b5cdfdeb" alt=""><figcaption></figcaption></figure>

1. **Logos.** PNG ou SVG 150x150px (imagem quadrada) é recomendado. Clicar na imagem «DexAppBuilder by DexKit» abrirá um menu de upload. Nós hospedaremos suas imagens para você.
2. **Tamanhos de logo para mobile e desktop.**
3. **URL do favicon.** PNG ou SVG 20x20px recomendado. Clique no ícone roxo do Kittygotchi e faça o upload da sua imagem.
4. **Idiomas**: Inglês (EUA) como idioma padrão, Português, Espanhol, Alemão, Francês, Italiano, Norueguês e Tcheco.
5. **Moedas**: Dólar americano, Euro, Real brasileiro, Rupia indiana, Coroa tcheca, Peso argentino, Franco suíço, Peso chileno, Bolívar venezuelano e Naira nigeriana.

#### Domínio

Nós hospedaremos seu DApp [usando um serviço centralizado e confiável](https://vercel.com/). Também estamos incluindo uma URL personalizada para seu DApp com `*.dexkit.app` sufixo, assim você não precisará comprar nenhum domínio, nem hospedagem para implantá-lo.&#x20;

Ao mesmo tempo, **manteremos a seção de domínio personalizado,** para que você possa usar um subdomínio de um dos seus domínios e chamar seu DApp por lá.

<figure><img src="/files/513991528809ef8e9983f9e0142ffd988f4f7d3d" alt=""><figcaption></figcaption></figure>

Temos um tutorial [aqui](https://docs.dexkit.com/defi-products/use-cases/for-entrepreneurs/custom-dswap#creating-your-cname-alias) sobre adicionar uma entrada CNAME no [CloudFlare](https://www.cloudflare.com/). Também fizemos um [vídeo no YouTube](https://www.youtube.com/watch?v=pvzGTxcebW4) realizando o procedimento.

{% hint style="warning" %}
Quando você estiver adicionando seu CNAME seguindo 'cname.vercel-dns.com' no seu provedor de hospedagem, você também precisa adicionar um registro do tipo A, com '@' como Nome e '76.76.21.21' para evitar problemas com redirecionamento.
{% endhint %}

Se você não estiver usando esse recurso opcional, pode deixar o campo em branco e seguir em frente.

#### Social

<figure><img src="/files/55ca43ced3fa8d421e2d1d71a0383a3b39ceec8d" alt=""><figcaption></figcaption></figure>

Adicione links personalizados clicando no botão «+Add custom».&#x20;

### Seção de layout

#### Tema

<figure><img src="/files/f61bd683965802b843d87986deab5bd94bf11817" alt=""><figcaption></figcaption></figure>

Escolha entre as combinações de cores atualmente disponíveis ou simplesmente escolha suas cores personalizadas para alinhar com as diretrizes da sua marca. **Escolha também entre mais de 500** [**Google fonts**](https://fonts.google.com/) **para deixá-lo com ótima aparência**.

<figure><img src="/files/d715eb9353803fbef0e3e3a2753153ebbcdb7f04" alt=""><figcaption></figcaption></figure>

Depois de preencher esta seção com suas cores, pressione o botão azul «SAVE» no canto inferior direito da página. Assine digitalmente e continue.

#### Páginas

Talvez esta seja a seção mais importante e interessante do seu DApp, pois aqui você pode deixar sua imaginação correr solta para organizar os elementos disponíveis em seu benefício.

Vamos revisar os principais elementos que compõem esta seção:

<figure><img src="/files/e2a5ff00b7eb65e5c6f8bdbd28022b4f6819de4a" alt=""><figcaption></figcaption></figure>

Dentro desta seção você pode colocar as páginas do seu DApp e clicar em cada uma permitirá que você insira seções pré-construídas padrão (clicando no botão + ADD SECTION) ou adicionar uma personalizada clicando abaixo no botão «+ ADD CUSTOM SECTION». Leia mais sobre as seções padrão e como usar cada componente.

<figure><img src="/files/3b64c0c5e9f341cc4d6a06190b3e4bf10a4c9279" alt=""><figcaption></figcaption></figure>

#### Uso de tooltip

<div align="center"><figure><img src="/files/11119f65f59ad565c688e4255e4591e948e5b2af" alt=""><figcaption><p> Ocultar no mobile</p></figcaption></figure> <figure><img src="/files/2fe5ff32c2da0135d06b8d782176e942b3db994f" alt=""><figcaption><p>Ocultar no desktop</p></figcaption></figure> <figure><img src="/files/1ed9c9a80c7097df8484a3f773b4c29013f4138c" alt=""><figcaption><p>    Clonar seção</p></figcaption></figure> <figure><img src="/files/fb8277026fc0be577a836fb8c0ab00be5307f3ec" alt=""><figcaption><p>Pré-visualizar seção</p></figcaption></figure> <figure><img src="/files/6cf951b2ecd952b973ba3d8da5a9ee8d26a0f37c" alt=""><figcaption><p>    Editar seção  </p></figcaption></figure> <figure><img src="/files/12056a48d3839542e735c08cbb24a55bf94f69d4" alt=""><figcaption><p>  Excluir seção</p></figcaption></figure> <figure><img src="/files/dcf9f2272021ee469dc5b694dc7a6f87d449e0a8" alt=""><figcaption><p>Mover seção para cima</p></figcaption></figure></div>

<figure><img src="/files/0d0c0949ba8f25b0ef20b8a88e4b3e7dc4db1575" alt=""><figcaption><p>Você pode arrastar e soltar componentes para organizá-los em cada página.</p></figcaption></figure>

Crie as páginas que você precisará para seu DApp. Considere que a única página que terá componentes pré-construídos é a Home. Cada vez que você criar uma, ela começará sem componentes.

{% hint style="info" %}
Você sabia que pode publicar qualquer NFT que quiser lá para vender? 👀 <mark style="color:verde;">**você não precisa ser o proprietário**</mark>**.** Basta usar os detalhes do NFT e, se você conseguir uma venda pelo seu DApp, as taxas serão suas 🥳
{% endhint %}

#### Páginas personalizadas

Nesta seção os usuários podem adicionar muitas opções interessantes que não apenas ajudam seu DApp a ter ótima aparência, mas também a ser útil e funcional para seus visitantes.

<figure><img src="/files/5a756e17d46f661e3efb7a4c17bd5d7ca5d1ca49" alt=""><figcaption><p>Seja criativo! Agora você tem mais ferramentas para isso! 👨‍🎨🖼👩‍🎨</p></figcaption></figure>

Você se divertiu nesta seção? 😁 Agora salve seu progresso no habitual botão azul na parte inferior da página, assine digitalmente e vamos para a próxima parte.

#### **Menu da Navbar**

Consulte [Configurando a barra de navegação](/produtos-e-solucoes-defi-pt/dexappbuilder/gerenciando-esta-ferramenta/configurando-a-barra-de-navegacao.md) para uma explicação detalhada.

<figure><img src="/files/2e9e6cc6057c1e6fe72d2104406feb3785ae94ac" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
**Você pode notar que nem sempre será solicitada a assinatura digital** se não clicar em salvar e apenas pular entre as seções. **Recomendamos salvar progressivamente** para evitar perder seu progresso, por isso pedimos sempre que assine após fazer alterações.
{% endhint %}

#### **Menu do rodapé**

<figure><img src="/files/bf4a865b93390e58b339891295802a69671ebf67" alt=""><figcaption></figcaption></figure>

Adicione quantos links e menus quiser no rodapé do seu DApp.

#### Configurando páginas de SEO

<figure><img src="/files/cc347a56dec79b389c908080984f1ebc2c0028f9" alt=""><figcaption></figcaption></figure>

Esta seção permitirá que seu DApp seja indexado pelos motores de busca mais populares. Preencha ambos os campos e faça upload da imagem de compartilhamento que será vista quando você compartilhar o link do seu DApp usando o protocolo OpenGraph. Como sempre, recomendamos «SAVE» e prosseguir.

### Seção de taxas

#### Taxas do marketplace de NFTs

<figure><img src="/files/d409059e96dbc4d0d4b9459514dee74b4ae13a67" alt=""><figcaption><p>Esta é uma seção importante do seu marketplace de NFTs</p></figcaption></figure>

Nesta seção você poderá definir uma taxa para cada NFT negociado no seu DApp. **Recomendamos aqui não ser ganancioso e usar percentuais mais baixos** (de 1% até 5%) para tornar suas ofertas atraentes. Depois de terminar aqui, clique em «SAVE» e prossiga para a outra seção de taxas, desta vez para a interface de swap.

#### Taxas de swap

<figure><img src="/files/89264ddeee6da027552f72b7336ac790ae11a29c" alt=""><figcaption></figcaption></figure>

Aqui você definirá as taxas que deseja receber das operações de negociação dos seus clientes. **Como esta será uma das funcionalidades mais usadas no seu DApp, tente usar percentuais baixos** aqui se não quiser assustar seus clientes 🏃‍♀️🏃‍♂️💨💨

### Seção de dados

#### **Importando coleções**

<figure><img src="/files/39cd2cbbab5c1838e73c019b3682a9ab0d40e2a2" alt=""><figcaption></figcaption></figure>

Aqui você colocará todas as coleções que você tem disponíveis levando em conta que **você pode escolher várias redes ao mesmo tempo para cada uma delas**. Por exemplo, você pode adicionar a coleção dos nossos adoráveis gatinhos Kittygotchi NFT (no Ethereum, Polygon ou Binance Chain) e, por sua vez, você poderá adicionar suas coleções de NFT em outras redes que suportamos com [liquidez descentralizada 0x](https://www.0x.org/).

{% hint style="info" %}
Importar suas coleções de NFT permitirá que você use todos os componentes predefinidos que oferecemos para NFTs.
{% endhint %}

Siga o exemplo abaixo para adicionar suas coleções de NFT corretamente:

1. Clique no botão "+ Add Collection"

<figure><img src="/files/db1131e19060aeb1f38547c2f7fa95e2f11d620d" alt="" width="563"><figcaption></figcaption></figure>

2. Preencha todos os campos em branco da coleção de NFT que você está prestes a importar. Neste caso você precisará fazer tudo manualmente. Simplesmente não funciona como os tokens ERC20 😥 mas... vamos lá! Seu DApp será o G.O.A.T 🐐

<figure><img src="/files/51f978e6c72a28e5d6a232999a49c9da5e19cba0" alt="" width="389"><figcaption><p>Estamos usando a coleção de NFT mais popular no momento.</p></figcaption></figure>

3. Você pode desabilitar vendas secundárias para impedir que essa coleção seja vendida em qualquer lugar que não seja seu DApp.
4. Quando terminar aqui, clique no botão azul "Save".

#### Tokens

<figure><img src="/files/1134b661a1e713c6b363476915c0f16b082efbec" alt=""><figcaption></figcaption></figure>

**Escolha os pares que você quer que sejam negociados no seu DApp**. Na lista você encontrará os pares mais solicitados pelas pessoas, levando em conta seus volumes de mercado, mas se você pressionar o *adicionar* botão (dentro do retângulo laranja), você também pode adicionar qualquer token personalizado. Clicar no botão de *importar* à direita habilitará listas de tokens populares no seu DApp. Sinta-se à vontade para escolhê-las também.

<figure><img src="/files/72bc61ae5fe057fb757a078038099c6c38f5ce61" alt="" width="285"><figcaption></figcaption></figure>

Precisa de mais informações? vá para a [Importando tokens](/produtos-e-solucoes-defi-pt/dexappbuilder/gerenciando-esta-ferramenta/importando-tokens.md) seção.

#### **Redes**

Nesta seção você pode escolher as redes disponíveis no seu DApp. Esta função é muito útil ao criar produtos voltados para uma rede específica, como o lançamento de um token ERC20 ou uma coleção de NFTs.

<figure><img src="/files/fe8b8c0180dd8511c30148ef6f3d5da2f352e908" alt="" width="563"><figcaption><p>Clique em «Edit», escolha aquelas que você vai remover e então salve.</p></figcaption></figure>

## Finalizando

**Se você terminou de preencher todo o conteúdo, parabéns!** 😻 lembre-se de *salvar* novamente e clique aqui para voltar à seção admin 👇

Continue lendo [Gerenci](/produtos-e-solucoes-defi-pt/dexappbuilder/gerenciando-esta-ferramenta.md)[ando esta ferramenta](/produtos-e-solucoes-defi-pt/dexappbuilder/gerenciando-esta-ferramenta.md) e aprenda como navegar na área administrativa.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.dexkit.com/produtos-e-solucoes-defi-pt/dexappbuilder/criando-minha-primeira-dapp.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.