Cranq é um modelo industrial de React e TypeScript de oficina para oficinas de conserto de bicicletas, oficinas de serviços, construtores personalizados e mecânicos de bicicletas móveis. Construído com React 19, TypeScript (modo estrito), Vite, React Router e Bootstrap 5, ele combina um design confiável de limão sobre marfim com uma base de código limpa e totalmente baseada em componentes, tokens de design CSS, fontes hospedadas localmente e layouts responsivos em todos os tamanhos de tela

.

Este modelo de site de oficina de bicicletas inclui 16 páginas prontas sobre como uma loja realmente é reservada: os serviços que ela oferece, quanto custam esses serviços, as construções personalizadas que foram concluídas, a mecânica por trás do banco e um formulário de reserva que captura o trabalho. Toda a cópia e o conteúdo estão em módulos de dados digitados, cada interface do TypeScript fica em seu próprio arquivo e as páginas são compostas por pequenos componentes de seção reutilizáveis, portanto, editar texto ou adicionar uma seção é rápido e seguro para digitar. O Cranq foi construído para uma loja que quer que os passageiros cheguem já sabendo quanto custa o trabalho e quanto tempo leva

.

Características principais

• React 19 + TypeScript : base de código moderna, estritamente tipada e baseada em componentes
• Vite : servidor de desenvolvimento instantâneo com HMR e uma construção de produção otimizada
• React Router : 16 páginas com um menu de navegação baseado em dados
• Bootstrap 5 : grade e utilitários (somente CSS, sem jQuery, sem pacote Bootstrap JS)
• Arquitetura de componentes : componentes de interface de usuário reutilizáveis e páginas de pastas de recursos
• Conteúdo digitado centralizado : todo o texto e dados em src/data, todas as interfaces em src/interfaces
• Design industrial de oficina : toque de limão em um fundo quente de marfim, botões sólidos e robustos, linhas de preços
• Paginação de blog compatível com SEO: realmente rastreável? page=2 URLs , não botões somente para clicar- 6 páginas de detalhes do serviço e 9 artigos : rotas baseadas em slug geradas a partir de dados
• Formulários de reserva e contato : validação do lado do cliente com erros em linha e um estado de sucesso
• Galeria de compilação filtrável : filtragem de categorias tratada no estado React
• Design 100% responsivo : verificado em desktop, tablet e celular
• Tokens de design CSS : cor global, espaçamento e tipografia por meio de variáveis CSS
• Fontes locais : Space Grotesk e Inter agrupados, totalmente offline, sem solicitações de CDN
• Documentação completa incluída : configuração, estrutura, personalização e implantação

Ideal para

• Oficinas de reparo de bicicletas
• Workshops de serviço de bicicletas
• Construtores de bicicletas e construtores de estruturas personalizadas
• Centros de serviços de bicicletas elétricas
• Mecânica de bicicletas móveis e no local
• Construtores de rodas e especialistas em componentes
• Estúdios de montagem de bicicletas
• Lojas de bicicletas com uma bancada de serviços

Páginas incluídas

• Início
• Sobre
• Serviços
• Detalhe do serviço
• Construções personalizadas
• Construir galeria
• Preços
• Marcar consulta
• Equipe
• Testemunhos
• PERGUNTAS FREQUENTES
• Blog
• Blog único
• Entre em contato
• Em breve
• Página 404

Créditos

• Biblioteca: react.dev (React + TypeScript)

• Ferramenta de construção: vite.dev

• Roteamento: reactrouter.com

• Estrutura: getbootstrap.com (Bootstrap 5, grade CSS e utilitários)

• Ícones: ícones SVG embutidos personalizados

• Imagens: somente imagens de espaço reservado, as fotos não estão incluídas no download

• Fontes: Space Grotesk (Florian Karsten) e Inter (Rasmus Andersson), licenciadas pela OFL, servidas localmente

Aviso de imagens: O pacote de download envia imagens neutras de espaço reservado no lugar de todas as fotografias. Cada espaço reservado tem o mesmo nome de arquivo da imagem que ele substitui e é rotulado com o tamanho exato que o slot precisa, para que você possa inserir sua própria arte diretamente sem alterar o código. A demonstração ao vivo usa fotografia da Envato Elements, que requer uma licença separada e não é redistribuída. Substitua os espaços reservados por suas próprias imagens licenciadas antes de publicar. Fontes sugeridas: [Envato Elements](https://raj.ptkmovies.fun/), [Unsplash](https://unsplash.com/)

ou Pexels. [

Observação: o Cranq é um aplicativo React de página única, não um modelo HTML estático e não um tema WordPress. Ele requer o Node.js e uma etapa de construção (Vite). Recomenda-se familiaridade básica com o React, o TypeScript e a linha de comando

.](https://www.pexels.com/)