Acessibilidade

📸 Screenshots do Projeto

📝 Sobre o Projeto

Este projeto procura aplicar boas práticas de acessibilidade web.

Para visualizar o projeto ‘online’ clique aqui.

---

🌐 Tecnologias Usadas

⚛ Next.js

🔥 TypeScript

💅 Styled-Components

🚩 Lints — ESlint/Prettier/EditorConfig/Commitlint

✅ Jest e React Testing Library

📝 Storybook

📱 PWA

♿ Plugins para Acessibilidade:

• @storybook/addon-a11y
• eslint-plugin-jsx-a11y️

---

✨ Features

• Projeto responsivo;

• Acessível para navegação sem mouse e para leitores de tela;

• Scroll infinito nos cards de comentários de redes sociais;

• Componente de comentários que aceita dados de API;

• Componente de banner para destaque de cards e imagens;

• Transição entre páginas;

• Load para aguardar carregamento via API;

• Carrossel responsivo com animações e bullet indicativo de posição;

• PWA instalável;

---

🚩 Pré-Requisitos

• node

• yarn

---

❓ Como instalar e executar o projeto

Clonar Repositório:

git clone https://github.com/everton-dgn/accessibility.git

Instalar Dependências:

yarn

Inciar Ambiente de Desenvolvimento:

yarn dev

Disponível em http://localhost:3000

Gerar Build de Produção:

yarn build

Inciar Ambiente de Produção:

yarn start

Disponível em http://localhost:3000

Executar Testes:

yarn test

Executar Testes em Modo Watch:

yarn test:w

Inciar Storybook em Modo de Desenvolvimento:

yarn sb

Disponível em http://localhost:6006

Gerar Build de Produção do Storybook:

yarn build-sb

Executar lints:

yarn lint

yarn next:lint

---

📕 Autor

Feito por Éverton Toffanetto.

🔗 LinkedIn: https://www.linkedin.com/in/everton-toffanetto/