Como configurar um retro em 2023 (IIS) (Nitro HTML5) - [ Parte 1 ]

Olá pessoal, venho compartilhar com vocês esse tutorial feito por Objeto
já vi em várias ocasiões que algumas pessoas desejam fazer seu próprio retrô, mas têm dificuldade para fazê-lo! É por isso que decidi reservar um tempo e escrever uma série de três partes que cobre tudo de A a Z, usando tecnologias modernas e atualizadas no ano de 2022.

Usaremos o Windows IIS para configurar seu novo Habbo retro - A razão para escolher o IIS é que ele é muito mais fácil de usar do que, por exemplo, um servidor Linux e acredito que a maioria das pessoas que procuram uma série como esta se sentem mais confortáveis ​​usando o Windows e tendo uma GUI, em vez de um terminal simples

Spoiler: O que iremos abordar na série

• Configuração do Internet Information Services (IIS) Configuração do
• MariaDB Configuração
• do PHP 8.2 Instalação
• do Composer v2
• Configuração do GIT Configuração do
• Cloudflare Configuração
• do Atom CMS Configuração
• do Atom HK Configuração
• do Arcturus Emulator 3.5.2 Instalação
• do Volta (suporte à versão de vários nós) Instalação
• Instalação do Java
• Configuração do Nitro v2 (versão dev) -
• Configuração mais recente do Nitro Converter em julho de 2023

Spoiler: Requisitos

Um Windows VPS - Se você atualmente não tem um Windows VPS, você pode comprar um, por exemplo, Contabo ,

Contabo é um host VPS barato, que é uma ótima opção para seu primeiro retro.

No entanto, você pode usar qualquer host que desejar, não precisa ser Contabo, o importante é que seu VPS tenha Windows.

Você também precisará de um domínio para você e seus usuários visitarem - eu pessoalmente recomendo https://www.namecheap.com/

Chega de introdução! Vamos começar

Spoiler: Instalação do IIS

O primeiro passo da nossa jornada é instalar e configurar o IIS e para isso, comece abrindo o aplicativo "Server Manager", caso ainda não esteja aberto.
Clique no botão "Adicionar regras e recursos" - Um pop-up deverá aparecer mostrando uma introdução "Antes de começar". Clique em "pular esta página por padrão", a menos que queira receber esta introdução sempre que abri-la

Clique em "próximo" e certifique-se de que "Instalação baseada em função ou baseada em recursos" esteja alternada e clique em "próximo" duas vezes (isso deve levar você à seção "Funções de servidor"
Na seção "Funções do servidor", role para baixo até encontrar "Servidor Web (IIS)" e verifique-o (um pop-up deve aparecer, dentro deste pop-up clique em "Adicionar recursos". Quando terminar, clique em "Avançar" 3 vezes. Isso deve pousar você em "Serviços de função" na seção "Função de servidor Web (IIS)

Role para baixo até encontrar "Segurança" e verifique as "Restrições de IP e Romain"
Abra a categoria "Desenvolvimento de Aplicativos" (deve estar logo abaixo de "Segurança") e marque "CGI", uma vez marcado, clique em "Avançar" e "Instalar"Passo dois:
Instale a extensão PHP Manager - Baixar
Instalar extensão de reescrita de URL - Baixar[

Depois que as etapas acima forem seguidas, você poderá inserir o IP do servidor no navegador e ver a tela de instalação do IIS. Que ficaria assim:

​Adicione o tipo MIME .nitro:

Spoiler: Adicione o nitro mime

Para nos permitir conectar ao nosso cliente, mais tarde, devemos informar ao IIS para permitir os tipos de arquivo ".nitro", caso contrário, o IIS não saberá como lidar com eles, resultando na impossibilidade de nos conectarmos ao cliente.

Para adicionar o tipo MIME ".nitro", basta abrir nosso aplicativo "Internet Information Services", expandir a seção logo abaixo da "Página inicial" e clicar duas vezes no módulo "Tipos MIME":

Depois de clicar duas vezes no módulo "Tipos MIME", você poderá clicar em "Adicionar..." no canto superior direito. quando "Adicionar..." for clicado, um novo pop-up deverá aparecer solicitando uma "Extensão de nome de arquivo:" e um "Tipo MIME:".

No campo "Extensão de nome de arquivo:" adicione " .nitro " e dentro do campo "Tipo MIME:" adicione: " application/octet-stream " e clique em "OK".

Aqui está um GIF sobre como fazer isso: https://gyazo.com/7d1f529ac5685b598673bcee8d43205f

Spoiler: Preparando-se para instalação de CMS e HK

Requisitos:

Qualquer editor de texto/IDE de sua escolha – Minha recomendação pessoal é Visual Studio Code
Git - Download do Git - Clique no botão Baixar para Windows
PHP 8.2 ou superior (Este guia usará PHP 8.2) - Download do PHP - Selecione o "VS16 x64 Non Thread Safe" (deve ser o primeiro - Como formato .zip)
Composer v2 - Download do Composer - Selecione o " Composer-Setup.exe "
Instale um editor de sua escolha:
Como mencionado antes, cabe a você escolher qual editor de texto/IDE deseja instalar e usar, o mais importante é usar algo com o qual você se sinta confortável. Minha recomendação, entretanto, é o Visual Studio Code, que você pode baixar aqui . Depois de baixado, basta seguir o processo de configuração, clicando em Avançar até terminar.

Instale o GIT:

Você terá que instalar o GIT, pois além de ser uma ferramenta incrível, também será necessário para nós mais tarde.
Para instalar o GIT basta baixá-lo aqui e seguir o processo de instalação, clicando em próximo até finalizar.

Configuração do PHP 8.2:

Neste tutorial, usaremos o PHP 8.2, que é a versão mais recente do PHP em dezembro de 2022.

Para configurar o PHP 8.2 você simplesmente terá que baixá-lo aqui e selecionar "VS16 x64 Non Thread Safe " (que deveria ser o primeiro).

Uma vez baixado, navegue até
Código:
C:\Program Files
e crie uma nova pasta chamada "PHP".
Depois que a pasta PHP for criada, basta copiar todos os arquivos PHP baixados para sua nova pasta “PHP”.

Registre sua versão do PHP
Para ter certeza de que o IIS usará sua versão do PHP recém-baixada, abra o aplicativo "Internet Information Services", clique na seção logo abaixo de "Página inicial", encontre o módulo gerenciador de PHP e clique duas vezes nele.

Depois de abrir o Gerenciador de PHP, clique em "Registrar nova versão do PHP". Ao clicar, um pop-up deverá aparecer, solicitando que você forneça o caminho para a versão do PHP. Clique nos 3 pontos ao lado do campo de entrada e navegue até C:\Arquivos de Programas\PHP e selecione "php-cgi.exe" e clique em "abrir". O caminho para “php-cgi.exe” agora deve ser definido e clique em “OK”.
Se tudo deu certo, você deverá ver sua versão do PHP, etc., tudo na guia do gerenciador de PHP

Instale os redistribuíveis necessários:

O PHP exige que você baixe alguns redistribuíveis, você realmente não precisa se preocupar com isso. Basta baixá-los aqui e seguir o processo de configuração, aceitando os termos e clicando em Avançar até finalizar.

Configuração do Composer:

É hora de configurar o Composer. O Composer é, a curto prazo, uma ferramenta de gerenciamento de pacotes, que precisaremos mais tarde para instalar os pacotes Composer necessários para Atom CMS e Atom HK. Clique aqui para baixar o Composer e selecione " Composer-Setup.exe ".

Após o download do Composer, abra o aplicativo "Composer-setup" que você acabou de baixar e selecione "Instalar para todos os usuários (recomendado)".

Em seguida, você será solicitado a "Opções de instalação", deixe como está e clique em "Avançar". Depois de clicar em "Avançar", você deverá ver a "Verificação de configurações", que um pouco mais abaixo deverá ter seu php.exe listado automaticamente para você. Se o caminho parecer correto marque "Adicionar este PHP ao seu caminho" e clique em "Avançar".

Se por algum motivo o caminho do PHP selecionado automaticamente não estiver correto, basta clicar em "Procurar..." e navegar até "C:\Arquivos de Programas\PHP" e selecionar "php.exe", depois clicar em "Abrir" e certificar-se a opção "Adicionar este PHP ao seu caminho" está marcada e clique em "Avançar".

Depois de clicar em "Avançar" você verá uma tela de "Configurações de proxy", deixe tudo como está e clique em "Avançar" e "Instalar" - Assim que o Composer terminar sua instalação clique em "Avançar" e depois em "Concluir" .

O Composer agora está totalmente instalado e pronto para uso!

Spoiler: configuração do MariaDB

Importante: Você não deve instalar o MariaDB superior à versão 10.x, caso contrário seu emulador não conectará.

Para começar, com a instalação do MariaDB basta baixar o MariaDB aqui

Em seguida, abra o arquivo de instalação que acabou de baixar e clique em "próximo" até chegar à parte onde você deve definir uma senha para o usuário root. Preencha uma senha segura, que você anotou em algum lugar seguro. É importante que você não perca esta senha, pois ela será a senha de acesso ao seu banco de dados. Depois de preencher os campos de senha, vá em frente e marque "Usar UTF8 como conjunto de caracteres padrão do servidor" - Deve ser parecido com a imagem abaixo:

Clique em “Avançar” e deixe tudo com as predefinições padrão até clicar em “Instalar”, depois clicar em “instalar” e aguardar a conclusão da instalação. Assim que a instalação terminar clique em “Concluir”.

Viva! Seu servidor de banco de dados agora foi configurado e estará pronto para uso

Spoiler: Clonar Atom CMS

Começaremos clonando o Atom CMS, simplesmente para facilitar o processo de adição imediata dos ativos do cliente às pastas corretas. Na etapa 2 deste guia, passaremos pelo processo de conectar o Atom CMS ao IIS, tornando-o acessível ao mundo exterior.

Clone Atom CMS:

Agora teremos que clonar o repositório Atom CMS e para isso você terá que abrir seu aplicativo CMD (prompt de comando) e digitar o seguinte:

cd C:/inetpub/wwwroot

pressione "enter" e escreva:

git clone https://github.com/ObjectRetros/atomcms.git

e pressione enter mais uma vez. O Atom CMS será então clonado em seu C:/inetpub/wwwroot em uma pasta chamada "atomcms"

Spoiler: Baixe os ativos do hotel

Para que nosso hotel funcione mais adiante, precisaremos colocar as mãos nos ativos necessários para o funcionamento do hotel.

Para fazer exatamente isso, abra o Prompt de Comando (CMD) e digite

cd C:/inetpub/wwwroot/atomcms/public && git clone https://github.com/ObjectRetros/2023-hotel-files client

Isso vai demorar um pouco, então seja paciente.

Assim que a clonagem for concluída, você poderá prosseguir para a etapa de "instalação do gerenciador de banco de dados".

Spoiler: Instalação do gerenciador de banco de dados

Para gerenciar nosso banco de dados, precisaremos de um gerenciador de banco de dados. Nesta série, instalaremos o DBeaver, que é um gerenciador gratuito, mas poderoso.

MariaDB instala automaticamente o HeidiSQL, mas como usaremos o DBeaver, você pode desinstalar o HeidiSQL, se desejar.

O primeiro passo será instalar o próprio DBeaver, que você pode baixar aqui , e selecionar “ Windows 64 bits (instalador) ” .

Após o download do DBeaver, siga o processo de configuração, simplesmente clicando em “Avançar” até clicar em “Instalar”, pois não é necessário selecionar ou alterar nada.

Abra o DBeaver e clique em “Não” na janela pop-up perguntando se você deseja criar um banco de dados de amostra.

Selecione “MariaDB” na lista de servidores de banco de dados e clique em “Avançar”.




Credenciais do banco de dados:
É hora de se conectar ao nosso servidor de banco de dados e para isso você terá que preencher as credenciais necessárias, que serão as seguintes:
Host do servidor: localhost
Porta: 3306
Banco de dados: Deixe este campo vazio
Nome de usuário: root
Senha : A senha que você definiu ao instalar o MariaDB

Depois que as credenciais forem definidas, clique em “Testar Conexão” que solicitará que você baixe os drivers necessários, que você pode instalar simplesmente pressionando “Download”.

Se as credenciais preenchidas estiverem corretas, o DBeaver mostrará uma mensagem de sucesso semelhante à imagem abaixo.




Basta clicar em "OK"

Criar um novo banco de dados:

Clique duas vezes na conexão "localhost" exibida no lado esquerdo do DBeaver e a seguir clique com o botão direito na pasta "Bancos de dados" e selecione "Criar novo banco de dados" que mostrará um pop-up solicitando um nome de banco de dados.





Preencha o nome do banco de dados de sua escolha (no meu caso usarei apenas "hotel" como nome) e clique em "OK" - O Charset & Collation não precisa ser alterado de sua predefinição padrão.




Importe seu banco de dados e catálogo Arcturus Morningstar:
Comece abrindo seu aplicativo DBeaver (se ainda não estiver aberto), clique com o botão direito no banco de dados recém-criado e passe o mouse sobre "Ferramentas" e selecione "Restaurar banco de dados". imagem abaixo:




Depois que "Restaurar banco de dados" for selecionado, clique na pasta laranja ao lado do campo "Arquivo de entrada:" e navegue até a pasta C:/inetpub/wwwroot/atomcms/public e selecione " arcturus-3-5-2-database .sql "arquivo. Depois que o arquivo .SQL for selecionado, clique em “Iniciar”. A importação do banco de dados será então iniciada. Assim que terminar com sucesso, um pop-up parecido com a imagem abaixo deverá aparecer:




Clique em “OK” e feche as janelas pop-up.

Agora repita o processo, mas em vez de selecionar "arcturus-3-5-2-database.sql" você seleciona "2023-catalog.sql" - Isso importará um catálogo atualizado e bem organizado.

Se você se sentir um pouco confuso e não souber exatamente o que fazer, tudo bem. Aqui está um gif meu fazendo isso - Como este tutorial foi atualizado, há apenas dois arquivos .sql em vez de vários, então tudo que você precisa fazer é importar os dois arquivos .sql mencionados acima: Como criar e importar o banco de dados

uma vez você importou com sucesso o banco de dados Arcturus e os arquivos de catálogo atualizados, clique duas vezes em seu banco de dados para mostrar todas as tabelas recém-importadas.

Agora você criou e importou com sucesso um banco de dados para Arcturus Morningstar, que, mais tarde, conectaremos ao Atom CMS e Atom HK ao configurá-lo.

Spoiler: Configuração do Cloudflare

Para adicionar alguma proteção básica ao nosso hotel, adicionaremos o Cloudflare.
A Cloudflare facilita a configuração do DNS e a adição de regras de página, além de adicionar uma camada decente de proteção ao nosso hotel, pois fará proxy automaticamente do IP do seu servidor (oculte o IP do seu servidor para que, se as pessoas estiverem tentando encontrá-lo, eles obterão o IP da Cloudflare) uma vez configurado, ele também fará o possível para mitigar ataques DDoS para você.

Não vou abordar como você pode configurar um hotel sem domínio ou sem Cloudflare. Se não quiser usar o Cloudflare para configurar seu hotel, você terá que descobrir como configurar um hotel sozinho.

Configuração do Cloudflare:

A primeira coisa que você precisa para configurar o Cloudflare é um domínio. Você pode comprar um domínio de vários provedores de domínio diferentes, como - Minha recomendação é Namecheap .

Depois de obter um domínio, acesse Cloudflare.com e faça login ou crie uma nova conta.

Depois de fazer login ou criar sua nova conta, clique na conta na seção “Contas” e depois clique em “Adicionar um site” (o botão azul à direita).

Agora você será direcionado para uma página onde poderá inserir seu nome de domínio. Depois de inserir seu nome de domínio, clique em "Adicionar site".

Assim que seu site for adicionado, Cloudflare solicitará que você selecione um plano. Role até a parte inferior e clique no plano gratuito e depois em "Continuar".

Cloudflare irá verificar e revisar seus registros DNS, uma vez feito isso, uma lista completa de seus registros será mostrada. Exclua todos os registros, exceto o registro "A" e o registro "CNAME" na parte superior - Para excluir um registro, clique em "Editar" e depois em "Excluir".

Depois que todos os registros forem excluídos, edite o endereço IP anexado ao registro A para que contenha o seu IP VPS.
O registro CNAME deve ser alterado para que o campo de conteúdo corresponda ao seu nome de domínio.

Deve ser parecido com esta captura de tela (com seu domínio e IP VPS)




Feito o procedimento acima, clique em “Continuar”.

A Cloudflare o levará a uma página explicando o que você deve fazer com seus servidores de nomes.

Depois de substituir seus servidores de nomes, clique em "Concluído, verifique os servidores de nomes"

* Pode levar até 24 horas para que as alterações nos servidores de nomes entrem em vigor. No entanto, na maioria dos casos, não demorará muito até que as alterações sejam processadas.

A próxima etapa será a Cloudflare mostrando um "Guia de início rápido"

Clique em "Começar" e permita as seguintes
reescritas automáticas de HTTPS - Ativado
Sempre use HTTPS - Ativado
Minificar automaticamente CSS e HTML
Brotli - Ativado

Depois que seus servidores de nomes forem alterados e registrou seu Cloudflare deve ficar assim




É isso! fácil, certo? Seu Cloudflare foi configurado e você está pronto para configurar o Atom CMS e o Atom HK

Vá para a parte 2 da série e aprenda como configurar o Atom CMS!