Dia 13 — Desenvolver a landing page

Samuel Fialho
Superlativo Blog
Published in
4 min readFeb 7, 2018

Hoje vamos falar sobre uma parte da tecnologia que vai estar por trás da landing page que irei criar.

Este artigo pertence a uma série a que chamei “Como testar uma ideia de negócio sem metermos os pés pelas mãos”. Acompanhe-me nos próximos dias numa jornada em que decidirei se avanço ou recuo com a concretização de um projecto.

É altura de começar a desenvolver a landing page onde os utilizadores se irão dirigir, depois de terem clicado na campanha publicitária que irá circular no Facebook. É, sem dúvida, um momento importante, porque será aqui a última hipótese que terei para converter o utilizador em potencial cliente. É aqui também que irei registar os emails dos utilizadores e verificar, a partir daí, a viabilidade deste projecto.

Para fazer um MVP a sério, iria utilizar uma ferramenta rápida para fazer o site. Por exemplo, poderia utilizar a novíssima funcionalidade do MailChimp para criar landing pages (é gratuita). Ou então, poderia fazer algo ligeiramente mais complexo, mas ainda de forma rápida, com a SquareSpace (gratuito durante 15 dias, provavelmente o tempo que irei precisar para avaliar a viabilidade do projecto).

Mas o leitor já percebeu que estou longe de seguir o formato do MVP tradicional. Se contar tempo que investi no video (cerca de uma semana), só por aí, iria estar contra a filosofia ágil desta estratégia.

A verdade é que estou a fazer isto de forma a me dar gozo — e a aprender alguma coisa durante o processo.

Nesse sentido, e para fugir à zona de conforto, vou aumentar a parada e correr o risco de me espetar contra um muro a muita velocidade. Em vez de usar Drupal (um Content Management System com que trabalho desde 2009) com um Rest API e usar Vue.js como frontend do projecto, tendo por base o Zurb Foundation como framework, vou utilizar tecnologias que não tenho tanta experiência.

Por isso, caro leitor, se muitos dos termos que leu no parágrafo anterior são chinês para si, não vale muito a pena continuar a ler o artigo (a não ser que tenha muita curiosidade). Porque, a partir daqui, irá ficar ainda mais técnico.

Depois de alguma pesquisa decidi utilizar as seguintes tecnologias: React, GraphQl, Gatsby.js, Contentful e Bootstrap.

Tenho andado a utilizar React durante os últimos meses apenas para aprender (nunca utilizei num projecto para clientes). É uma boa altura para exercitá-lo.

Tenho muita curiosidade com o GraphQl. Não é que este projecto (uma mera landing page) necessite de algo deste género, mas, como disse, a ideia é experimentar e aprender alguma coisa.

O Gatsby é um gerador de sites estático, baseado em React e preparado para GraphQl. Para o projecto em questão é excelente, porque vai permitir-me desenvolver o site de uma forma mais simples e, fundamentalmente, irá tornar a performance do site muito rápida.

Para não utilizar o Drupal, com tudo o que isso implica (instalação de uma mega estrutura e respectiva manutenção), decidi usar algo indicado para o Gatsby. Contentful pareceu-me ser muito simples, já está preparado para o Gatsby (tem já um plugin desenvolvido) e é perfeito para usar com o GraphQl. Será lá que irei registar os emails dos utilizadores. É gratuito.

E, para sair mesmo da zona de conforto e entrar na selva, vou usar o Bootstrap. Desde 2013 que utilizo Zurb Foundation. Acompanhei o projecto desde muito cedo e acredito, com muita convicção, de que é o melhor framework que existe de momento. Digo isto não só pelas sucessivas escolhas que o tempo veio comprovar estarem correctas (como por exemplo, a utilização de SASS em vez de LESS) mas sobretudo pela forma semântica com que o projecto é desenvolvido, para além da preocupação constante com a acessibilidade de todos os utilizadores.

Apesar disso, concedo que o Bootstrap teve uma evolução incrível (é, sem dúvida, o framework mais utilizado na web) e está na hora de voltar a dar-lhe uma nova oportunidade. Também contribuiu para esta decisão o facto de ser muito mais simples de implementar no React do que o Foundation (pelo menos, assim achei, depois de sucessivos testes).

E é isto. Prevejo que demore uma semana para desenvolver esta página. Mas é provável que descarrile, dada toda a inexperiência em todas as tecnologias que irei usar.

Portanto, a partir daqui, irei escrever sobre os desafios que vou encontrar no desenvolvimento do site, pelo que o conjunto de artigos que se segue será de carácter mais técnico (se não estiver interessado em acompanhar esta parte, volte daqui a uma semana para ver se eu estou desesperado!).

Amanhã vou começar a configurar todo o projecto, colocar as diferentes tecnologias a trabalhar entre elas. Se tiver tempo, começo já a desenvolver a hero section do site.

Até lá e obrigado por continuar a ler estes artigos.

--

--

Samuel Fialho
Superlativo Blog

Full Stack Designer. React forever apprentice. Communication thinker. Original from Nazaré. Based in Lisbon.