Hospedar e editar sites no Windows gratuitamente usando o XAMPP

Você quer construir um site. A sobrecarga pode ser cara. E se você quer apenas aprender desenvolvimento web, sem confusão? Deixe-nos mostrar-lhe como hospedar um site local gratuitamente.

Você quer construir um site.  A sobrecarga pode ser cara.  E se você quer apenas aprender desenvolvimento web, sem confusão?  Deixe-nos mostrar-lhe como hospedar um site local gratuitamente.
Propaganda

Você quer construir um site 10 maneiras de criar um site pequeno e simples, sem o Overkill 10 maneiras de criar um site pequeno e simples, sem o Overkill WordPress pode ser um exagero. Como esses outros serviços excelentes provam, o WordPress não é o melhor e acaba com toda a criação de sites. Se você quer soluções mais simples, há uma variedade para escolher. Leia mais, mas não sabe por onde começar?

Parece que o típico campo de treinamento de desenvolvimento da Web também é o mais caro: compre um domínio, um servidor host, uma conta do WordPress, um tema etc. Mas e se você não for proprietário de uma pequena empresa ou estiver tentando construir uma marca? E se você está apenas tentando aprender desenvolvimento web, sem confusão?

Leia mais para aprender como hospedar seu próprio site Como usar um blog WordPress Self-Hosted para gerenciamento de projetos Como usar um blog WordPress Self-Hosted para gerenciamento de projetos Leia mais, que você pode criar a partir do zero ou com modelos pré-fabricados, no seu computador e de graça. Ah, isso inclui também hospedar sua própria conta do WordPress!

XAMPP: uma introdução

O XAMPP da Bitnami é “uma distribuição Apache contendo PHP e Perl”. Para nossos propósitos, só precisamos entender que o XAMPP é um programa simples e gratuito que permite aos usuários hospedar sites em seus PCs.

Embora a configuração de um servidor local usando o XAMPP seja um pouco técnica, o processo também é bastante fácil e direto. Depois que tudo tiver sido configurado, você descobrirá que gerenciar e editar sites é uma tarefa fácil.

Depois, há a questão do controle rápido e completo. Usando o XAMPP para criar e editar sites, você poderá alterar o máximo ou o tamanho de um site que desejar. Dito isto, com grande poder vem uma grande responsabilidade. Você é mais suscetível a perder seus sites também, especialmente se você não criar backups O mais recente Guia de Backup de Dados do Windows 10 O Último Guia de Backup de Dados do Windows 10 Resumimos todas as opções de backup, restauração, recuperação e reparo que pudemos encontrar Windows 10. Use nossas dicas simples e nunca mais se desespere com dados perdidos! Consulte Mais informação .

Se você quiser um projeto de curso inicial genuíno no web dev, no entanto, o XAMPP é para você. Isso inclui todos os projetos relacionados a HTML, CSS, Javascript e além!

Instalando o XAMPP

Vá ao site do XAMPP e baixe o pacote. Siga o processo de configuração padrão. Depois de baixar o XAMPP, o painel de controle do XAMPP deve abrir automaticamente. Caso contrário, você poderá localizar o programa XAMPP como faria com qualquer outro (por meio da pesquisa no Menu Iniciar).

Na janela do painel de controle do XAMPP, você deve ver um layout simples de quais processos do XAMPP estão sendo executados. Para nossos propósitos, nos concentraremos nas duas primeiras opções: Apache e MySQL.

Apache - O principal ponto crucial do XAMPP, a opção Apache cria um servidor Apache no seu PC. Isto é o que permitirá que você execute e edite sites no seu PC através de navegadores da web, muito parecido com um site. Exceto, é claro, que este site está sendo executado em seu PC, ao contrário de um servidor conectado à Internet.

MySQL - SQL permite a comunicação entre bancos de dados e sites, permitindo aos usuários testar e armazenar e-mails, senhas e quaisquer outras entradas de dados. Usaremos isso para sua conta local do WordPress.

Pressione o botão Iniciar no painel de controle do XAMPP em Ações para Apache e MySQL. Espere até que o Apache e o MySQL estejam destacados em verde na seção do seu módulo. Uma vez ativado, você está livre para usar o XAMPP.

painel de controle do xampp

Localhost e phpMyAdmin

Para garantir que tudo esteja funcionando corretamente, abra um navegador da web, insira http: // localhost / em sua barra de endereços e pressione Enter . Você deve ser redirecionado para http: // localhost / dashboard /, que é a página padrão do XAMPP.

página da web padrão do xampp

Em seguida, clique no botão phpMyAdmin no menu de navegação superior. Você será direcionado para sua página phpMyAdmin padrão.

phpmyadmin

Deixe isso em paz por enquanto, mas se os dois estiverem funcionando, você está pronto para começar a criar websites!

Criando sites usando o XAMPP

Agora vem a parte divertida. Vá para a pasta XAMPP localizada no diretório da unidade raiz ( C: \ xampp por padrão). Então, vá para o htdocs . Este será o repositório principal do site que você usará para visualizar sites.

Antes de criar e editar um site, você precisará de um editor de texto. Embora você possa usar um editor de texto padrão como o Bloco de notas, normalmente é melhor baixar um editor de terceiros criado especificamente para código e marcação 11 Dicas de texto sublime para produtividade e um fluxo de trabalho mais rápido 11 Dicas de texto sublime para produtividade e um fluxo de trabalho mais rápido um editor de texto versátil e um padrão ouro para muitos programadores. Nossas dicas concentram-se na codificação eficiente, mas os usuários em geral apreciarão os atalhos de teclado. Consulte Mais informação . O Sublime Text é um dos melhores do mercado, então vá ao site deles e faça o download do software para começar.

Agora você pode começar a baixar e instalar sites no XAMPP. Usarei o modelo Roadtrip, mas você poderá usar o modelo que desejar. Faça o download do arquivo zip do site e mantenha-o em um local que você se lembra. Em seguida, crie uma pasta na pasta htdocs do XAMPP para o seu site. Eu nomeei o meu roadtrip - tente manter o seu nome simples. Em seguida, descompacte e extraia o conteúdo do seu arquivo zip para esta pasta htdocs.

extrair para roadtrip

Depois de extrair os arquivos, acesse o repositório do website em htdocs para garantir que eles tenham sido extraídos corretamente.

Finalmente, vá para a sua página web no seu navegador web Os Melhores Navegadores da Web para Windows Os Melhores Navegadores da Web para Windows Qual é o seu navegador padrão? Apesar de sermos mimados pela escolha, a maioria de nós se apega aos grandes jogadores experimentados e testados. Quais são as melhores alternativas para uso de recursos, velocidade e segurança? Consulte Mais informação . Seu site, por assim dizer, será acessível usando o host local mencionado anteriormente, juntamente com o nome da pasta que contém os arquivos de sua página. Isso ocorre porque os sites são essencialmente arquivos contidos em pastas, tudo em um único domínio - ou nome-raiz. Você já está aprendendo!

Nossa pasta criada anteriormente foi denominada roadtrip, portanto, o endereço completo do site é http: // localhost / roadtrip .

modelo de roadtrip

Você está feito! Agora você pode começar a editar o site localmente.

Editando sites

Abra o Texto Sublime. Vá até Arquivo e selecione Abrir pasta . Encontre e selecione sua pasta da web na pasta XAMPP. Agora você poderá editar várias páginas do mesmo site no editor de texto Sublime.

texto sublime

O Sublime Text também fornece uma ótima interface para você ver todos os arquivos e pastas do seu site. Para criar alterações no seu site, edite o código do seu site, salve (usando o comando de teclado Ctrl + S ) e atualize seu site dentro do navegador.

O processo é simples e direto: edite a página da Web e verifique se seu código funciona. À medida que avança no desenvolvimento da sua web, você tentará introduzir recursos mais complicados em sua página da web. Não importa o nível de habilidade, no entanto, o formato básico para editar as páginas permanece o mesmo.

Use o WordPress com o XAMPP

Se você não quiser editar código bruto, ou preferir usar um sistema de gerenciamento de conteúdo (CMS) mais familiar, o WordPress fornece seu fantástico recurso de design da Web em um arquivo ZIP fácil de usar também! Para instalar o WordPress no XAMPP, acesse o site do WordPress e baixe o aplicativo oficial.

Use o mesmo formato para criar um site como você fez anteriormente, com sua pasta WordPress extraída presente no diretório htdoc dentro da pasta wordpress . Mantenha o nome da pasta por uma questão de clareza.

Usando o phpMyAdmin

Como o WordPress requer que você crie informações de login, você precisará criar uma entrada em seu diretório PHP para a página da web. Vá até a sua página do phpMyAdmin Configure seu blog com o Wordpress: o melhor guia Crie seu blog com o Wordpress: o melhor guia Quer começar seu próprio blog, mas não sabe por onde começar? Você deve realmente olhar para o Wordpress, a plataforma de blogs mais simples e poderosa disponível hoje. Leia Mais - http: // localhost / phpmyadmin / por padrão - para começar.

Nesta página, clique em Bancos de dados . Sob o parâmetro Criar banco de dados, digite wordpress e, em seguida, pressione Criar . Você deverá ver um pop-up informando que o banco de dados foi criado. Em seguida, feche esta janela do navegador e insira sua pasta WordPress no diretório XAMPP htdocs. Esta pasta deve possuir o conteúdo dos seus arquivos WordPress descompactados.

Configurando o Login

Precisamos configurar o site WordPress real para que você possa fazer login e usar o site. Isso é feito através do arquivo de configuração principal do WordPress. Em sua pasta do WordPress, localize o arquivo wp-config-sample.php, clique com o botão direito do mouse no arquivo, selecione Editar (ou Abrir com para um editor de texto separado). O bloco de notas deve funcionar bem.

Aqui está o código que vamos focar:

// ** MySQL settings - You can get this info from your web host ** // /** The name of the database for WordPress */ define('DB_NAME', ' database_name_here '); /** MySQL database username */ define('DB_USER', ' username_here '); /** MySQL database password */ define('DB_PASSWORD', ' password_here '); 

Você terá que fazer três alterações no código acima dentro das aspas.

database_name_here - Altere este parâmetro para wordpress . O site usará o banco de dados criado anteriormente no phpMyAdmin rotulado como tal.

username_here - Altere isso para root . O nome de usuário root possui os privilégios de administrador apropriados por padrão, portanto, ele será permitido pelo phpMyAdmin. Outros nomes de usuário não funcionarão a menos que sejam concedidas as permissões apropriadas.

password_here - Altere isso para uma senha facilmente identificável. Se preferir não usar uma senha, exclua o parâmetro.

Salve este arquivo como wp-config.php - ao contrário do wp-config-sample.php anterior - e saia. Em seguida, vá para o seguinte endereço de host local: http: // localhost / wordpress .

Prossiga com a instalação, incluindo a criação do seu nome de usuário e senha do WordPress. Você pode inserir os valores que preferir. Quando terminar de digitar seus valores, clique no botão Install WordPress para finalizar o processo. Uma vez feito isso, faça o login no seu WordPress local usando o nome de usuário e senha fornecidos na página anterior.

wordpress localhost

Você está feito! Agora, você pode gastar o conteúdo do seu coração editando, modificando e criando páginas da web tanto do zero quanto do WordPress, offline e de graça Os Melhores Plugins WordPress Os Melhores Plugins WordPress Leia Mais!

Desenvolvimento Web começa com uma única página

Antes, você estava começando sua jornada de desenvolvimento na web. Agora, você criou um servidor local no seu PC, através do qual você pode criar, modificar e adaptar páginas da web por capricho. O melhor de tudo, você está completamente no controle. A única coisa que resta é começar a sua experimentação, então continue!

Qual software você usa para desenvolvimento web? Você tem algum conselho para os desenvolvedores que estão chegando? Deixe-nos saber nos comentários abaixo!

Créditos da Imagem: Dmitry Tishchenko / Shutterstock

In this article