Por que desenvolver um portfólio web?
Um portfólio funciona como uma espécie de vitrine dos projetos desenvolvidos e pode ser um ótimo lugar para demonstrar suas habilidades, qualificações, etc. Além disso, o portfólio expõe uma pequena parte de sua criatividade e personalidade. Em suma, o portfólio representa você.
Versão atual (v3.0.0 - 2023)
Durante o ano que passou fiz melhorias significativas em minhas habilidades de interface do usuário e front-end, o que me motivou a aprimorar meu portfólio.
E com o lançamento da nova documentação do React, houve algumas mudanças importantes. Para me manter atualizado com as últimas tendências tecnológicas, tomei a decisão de atualizar meu projeto.
Bem-vindo à versão mais recente do meu portfólio. Fiz a transição para usar o Next.js, um framework poderoso que traz inúmeros benefícios. Com o Next.js, meu portfólio agora oferece desempenho aprimorado, recursos de renderização do lado do servidor, otimização de SEO e integração perfeita com o React.
As principais alterações de versão em meu portfólio (v3) incluem
- Migração para Next.js visando melhor desempenho e renderização do lado do servidor
- Componentes de IU personalizados sem depender de bibliotecas de IU.
- Documentação dos recursos do projeto usando Storybook
- Transição do admin e do banco de dados de Heroku para Railway para melhor escalabilidade e tempos de resposta da API mais rápidos.
- Front-end movido do GitHub Pages para o Vercel para integração perfeita com o Next.js.
- Strapi atualizado para a versão mais recente.
Tecnologias e recursos
- Next Js
- React Context
- SCSS
- Storybook
- Spline para animações 3D
- Theming control
- i18n - Para gerenciar a internacionalização de aplicativos
- Fortawesome – Biblioteca de ícones
- React Slick - Slide de imagens
- Vercel para hospedar o front-end
- Railway para hospedar o admin
Confira no vídeo abaixo todo o processo de criação do meu portfólio:
v2.0.0 - 2022
A v2.0.0 foi focada na atualização da versão anterior (1.0.0), aprimorando o design da interface do usuário com mais estilo, à medida que continuei a crescer como desenvolvedor e a aprimorar minhas habilidades. Nesta atualização, meus principais objetivos foram remover o aspecto curricular da versão inicial, integrar um gerenciador de conteúdo para atualizações dinâmicas de conteúdo em vez de informações estáticas, atualizar bibliotecas, refatorar o código e estabelecer uma identidade mais forte para mostrar meus projetos com mais detalhes.
Tecnologias e recursos
- ReactJs
- Material UI
- SCSS
- Redux
- i18n - Para gerenciar a internacionalização
- Fortawesome – Biblioteca de ícones
- React Slick - Slide de imagens
- Heroku para hospedar o admin
- Github pages para o front-end
Para o Back-end, escolhi usar o Strapi, que é um gerenciador de conteúdo headless, Javascript e de código aberto. Com o Strapi pude configurar rapidamente um banco de dados Postgres, gerenciar localidades (en e pt-BR) e criar endpoints para servir o conteúdo para o Front-end deste projeto.
v2.0.0 Demo
Obs. O banco de dados antigo não está mais disponível, o que significa que alguns conteúdos da demonstração da v2.0.0 não serão carregados, mas não se preocupe. Você ainda pode verificar o layout e o conteúdo estático.
Version 1.0.0 (2019)
Na primeira versão desenvolvida do meu portfólio, tive o objetivo não apenas de demonstrar meus projetos, mas também de me apresentar, falar sobre minhas qualificações, formação e divulgar meu currículo. Com isso, projetei e desenvolvi um aplicativo de página única, onde o usuário poderia, através do menu flutuante ou apenas utilizando o scroll, acessar todas as seções da página. Veja abaixo como eram as telas da primeira versão do meu portfólio web.
