Skip to content

lukeskw/sweetheart

Repository files navigation

❤️ Sweetheart

Uma homenagem especial para a minha amada esposa neste Dia dos Namorados!


🌟 Overview

Este projeto é um app bem simples criado para celebrar o amor, apresentando um contador do tempo exato do nosso relacionamento e um carrossel de fotos com memórias especiais. É uma surpresa personalizada feita com muito carinho.


✨ Funcionalidades

  • 🎉 Tela de Boas-Vindas: Uma entrada animada com corações caindo para iniciar a experiência
  • ⏰ Contador de Tempo: Exibe há quanto tempo estamos juntos, com precisão de anos, meses, dias, horas, minutos e segundos
  • 📸 Carrossel de Fotos: Um álbum de memórias visuais que mostra momentos importantes do nosso relacionamento
  • 💌 Mensagem Romântica: Uma mensagem pessoal dedicada à minha esposa
  • 🎵 Trilha Sonora: Um player de Spotify integrado para criar a atmosfera perfeita

🛠️ Tecnologias Utilizadas

Tecnologia Descrição
React Biblioteca JavaScript para construção da interface do usuário
TypeScript Superset do JavaScript que adiciona tipagem estática
Motion Biblioteca de animação para React, usada para criar transições suaves e envolventes
date-fns Biblioteca de manipulação de datas, utilizada para calcular e formatar o tempo de relacionamento de forma precisa
Tailwind CSS Framework CSS utilitário para estilização rápida e responsiva
Shadcn/ui Componentes de UI construídos com Tailwind CSS e Radix UI, usados para o carrossel

🚀 Como Executar Localmente

Para rodar este projeto no seu ambiente de desenvolvimento:

1. Clone o repositório

git clone [email protected]:lukeskw/sweetheart.git
cd sweetheart

2. Instale as dependências

npm install
# ou
yarn install

3. Inicie o servidor de desenvolvimento

npm run dev
# ou
yarn dev

4. Acesse o aplicativo

O aplicativo estará disponível em http://localhost:5173


📁 Estrutura do Projeto

sweetheart/
├── src/
│   ├── ui/
│   │   ├── button.tsx
│   │   └── carousel.tsx
│   ├── lib/
│   │   └── utils.tsx
│   ├── hooks/
│   │   └── useTimeCounter.tsx
│   ├── components/
│   │   ├── EntranceScreen.tsx
│   │   ├── TimeCounter.tsx
│   │   ├── SpotifyFrame.tsx
│   │   ├── CarouselIndicators.tsx
│   │   ├── PhotoCarousel.tsx
│   │   ├── FallingHeart.tsx
│   │   ├── HeartRain.tsx
│   │   ├── RomanticMemorial.tsx
│   │   └── RomanticMessage.tsx
│   ├── data/
│   │   └── photo.ts
│   ├── styles/
│   └── App.tsx
├── public/
├── package.json
└── README.md

🤝 Contribuição

Este é um projeto pessoal e íntimo, mas fique à vontade para se inspirar e criar sua própria versão para sua pessoa especial! 💕


📄 Licença

Este projeto é de uso pessoal e foi criado com amor. ❤️


💖 Dedicatória

Feito com todo o meu amor pra Jaque ❣

Por Luke 💝


"O amor não é apenas olhar um para o outro, é olhar juntos na mesma direção."


Made with Love React TypeScript

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published