Pular para o conteúdo
Wails Blog

Seu Primeiro Aplicativo

Este guia mostra como criar seu primeiro aplicativo Wails v3, cobrindo a configuração do projeto, a compilação e o fluxo de trabalho de desenvolvimento.



  1. Criando um Novo Projeto

    Seção intitulada “Criando um Novo Projeto”

    Abra seu terminal e execute o seguinte comando para criar um novo projeto Wails:

    Terminal window
    wails3 init -n myfirstapp

    Este comando cria um novo diretório chamado myfirstapp com todos os arquivos necessários.

  2. Explorando a Estrutura do Projeto

    Seção intitulada “Explorando a Estrutura do Projeto”

    Navegue até o diretório myfirstapp. Você encontrará vários arquivos e pastas:

    • Directorybuild/ Contém arquivos usados pelo processo de compilação
      • appicon.png O ícone do aplicativo
      • config.yml Configuração de compilação
      • Taskfile.yml Tarefas de compilação
      • Directorydarwin/ Arquivos de compilação específicos para macOS
        • Info.dev.plist Configuração de desenvolvimento
        • Info.plist Configuração de produção
        • Taskfile.yml Tarefas de compilação para macOS
        • icons.icns Ícone do aplicativo para macOS
      • Directorylinux/ Arquivos de compilação específicos para Linux
        • Taskfile.yml Tarefas de compilação para Linux
        • Directoryappimage/ Empacotamento AppImage
          • build.sh Script de compilação do AppImage
        • Directorynfpm/ Empacotamento NFPM
          • nfpm.yaml Configuração do pacote
          • Directoryscripts/ Scripts de compilação
            • …
      • Directorywindows/ Arquivos de compilação específicos para Windows
        • Taskfile.yml Tarefas de compilação para Windows
        • icon.ico Ícone do aplicativo para Windows
        • info.json Metadados do aplicativo
        • wails.exe.manifest Arquivo de manifesto do Windows
        • Directorynsis/ Arquivos do instalador NSIS
          • project.nsi Arquivo do projeto NSIS
          • wails_tools.nsh Scripts auxiliares do NSIS
    • Directoryfrontend/ Arquivos do aplicativo frontend
      • index.html Arquivo HTML principal
      • main.js Arquivo JavaScript principal
      • package.json Configuração do pacote NPM
      • Directorypublic/ Ativos estáticos
        • …
      • Inter Font License.txt Licença da fonte
    • .gitignore Arquivo de ignorar do Git
    • README.md Documentação do projeto
    • Taskfile.yml Tarefas do projeto
    • go.mod Arquivo do módulo Go
    • go.sum Somas de verificação do módulo Go
    • greetservice.go Serviço de saudação
    • main.go Código principal do aplicativo

    Reserve um momento para explorar esses arquivos e se familiarizar com a estrutura.

  3. Compilando Seu Aplicativo

    Seção intitulada “Compilando Seu Aplicativo”

    Para compilar seu aplicativo, execute:

    Terminal window
    wails3 build

    Este comando compila uma versão de depuração do seu aplicativo e a salva em um novo diretório bin.

    Uma vez compilado, você pode executá-lo como faria com qualquer aplicativo normal:

    Terminal window
    ./bin/myfirstapp

    Você verá uma interface simples, o ponto de partida para o seu aplicativo. Como é a versão de depuração, você também verá logs na janela do console. Isso é útil para fins de depuração.

  4. Modo de Desenvolvimento

    Seção intitulada “Modo de Desenvolvimento”

    Também podemos executar o aplicativo no modo de desenvolvimento. Este modo permite que você faça alterações no seu código frontend e veja as alterações refletidas no aplicativo em execução sem precisar recompilar todo o aplicativo.

    1. Abra uma nova janela de terminal.
    2. Execute wails3 dev. O aplicativo será compilado e executado no modo de depuração.
    3. Abra frontend/index.html no editor de sua escolha.
    4. Edite o código e altere Please enter your name below para Please enter your name below!!!.
    5. Salve o arquivo.

    Essa alteração será refletida no seu aplicativo imediatamente.

    Quaisquer alterações no código do backend acionarão uma recompilação:

    1. Abra greetservice.go.
    2. Altere a linha que contém return "Hello " + name + "!" para return "Hello there " + name + "!".
    3. Salve o arquivo.

    O aplicativo será atualizado em questão de segundos.

  5. Empacotando Seu Aplicativo

    Seção intitulada “Empacotando Seu Aplicativo”

    Quando seu aplicativo estiver pronto para distribuição, você pode criar pacotes específicos para cada plataforma:

    Para criar um bundle .app:

    Terminal window
    wails3 package

    Isso criará uma compilação de produção e a empacotará em um bundle .app no diretório bin.

    Para informações mais detalhadas sobre opções de empacotamento e configuração, confira nosso Guia de Empacotamento.

  6. Configurando Controle de Versão e Nome do Módulo

    Seção intitulada “Configurando Controle de Versão e Nome do Módulo”

    Seu projeto é criado com o nome de módulo placeholder changeme. É recomendável atualizá-lo para corresponder à URL do seu repositório:

    1. Crie um novo repositório no GitHub (ou em seu serviço Git preferido)
    2. Inicialize o git no diretório do seu projeto:
      Terminal window
      git init
      git add .
      git commit -m "Initial commit"
    3. Defina seu repositório remoto (substitua pela URL do seu repositório):
      Terminal window
      git remote add origin https://github.com/username/myfirstapp.git
    4. Atualize o nome do módulo em go.mod para corresponder à URL do seu repositório:
      Terminal window
      go mod edit -module github.com/username/myfirstapp
    5. Envie seu código:
      Terminal window
      git push -u origin main

    Isso garante que o nome do seu módulo Go esteja alinhado com as convenções de nomenclagem de módulos do Go e facilita o compartilhamento do seu código.

Parabéns!

Seção intitulada “Parabéns!”

Você acabou de criar, desenvolver e empacotar seu primeiro aplicativo Wails. Este é apenas o início do que você pode realizar com o Wails v3.

Próximos Passos

Seção intitulada “Próximos Passos”

Se você é novo no Wails, recomendamos ler nossos Tutoriais a seguir, que serão um guia prático através das várias funcionalidades do Wails. O primeiro tutorial é Criando um Serviço.

Se você é um usuário mais avançado, confira nossos Guias para obter informações mais detalhadas sobre como usar o Wails.