PaintApp

App Python Paint

Um aplicativo básico de pintura construído para um JR. Desafio Dev Hackathon

• Instruções de hackathon
• Sobre o aplicativo Python Paint
• Características
• Questões conhecidas
• Pilha de tecnologia
• Implantando
  • Implantando no servidor local
  • Implantando em python em qualquer lugar
• Sobre o desenvolvedor
• Captura de tela de demonstração
  • Controles básicos
  • Salvar, editar e excluir
  • Vista e perfis da galeria

Demonstração:

Demoção ao vivo

Instruções de hackathon

Aplicativo de pintura - tornando -se Bob Ross

Os computadores têm sido um benefício para a criatividade e a imaginação. A arte digital há, há décadas, é um meio por si só; E com o advento das NFTs, o futuro pode ser muito brilhante para os artistas digitais. Hoje, criaremos um aplicativo que permite que seus amigos e entes queridos expressem seu lado criativo.

Hoje, seu desafio é construir um dos abaixo:

Somente front-end

Crie um aplicativo que permite que as pessoas expressem sua criatividade em um formato visual. Você pode criar qualquer aplicativo que desejar. Seja uma tela em branco em que você pode pintar, um aplicativo de edição de fotos, uma placa branca compartilhada-desde que atenda a um ou ambos os seguintes requisitos:

• Como usuário, posso arrastar meu mouse pela tela para criar linhas de forma livre.
• Como usuário, posso clicar em áreas da tela com meu mouse para preenchê -los com uma cor, textura ou padrão.

Pilha completa (opcional)

Em termos gerais: adicione um recurso de pilha completa que faz sentido para o seu aplicativo. Exemplos incluem:

• Arte compartilhável
• Arquivos salváveis
• Perfis de usuário com galerias de trabalho

Para equipes com designers de UX/UI

Uma grande recepção à nossa primeira coorte de designers de UX/UI! Suas equipes têm a sorte de ter a visão e a requinte que um designer pode trazer! Para garantir que você obtenha crédito pelo seu trabalho, inclua seus designs em um formato compartilhável (PDF, Adobe XD ou um figma público é recomendado). O melhor lugar para incluir isso é na página de destino do aplicativo e no arquivo ReadMe do Github Repo. É recomendável que você também compartilhe seu trabalho no LinkedIn e no Twitter, pois isso conta para contar histórias para você pessoalmente.

Sobre

Este é um aplicativo simples de pintura na web criado usando a estrutura e JavaScript do Django para permitir a interação com uma tela JavaScript. O objetivo deste projeto é concluir um desafio de JR Dev Hackathon, apresentado pelo Mintbean.

Características

Controles

• Escova simples
• Apagador
• Ferramenta de carimbo de padrão
• Seletor de cores
• Slider do tamanho da escova
• Botão de tela limpa

Funcionalidade

• Redimensione pincel/borracha/carimbo
• Tamanho das lojas para cada ferramenta
• Armazena a cor para cada ferramenta
• Criação de conta de usuário
• Salvar tela para contas
• Visualização da conta
• Veja o usuário salvo arte
• Ver atividade recente
• Exclua arte salva salva
• Editar arte salva anteriormente

Funcionalidade a ser adicionada

• Formas de escova adicionais
• Formas adicionais de carimbo
• Ferramenta de linha/forma
• Ferramenta de preenchimento
• Desfazer/refazer
• Carregar/colar imagem
• Salve como cópia

Questões conhecidas

• Veja problemas para uma lista de bugs conhecidos.

 NOT compatable with Internet Explorer

Pilha de tecnologia

• Python 3.9
• Django 3.2.8
• Bootstrap CSS 5.0.2
• Bootstrap JS 5.0.2
• jQuery 3.5.1
• Fontawesome 5.15.1
• Google webfonts
• API de tela

Implantando

Existem vários recursos para implantar aplicativos Django. Uma das plataformas mais simples é o Python em qualquer lugar, que possui uma camada gratuita. Eu recomendo este por causa de quão direto é.

Implantando no servidor local:

• Clone uma cópia do projeto
• Usando o VENV, crie um ambiente virtual para o projeto
• Inicie o ambiente virtual e use o "requisitos.txt" para instalar todas as dependências necessárias, incluindo a versão do Django em que este projeto foi construído.

 NOTE: From this point, all commands should be run while working in the virtual environment you created

• No prompt de comando/terminal, certificando -se de que você está trabalhando no ambiente virtual, navegue até a pasta que contém o projeto
• Crie um arquivo na pasta do programa, "PaintApp", chamado ".env"

 NOTE: This next step only works on Python 3.6 or higher:

• A partir do prompt de comando/execução do terminal:
  • python -c "import secrets; print(secrets.token_urlsafe())"
• Isso gerará uma chave secreta para o projeto
• Copie a chave secreta recém -criada, aberta .env em um editor de código/texto e adicione a seguinte linha (as citações parecem opcionais):
  • SECRET_KEY='*your_secret_key_here*'
• Salve e feche o arquivo .env
• Execute os seguintes comandos para criar e configurar o banco de dados:
  • python manage.py makemigrations
  • python manage.py migrate
• A configuração de uma conta de administrador ou superusuário é bastante direta na documentação. Árbitro para o seguinte link para passo a passo
  • https://docs.djangoproject.com/en/3.2/intro/tutorial02/#creating-an-admin-user
• Agora você deve estar pronto para lançar sua cópia local!
• Execute o seguinte comando
  • python manage.py runserver

Implantando em python em qualquer lugar:

As instruções de Python em qualquer lugar são muito detalhadas e devem ser suficientes para ajudá -lo a colocar uma cópia em funcionamento.

• https://help.pythonanywhere.com/pages/deployexistingdjangoproject/

Sobre o desenvolvedor

Perfil do LinkedIn

Estou me interessando pela codificação desde o ensino médio, nos dias da AOL, geocidades e angelfire. Passei alguns anos como designer gráfico e desenvolvedor da web, trabalhando principalmente no WordPress para o meu desenvolvimento na web. Recentemente, decidi mudar para o desenvolvimento de software e trocar de carreira. Concluí o curso de pilha completa do Python no coding dojo, ganhando uma faixa preta do meu projeto final que pode ser visto aqui:

• Agendador de turno do hospital de ER veterinário

Eu construí este aplicativo de pintura para um evento de contratação do JR Dev Hackathon através do Mintbean. Para saber mais sobre como eu criei este aplicativo, o processo que passei e os desafios que tive que resolver, visite a página de destino da demonstração.

ATUALIZAR

Os resultados foram publicados e o projeto me rendeu a Mintbean Star Award. Para ver isso, acesse https://hire.mintbean.io, procure meu nome e veja os detalhes do Projeto 1

Saúde!

A tela de demonstração captura

Controles básicos

Salvar, editar e excluir

Vista e perfis da galeria