[Dúvida] Onde devo hospedar uma simples landing page?
Boa tarde Tabnews!
A pergunta parece ser simples a princípio, não é segredo como fazer uma hospedagem, eu penso assim quando estou fazendo algo para mim. Mas quando é para terceiros começo a ter alguns receios.
Estou fazendo um site de portfolio para minha irmã que é fotógrafa e por comodidade fiz o projeto em Next.js, a princípio é uma página estática muito simples que eu poderia hospedar gratuitamente na Vercel e comprando um dominio .br, mas me pego pensando, será que o fato de ter muitas imagens(fotografias), mesmo utilizando a otimização do Image do Next.js não gastaria muita banda ou processamento de imagens do Vercel?
Esse site, no final, possui um form de "entre em contato" para a pessoa preencher uma mensagem que deve cair por e-mail para ela. Pensei em fazer isso com um simples nodemailer, aproveitando que o projeto é em Next.js mesmo.
Porém um site tão simples, poderia ser feito com react puro, ainda utilizando tailwind, e o restante, mas servindo o arquivo html e js de forma estática, perdendo a necessidade de hospedar um serviço node e indo pra plataformas de hospedagem muito baratas como hostinger por exemplo, nesse caso eu precisaria utilizar outra forma de enviar o e-mail, o que não deve ser difícil.
Fazer esse portfólio pra ela me despertou o interesse em fazer mais portfólios para mais pessoas, por serem landing pages simples e tranquilas de fazer. Mas então ficam as perguntas no ar.
- Devo utilizar Next.js ou React puro, levando em consideração servir isso como um processo node ou como arquivos estáticos.
- Devo hospedar na Vercel, Hostinger, ou outro lugar? O que sai mais em conta e atende ao objetivo?
- Vocês tem mais considerações a fazer, algo que deixei escapar despercebido ou melhorias, idéias?
Por fim, vou deixar a página aqui para vocês poderem ver como está ficando (eu ia deixar um link mas como não sei durante quanto tempo vou manter esse link de pé, vou deixar apenas uma imagem e optei por rabiscar os rostos das pessoas visto que as mesmas não concordaram em ter suas imagens usadas no Tabnews). Muito obrigado a todos que se propuserem a ajudar!
Esse site é simples, deve ser criado como página estática, independente do que você vai usar.
Pra hospedar deixa tudo na Cloudflare, é grátis. Usa o Pages para o site, o formulário de contato você faz como serviço no Workers e no futuro se precisar você pode integrar o R2 (Object Storage) para as imagens, é barato. Já aproveita e usa o Proxy Reverso e CDN gratuito deles.
Curiosamente eu acabei de fazer a mesma coisa para um amigo meu, no site https://floretmentor.com/
Ele eu ainda não lancei, mas essa página de "em construção" é toda feita em react puro e hospedada em hospedagem estática da hostgator.
Eu simplesmente criei a página react normal e, ao invés de hospedar o build (que daria certo), eu usei uma ferramenta para criar um html estático, como um snapshot, do react. Isso facilita a descoberta por bots e SEO. Isso foi feito usando o react-snap.
Apesar de assim funcionar, ainda não é muito bom. Esses dias me deparei com a build estática do site Next.js, que é excelente.
Eu recomendaria você manter o nextjs, por que é muito mais fácil de desenvolver do que html puro ou wix, e hospedar como site estático a build dele. Dá uma olhada nessa documentação https://nextjs.org/docs/app/building-your-application/deploying/static-exports
Inclusive eu vou migrar esse site que comentei no início para o next.js. Assim eu me aproveito da facilidade de manutenção e desenvolvimento do código e de hospedagem barata.
OBS: Você não vai poder criar server components, apenas front-end. Caso precise de rodar algo no servidor, então vai precisar hospedar na vercel ou VPS.
Espero ter ajudado.
Eu gosto muito da Bohr.io, é uma plataforma brasileira com um suporte muito bom via discord.
Parece um projeto legal, aqui vai meus 2 cents.
O que eu faria?
- Nem hospedaria manualmente nem faria usando código. Para um site assim, estático e sem nenhuma feature além do forms eu só usária uma ferramenta como Wix ou Wordpress, eles já tem varios templates e jeitos para customizar.
Mas caso você queira fazer com código:
- Usaria NextJs: Não é perfeito, mas já entrega muito do que você precisa, e a vantagem é que indexa melhor do que sites React, mesmo que o Google renderize algumas páginas React para fazer a indexação.
- Hospedaria na Vercel: é uma solução simples, e pra muitos casos, de graça. Só iria para uma solução mais sofisticada caso você tenha um site mais complexo ou muitas muitas imagens muito pesadas.
achei muito valida sua duvida pois eu tive um problema com um cliente uma vez por conta do tamanho do site e o free tier da Vercel. O que costumo fazer é criar uma conta no github nova para o cliente e assim hospedo na vercel e ele ja tem possui o código. Agora em relacao a alguns custos, acaba sendo inevitavel devido a quantidade de acessos e ai vale uma busca aprofundada e se o cliente está disposto a pagar de algum jeito
Eu usaria um no-code como o Carrd.
As imagens são hospedadas por eles mesmos, e eles tem suporte pra formulários de email (como um "entre em contato"), então não teria necessidade de se preocupar com muita coisa.
Os planos deles estão entre 45 a 245 reais por ano, mais ou menos.
As imagens não fixas ou ela pode mudar ?
pensei na possibilidade de usar o githubPages, ai compraria apenas o dominio para ela.
ou então fazer como esse comentario que é colocar tudo na Cloudflare
Fala, amigo.
Hoje hospedo meus sites estáticos no netlify.
A versão gratuita dele é muito boa; alta disponibilidade, tem integração com serviços Git (GitHub, Bitbucket, Gitlab,...), além de permitir customização de domínio.
Vou tentar dar a minha humilde opnião em algumas das suas duvidas.
Devo utilizar Next.js ou React puro, levando em consideração servir isso como um processo node ou como arquivos estáticos.
A tecnologia que você vai utilizar na verdade não importa tanto. Se você estivesse utilizando Django, React, Laravel, Blazor ou HTML, CSS e JavaScript puro o resultado seria o mesmo. O que importa é se essa tecnologia facilita e agiliza o seu trabalho durante o desenvolvimento e a manutenção dele no futuro. Então, se você acha que o Next.js te ajuda nisso, vai fundo.
Mas a dúvida entre utilizar Next.js e React puro não faz muito sentido. Next.js e React puro, apenar de serem tudo React, tem alguns objetivos diferentes: Next.js foi desenvolvido para fazer SSR e o React puro SPA. Então a dúvida entre os dois me demonstra que você não conhece essas tecnologias tão bem.
Agora a minha opnião sobre utilizar Next.js no seu projeto de portfolio: Não me parece necessario. Ainda mais em um projeto tão simples como esse. Se tivesse utilizado apenas HTML, CSS e JavaScript puro você conseguiria o mesmo resultado, mais leve, mais rapido e sem dependencias.
Utilizar o Next.js me parece uma escolha exagerada para algo tão simples.
Devo hospedar na Vercel, Hostinger, ou outro lugar? O que sai mais em conta e atende ao objetivo?
Para algo como esse o que não falta são opções. Mas por ser algo tão simples você não precisa de um servidor como os da Hostinger mas pelo fato de você ter utilizado Next.js acredito que a opção mais facil agora seria a Vercel...
Vocês tem mais considerações a fazer, algo que deixei escapar despercebido ou melhorias, idéias?
Tenho: você poderia ter utilizado JavaScript puro ou wordpress...
Coloca no Gitlab Pages e seja feliz, sem precisar gastos com página estática mesmo.
Eu talvez faria um projeto usando NextJs no modo export, e faria deploy no github pages mesmo, usando os workflows do github.
Da uma olhada no meu portfólio por exemplo:
Opa, tudo joia? Da uma olhada em https://cloudx.com.br/hospedagem-de-sites-directadmin/ Servidores no Brasil, a partir d R$ 16,90 e suporte para ajudar nas duvidas! abs