Skip to content

Latest commit

 

History

History
73 lines (49 loc) · 2.88 KB

README.md

File metadata and controls

73 lines (49 loc) · 2.88 KB
Raw

iFood Início Clone com Next.js e TailwindCSS | @caraquecoda

Bem-vindo ao repositório do projeto iFood Início, um clone da interface do site iFood, desenvolvido com Next.js e TailwindCSS.

  • Veja a aplicação em funcionamento: Demo
  • Assista ao tutorial no YouTube: Tutorial

Sobre o Projeto

🍕🍔 Aprenda a criar um clone da interface do iFood utilizando Next.js e TailwindCSS! Neste tutorial detalhado, vamos construir juntos uma aplicação que replica a interface do popular serviço de entrega de comida, explorando as funcionalidades essenciais e as melhores práticas para desenvolvimento web moderno.

Funcionalidades

  • Interface Responsiva: Design responsivo para uma ótima experiência em dispositivos móveis e desktops.
  • Navegação Rápida: Navegação eficiente utilizando as rotas do Next.js.
  • Estilização Moderna: Estilos aplicados com TailwindCSS para um design moderno e consistente.

Estrutura do Projeto

O projeto é composto por vários arquivos e pastas principais:

  • pages/: Contém as páginas da aplicação, seguindo a estrutura de rotas do Next.js.
  • components/: Contém os componentes reutilizáveis da aplicação.
  • styles/: Contém os arquivos de estilo, incluindo a configuração do TailwindCSS.

Como Usar

Para usar o clone do iFood Início, siga os passos abaixo:

  1. Clone este repositório para sua máquina local:

    git clone https://github.com/vmnog/ifood-inicio
cd ifood-inicio

  2. Instale as dependências:

    pnpm install

  3. Execute o projeto em modo de desenvolvimento:

    pnpm run dev

  4. Abra o navegador e acesse:

    http://localhost:3000

Tecnologias Utilizadas

  • Next.js: Framework React para renderização do lado do servidor e geração de sites estáticos.
  • React: Biblioteca JavaScript para construção de interfaces de usuário.
  • TailwindCSS: Framework CSS para estilização da aplicação.
  • TypeScript: Superset do JavaScript que adiciona tipos estáticos ao código.

Scripts Disponíveis

No projeto, você pode executar os seguintes scripts:

  • pnpm run dev: Executa a aplicação em modo de desenvolvimento.
  • pnpm run build: Cria a versão de produção da aplicação.
  • pnpm run start: Inicia o servidor da aplicação.
  • pnpm run lint: Executa o linter para verificar problemas no código.

Contribuições

Contribuições são sempre bem-vindas! Se você tem alguma sugestão para melhorar este projeto, sinta-se à vontade para criar uma issue ou enviar um pull request.

Esperamos que você aproveite a utilização do nosso Clone do iFood Início, e estamos ansiosos para ver as incríveis funcionalidades que você pode adicionar a ele!