Aprenda como criar um site para avaliar empresas tipo o Glassdoor, usando o editor visual da web do Bubble.
Nunca foi tão fácil começar a criar um software poderoso quanto com o Bubble. Nossa plataforma é uma porta de entrada para os criadores do amanhã – apoiando aqueles que estão moldando o futuro do desenvolvimento de produtos sem ter que escrever código.
Usando nossa ferramenta de programação visual no code, é possível projetar e criar rapidamente um software funcional que vai além das experiências estáticas. Os criadores estão usando o Bubble para criar lojas virtuais , diretórios e até redes sociais.
Este post vai cobrir o processo por trás da criação de um site para avalia empresas como o Glassdoor usando o Bubble. Se você está procurando replicar o Glassdoor, ou apenas esteja interessado em utilizar alguns dos principais recursos da plataforma, este guia compartilhará como começar a criar a lógica para seu produto.
Ao longo deste guia, destacaremos como criar os seguintes recursos principais do Glassdoor:
- Páginas da empresa – exibindo uma lista de conteúdo dinâmico (listas de empregos ou análises)
- A capacidade dos usuários de criar e editar seus próprios perfis de funcionários
- O processo de enviar e exibindo análises geradas por usuários
- Funcionalidade de pesquisa para explorar resultados de empresas específicas.
O Tutorial de Criar um site para avaliar empresas tipo Glassdoor inclui:
Índice
Fazer cadastro gratuito no Bubble
Caso ainda não tenha uma conta no Bubble.io, clique aqui para fazer seu cadastro gratuito. Agora poderemos começar a criar nosso site para avaliar empresas e vagas juntos.
💻 Crie já sua conta gratuita no Bubble, a plataforma que uso para criar Aplicações Web sem programar
Não há maneira certa ou errada de começar a criar seu site no Bubble. Alguns criadores preferem começar com o protótipo de seus produtos, enquanto outros vão começar criando os campos necessários em seu banco de dados (mais sobre isso mais tarde).
Neste caso, começaremos usando a ferramenta de design visual para moldar a interface de usuário do site. Se você estiver replicando a plataforma Glassdoor, algumas das páginas principais que você deseja incluir serão:
- Página inicial – Incluindo uma barra de pesquisa, um grupo repetido de postagens de emprego e quaisquer menus de navegação relevantes
- Perfis de usuário – Uma página onde seu os usuários podem acessar e atualizar suas informações
- Perfis de empresas – Usados para listar quaisquer avaliações relevantes, listas de empregos ou informações
- Páginas de pesquisa – Uma página para exibir e pesquisar avaliações ou listas de empregos.
Uma das principais características do Bubble é a capacidade de enviar dados para uma página. Isso significa que você só precisa criar uma versão genérica de uma página que possa refletir informações sobre usuários específicos ou itens do seu banco de dados.
No caso do Glassdoor, você só precisará criar uma página de perfil da empresa. Podemos então criar a lógica relevante para exibir dados específicos de uma única empresa (também abordaremos isso com mais detalhes em breve).
Configurando o banco de dados do Glassdoor no Bubble
Depois de mapear a exibição da plataforma, você pode se concentrar em criar os campos de dados necessários em seu site para avaliar empresas. Contaremos com esses campos para conectar a lógica por trás de seu site.
Criar um banco de dados no Bubble é um processo contínuo. Comece listando seus tipos de dados de nível superior e, em seguida, adicione os campos necessários em cada categoria.
Criando um Glassdoor MVP no code, precisaremos dos seguintes tipos de dados e campos:
Tipo de dados: Usuário
Campos:
- Nome
- Título
- Localização
- Bio
- Currículo
- Empresa atual
- Foto do perfil
- Campo de estudo
- Habilidades e especialização – Nota: Se você quiser um campo para exibir vários itens, opte por configurar um campo de dados como uma lista de vários itens.
Tipo de dados: Empresa
Campos:
- Nome
- Localização
- Logotipo
- Descrição
- Link do site
- Listas de empregos
- Avaliações
- Indústria
Tipo de dados: Avaliações
Campos:
- O conteúdo de uma avaliação
- A classificação por estrelas da avaliação
- Quem publicou a avaliação
- A empresa na qual a avaliação é publicada – Nota: Vinculando um campo de dados para um tipo de dados existente, você pode facilmente desenvolver e aproveitar outros tipos de dados. Neste caso, adicionando o campo empresa existente em uma avaliação, podemos obter dados adicionais da empresa, como logotipo, nome e descrição, sem ter que criar novos campos de dados.
Tipo de dados: Lista de empregos
Campos:
- Empresa
- Logotipo da empresa
- Título
- Localização da função
- Descrição da função
- Salário
Workflows para um Glassdoor sem programar
Agora que você estruturou o design e o banco de dados do site, é hora de começar a juntar tudo para tornar seu produto funcional.
No Bubble, a principal maneira de fazer isso é com “workflows”. Cada workflow acontece quando ocorre um “evento” (ex: um usuário clica em um botão) e, em seguida, executa uma série de “ações” em resposta (ex:”inscreva o usuário”, “faça uma alteração no banco de dados”, etc. )
Atualizando detalhes do perfil do usuário
Começaremos criando a lógica que permite ao usuário atualizar as informações exibidas em seu perfil.
Criar contas de usuário é um processo direto no Bubble. A plataforma pode ser facilmente integrada a serviços de autenticação de terceiros, como Google, LinkedIn ou Facebook. Para obter mais informações sobre como criar um processo de inscrição, recomendamos a leitura de nossos guias de instruções anteriores.
Neste caso, vamos nos concentrar em permitir que os usuários adicionem seu nome relevante, cargo, empresa, local, foto de perfil e currículo ao perfil de funcionário.
Usando inputs , você pode mapear entradas de texto livre, estruturados ou inputs de arquivo que podem ser usados para atualizar seu banco de dados.
Depois que um usuário adiciona seus detalhes relevantes em cada entrada, ele clica no botão enviar para atualizar esses dados.
Este clique de botão será a ação necessária para acionar seu workflow.
Usando o editor de workflow, você pode optar por alterar um item em seu banco de dados após esta ação.
Neste caso, você desejará fazer alterações no usuário utilizando os inputs relevantes em sua página. Comece a mapear cada campo de dados que deseja alterar em relação a cada um dos campos de tipo de dados.
Quando este botão for pressionado, ele atualizará todos os campos relevantes com quaisquer novos valores.
Adicionalmente, agora você pode exibir esses dados em um perfil de usuário, selecionando os campos de dados relevantes que eles forneceram.
Ao criar um site tipo Glassdoor, você também seguirá um processo semelhante ao permitir que os usuários criem páginas da empresa.
Enviando uma avaliação
O workflow que alimenta as avaliações geradas pelo usuário também seguirá uma estrutura familiar para a função de edição de perfil, só que desta vez você desejará criar um novo item em seu banco de dados.
Nota: Neste caso, usamos uma combinação de inputs de texto, bem como inputs de pesquisa para descobrir empresas existentes e um input suspenso para selecionar uma classificação por estrelas.
Ao criar um novo item em seu banco de dados, você selecionará o tipo de dados da avaliação. A partir daqui, você continuará mapeando seus inputs para corresponder aos campos relevantes no banco de dados.
Em seu banco de dados, criamos anteriormente um campo de dados que se integrou com o tipo de dados ‘empresa’. Essa integração permitirá que você envie uma avaliação para uma empresa existente.
Ao criar um processo de envio de listas de empregos, você também seguirá um workflow semelhante aos exemplos anteriores. Em seu banco de dados, você pode adicionar e combinar quantos campos de dados únicos desejar para cada tipo de dados.
Exibindo conteúdo dinâmico
Depois de começar a preencher seu banco de dados com empresas, avaliações e listas de empregos, você pode facilmente agregar e exibir esse conteúdo aos perfis relevantes da empresa.
Ao criar uma página de perfil de empresa, comece alterando o tipo da página para a propriedade empresa.
Ao classificar o tipo de conteúdo de uma página, o Bubble pode facilmente extrair e enviar dados relevantes de fontes existentes.
Agora você pode começar a adicionar conteúdo dinâmico nos campos que exibem informações sobre uma determinada empresa.
Para exibir a lista de avaliações relevantes apenas para a empresa atual cuja página você está visualizando, você pode adicionar um elemento de grupo repetidor.
Atualize a fonte de dados desse grupo repetidor para pesquisar avaliações, depois apenas as avaliações da empresa cuja página estamos visualizando no momento.
Quando a página de uma empresa específica for visualizada, será preenchido apenas o conteúdo relevante para sua entidade única.
Criar recursos adicionais em seu Glassdoor no code
Depois de familiarizar-se com a criação de campos de dados personalizados e exibição de conteúdo dinâmico, você pode começar a ser criativo com as experiências que cria. Além disso, você pode:
- Adicionar filtros de pesquisa ao conteúdo exibido em um grupo repetidor. Isso pode ser útil ao pesquisar uma empresa específica ou ao filtrar listas de empregos.
- Permitir que os usuários deixem curtidas nas avaliações.
- Criação de permissões de administração para moderar o conteúdo gerado pelo usuário.
Veja também:
ATENÇÃO: Este é um tutorial traduzido para Português a partir do original em Inglês. O Bubble possui dezenas de tutoriais ensinando a criar aplicativos de forma 100% visual, sem precisar programar.
Acesse aqui todos os tutoriais: https://bubble.io/how-to-build
Acesse aqui a versão original deste tutorial em inglês: https://bubble.io/blog/build-glassdoor-clone-no-code/