Skip to content

landing page creation using nextjs and typescript. documenting with storybook and testing with jest.

Notifications You must be signed in to change notification settings

Mornieur/leadster-landing-page

Repository files navigation

🚀 Welcome to Leadster Landing Page!


project image

Descrição

Este projeto é a landing page do Leadster, uma plataforma para aumentar em 3x a captação de leads. O objetivo desta página é fornecer informações sobre os serviços e recursos oferecidos pelo Leadster, além de capturar leads por meio de um formulário de contato.

Tecnologias utilizadas

Este projeto utiliza as seguintes tecnologias:

Next.js
TypeScript
Jest
React Testing Library
Storybook
Framer-motion

Pré-requisitos

Para executar este projeto, você precisará ter as seguintes dependências e tecnologias instaladas em sua máquina:

Node.js
Yarn

Instalação

Para instalar este projeto, siga estas etapas:

Faça o clone do repositório para o seu ambiente local.
Navegue até o diretório do projeto e execute o seguinte comando para instalar as dependências:

yarn install

Executando o projeto

Para executar o projeto em modo de desenvolvimento, execute o seguinte comando:

yarn run dev

Isso iniciará o servidor de desenvolvimento do Next.js e você poderá acessar a landing page no seu navegador em http://localhost:3000.

Executando os testes

Para executar os testes, execute o seguinte comando:

yarn test

Isso iniciará a execução dos testes usando o Jest e a React Testing Library.

Visualizando a documentação do Storybook

Para visualizar a documentação interativa dos componentes usando o Storybook, execute o seguinte comando:

yarn storybook

Isso iniciará o servidor do Storybook e você poderá acessar a documentação no seu navegador em http://localhost:6006.

Organização do código

O código deste projeto está organizado da seguinte forma:

src/components: contém os componentes React usados na aplicação.
src/pages: contém as páginas da aplicação.
src/utils: contém funções e utilitários comuns usados na aplicação.
components/stories: contém as histórias do Storybook para os componentes React usados na aplicação.
components/tests: contém os testes dos componentes React usados na aplicação.
pages/tests: contém os testes das páginas da aplicação.