Realize a instalação do NodeJS pelo link:
Ou instale pelo seu gerenciador de pacotes de sua distro seguindo essas etapas.
Para executar o projeto localmente, é necessário clonar-lo em seu ambiente de desenvolvimento:
$ git clone https://github.com/sennshi/pixeltry
Logo após clonar-lo, acesse a pasta do projeto usando cd pixeltry
e execute npm i
para realizar a instalação das bibliotecas necessárias.
Após ter realizado a instalação, execute npm run dev
ou npm run start
para rodar o projeto,
por fim, basta acessar http://localhost:3000
para vizualizar a execução do projeto.
Essas são as ferramentas presentes na Toolbar
e suas respectivas ações:
Tool/Botão | Ação |
---|---|
Gotas | Utilizado para pegar a cor de outro pixel |
Pincel/Lapis | Utilizado para desenhar os pixel |
Borracha/Apagador | Apaga um pixel |
Grade | Ativa a grade do canvas(um contorno nos pixeis). Ele auxilia na visualização dos pixeis |
Lixeira/Sair | Essa opção apaga o desenho e lhe redireciona para o menu(seleção de resolução/tamanho) |
Fullscreen | Ativa o modo tela cheia |
Esse projeto está sob licença. Veja o arquivo LICENÇA para mais detalhes.
Foram utilizados as seguintes ferramentas e bibliotecas no desenvolvimento do projeto:
- react-prismazoom - utilizado para manipular a distância de visualização do canvas.
- react-component-export-image - exportação do componente canvas como imagem.
- react-icons - ícones
- react-color - color picker (SketchPicker)
- favicon.io - usado para gerar o favicon
feito com ❤️ por Rodrigo sennshi