Giter Site home page Giter Site logo

pabloxt14 / ignite-timer Goto Github PK

View Code? Open in Web Editor NEW
3.0 1.0 2.0 4.57 MB

O Ignite Timer nada mais é que um projeto que permite ao usuário cronometrar as suas tarefas no dia a dia, além de lhe permite ver um histórico de todos as tarefas já realizadas.

Home Page: https://ignite-timer-pearl.vercel.app/

HTML 2.38% TypeScript 97.62%
dark-theme date-fns light-theme phosphoricons react-hook-form reactjs styled-components usereducer zod

ignite-timer's Introduction

Logo Ignite Ignite Timer

Demonstration | Deploy | Technologies | Layout | Clipboard | Settings


O Ignite Timer nada mais é que um projeto que permite ao usuário cronometrar as suas tarefas no dia a dia, além de le permite ver um histórico de todos as tarefas já realizadas.

Objetivos: os principais objetivos desta aplicação foi treinar a atilização das seguintes ferramentas/tecnologias:

  • Lidar com datas e horarios através da biblioteca date-fns
  • Utilização de formulários com React Hook Form
  • Aplicação de temas dark e light utilizando o Styled Components
  • Uso do hook useReducer do React para centralizar as alterações em um estado complexo
  • Outros...
  • Caso goste do projeto marque a estrelinha⭐ e compartilhe para me ajudar 👍, e me siga para ver outros projetos meus.

📷 Demonstration

Capa do projeto

Gif de demonstração do projeto

💻 Deploy

Clique no link a seguir para executar o projeto na sua máquina: Link

🚀 Technologies

Esse projeto foi desenvolvido com as seguintes tecnologias:

Vite
ReactJS
TypeScript
Styled Components
Phosphor Icons
date-fns
React Hook Form
Zod
React Router
Immer

🎨 Layout

Você pode visualizar o layout do projeto através desse link. É necessário ter conta no Figma para acessá-lo.

📋 Clipboard (Pré-requisitos)

Antes de baixar o projeto você vai precisar ter instalado na sua máquina as seguintes ferramentas:

⚙ Settings

Segue os comandos para baixar e executar o projeto na sua máquina:

  • git clone + URL do Projeto: clonar este repositório.
  • cd Ignite-Timer: acessa a pasta do projeto no terminal.
  • yarn: para baixar as dependências do projeto.
  • yarn dev:
    • Executa o projeto em modo/ambiente de desenvolvimento.
    • Abra http://localhost:3000 para ver o projeto rodando no Navegador.
    • A página será recarregada se você fizer edições no código, e se tiver algum erro será mostrado no console.
  • yarn build:
    • Compila a aplicação para a produção na pasta build.

📝 License

Esse projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.

✍ Author

PabloXT14

Made with 💜 by PabloXT14

Linkedin Pablo Alan Gmail Pablo Alan

ignite-timer's People

Contributors

pabloxt14 avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.