Feb 15, 2024

Seu portfólio.

Um portfólio feito com o next.js, por Felipe SBM.

Felipe Samuel
by Felipe Samuel
Seu portfólio.

Um portfólio de desenvolvedor é uma coleção de amostras de trabalho e projetos que demonstram suas habilidades e experiência. Ter um portfólio forte pode diferenciá-lo de outros candidatos ao procurar empregos e também serve como uma ferramenta valiosa para networking e para se estabelecer como um especialista no assunto.

Neste tutorial, vou explicar como construir um portfólio de desenvolvedor usando o Next.js e implantá-lo diretamente do seu repositório GitHub para a plataforma de Hospedagem de Aplicativos da Kinsta. Vamos lá!

Por que escolher o Next.js?

O Next.js é um framework de biblioteca JavaScript de código aberto baseado em React. Ele simplifica a construção de aplicativos renderizados no lado do servidor e estáticos, otimizando o processo e melhorando o desempenho de renderização. Além disso, o Next.js é versátil e adequado para uma ampla gama de projetos de desenvolvimento web.

Requisitos / Pré-requisitos

Antes de começarmos, certifique-se de ter o seguinte:

  • Conhecimento básico de HTML, CSS e JavaScript.
  • Familiaridade com React e talvez com o Next.js.
  • Node.js e npm (Node Package Manager) ou yarn instalados em seu computador.

Passos para criar seu portfólio com Next.js:

  1. Crie um novo projeto Next.js:

    • Abra o terminal e execute os seguintes comandos:

      npx create-next-app my-portfolio
      cd my-portfolio
      
      

    Isso criará um novo projeto Next.js em um diretório chamado “my-portfolio” e o levará para o diretório raiz do projeto.

  2. Construa seu portfólio de desenvolvedor:

    • Personalize o conteúdo do seu portfólio, incluindo informações sobre você, suas habilidades, projetos anteriores e links para suas redes sociais.
    • Crie páginas para exibir seus projetos, habilidades e detalhes de contato.
  3. Estilize seu portfólio:

    • Use CSS ou bibliotecas como styled-components para estilizar seu portfólio.
    • Certifique-se de que seu portfólio seja responsivo para diferentes dispositivos.
  4. Implante seu aplicativo Next.js na Kinsta:

    • A Kinsta oferece hospedagem de aplicativos com um domínio gratuito .kinsta.app.
    • Conecte seu repositório GitHub ao Kinsta e implante seu aplicativo.
    • Agora seu portfólio estará online e acessível através do domínio fornecido pela Kinsta.

Lembre-se de que este é apenas um guia básico. Você pode personalizar seu portfólio de acordo com suas preferências e necessidades específicas. Boa sorte na criação do seu portfólio! 🚀

Para uma demonstração em tempo real do portfólio de desenvolvedor que você estará construindo com o Next.js, você pode acessar o repositório do GitHub deste projeto ou usar este modelo de projeto inicial para portfólio selecionando “Use this template” (Usar este modelo) > “Create a new repository” (Criar um novo repositório) – isso irá copiar o código inicial para um novo repositório.

Continue Reading