Tutorial De Como Programar SteemConnect Dsteem e API Steem Para JavaScript Parte 1
A documentação e os tutoriais que eu encontrei não pareciam amigáveis aos iniciantes, então estou compilando o trabalho que estou fazendo e o que estou aprendendo de uma maneira mais amigável.
Atualmente estou trabalhando em um projeto pessoal que usará/fará parte da blockchain da Steem. Embora eu tenha estudado engenharia de software, sou um programador HORRÍVEL e me sinto perdido com o que estou tentando fazer. Então, para revisar e acompanhar meu progresso e o que aprendi compartilharei o conhecimento aqui em novos posts conforme aprendo e evoluo, assim eu fixo o conteúdo que aprendi e talvez acabo ajudando alguém, ou alguém me aponta um jeito melhor de fazer as coisas.
Esta será uma série, então esta é a primeira aula, pois conforme eu aprendo mais vou compartilhar mais conhecimento.
Eu tive dificuldade em aprender o que estou ensinando aqui, então eu estou tentando mostrar de uma maneira que eu mesmo, no passado, poderia entender mais facilmente.
Além disso, o que eu estou ensinando pode acabar se mostrando apenas uma gambiarra, então, por favor, se você sabe algo a mais, algo que eu não sei, se eu esqueci alguma coisa ou você sabe como melhorar algo e quer compartilhar seu conhecimento, por favor por favor, por favor, comente o que você sabe e nos ajude a aprender juntos, agradeço desde já.
Importar as APIs para o documento HTML
Primeiramente, o documento HTML se parecerá como algo assim
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Adicione o código abaixo antes das tags de fechamento </ body> e </ html>, isso PODE ser redundante, atualmente estou estudando exatamente o que posso fazer com dsteem.js, steem.min.js e stemconnect, se você sabe algo a mais e quer contribuir, comente abaixo se isso for redundante e o que cada uma das APIs faz.
<script src="https://unpkg.com/dsteem@^0.8.0/dist/dsteem.js"></script>
<script src="https://cdn.steemjs.com/lib/latest/steem.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/steemconnect"></script>
ficará assim então
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script src="https://unpkg.com/dsteem@^0.8.0/dist/dsteem.js"></script>
<script src="https://cdn.steemjs.com/lib/latest/steem.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/steemconnect"></script>
</body>
</html>
Criando um app no SteemConnect
Este passo não é código. Você precisará ir para https://steemconnect.com/dashboard
Faça login no SteemConnect em uma conta com mais de 3 Steem (não é grátis criar um novo aplicativo)
Vá para "My Apps"
Clique em "New App"
Agora, o próximo passo criará uma conta Steem para o aplicativo, então você precisa ter em mente que, até onde eu saiba, você não poderá alterar o nome de usuário no futuro, se você estiver usando isso apenas para testes, isso não importa , mas se você quiser criar um aplicativo real, pense duas vezes antes de escolher um nome, pois ele tem um custo de 3 Steem (a criação da conta no Steem não é mais gratuita)
Agora vamos configurar o app, ele já foi criado e a conta foi paga
Aqui está o que cada configuração faz
App Name:</ b> o nome do seu aplicativo, não o nome de usuário, isso pode ser alterado a qualquer momento
App Description:</ b> sobre o que é seu aplicativo? Usos, etc., como um pequeno pitch sobre ele, como os da app store ou do Google Play, serão mostrados na loja de apps steem se você definir como visível
App Icon:</ b> não defini isso para o meu ainda, mas acredito que esse seja um URL do ícone ou da foto do perfil do seu aplicativo, corrija-me se estiver errado, não encontrei o tamanho ou especificações de formato
Website: </ b> na página inicial do seu aplicativo, se você não tiver um site não precisa preencher, coloquei http://127.0.0.1 antes de definir um domínio para o teste do meu projeto
Redirect URI(s):</ b> As URLs que o SteemConnect pode redirecionar após o login. Para evitar problemas de permissão no futuro, defini a página principal do aplicativo, a página de login e as páginas a seguir apenas em caso:
http: // localhost: 8080
http: // localhost: 3000
http://social-auth-steemconnect-demo.krzysztofszumny.pl
https://steemconnect.com/api/me
Allowed IPs:</ b> deixo isso em branco por enquanto, continuo estudando exatamente o que ele faz e atualizarei nos novos tutoriais no futuro
Manage the visibility of your application in SteemConnect App Store.:</ b> Eu recomendo deixar isso como "Not visible"(não visível) antes do lançamento para que as pessoas não vejam um aplicativo mal feito ou algo feio e tenham uma má primeira impressão antes do lançamento oficial
No próximo tutorial:
Por enquanto este já está demasiado grande.
No próximo tutorial, mostrarei como obter o URL de login do SteemConnect para seu aplicativo e como adicionar um botão de login do SteemConnect no arquivo HTML. Estou trabalhando para tornar o próximo tutorial conciso e direto, fácil de entender e mais prático do que a documentação que encontrei
Você sabia que eu rodo um servidor Witness (testemunha) da blockchain da Steem?
Como votar em mim:
Vá para o endereço
https://steemit.com/~witnesses
Desça a página até o finalzinho e encontre o campo abaixo
Insira meu nome "igormuba", sem aspas, e clique em "vote" para votar em mim.
MUITO obrigado. Vou ler com mais calma e ver o que daria para desenvolver com esse guia.
Ainda preciso adicionar mais coisa, estou estudando umas coisas que não entendi antes de fazer a parte 2, mas assim que entender irei digerir e colocar de um modo que, espero, até quem não entenda muito de programação possa criar algum aplicativozinho com a blockchain da Steem, passarei a noit hoje estudando e espero que amanhã consiga fazer algo entendível, pois ainda falta autenticar a implementar funcionalidades, mas a autorização e a instalação do SteemConnect no código é o primeiro passo
Boa @igormuba! Obrigado por trazer esse post para gente. Para quem não é dessa área, é uma dificuldade imensa entender, ainda mais em inglês. Um post desse nos ajuda até a divulgar a plataforma. Parabéns pelo trabalho!
Ainda preciso fazer vários mas por enquanto acho que só entendi perfeitamente a ponto de ensinar até aí, vou continaur estudando e trabalhando na API e condensar o que eu for entendendo melhor, espero que seja útil pra alguém como está sendo pra mim
@igormuba muito obrigado por este tutorial!! Já pesquisei bastante por tutorais destes e apenas alguns me ajudaram (com muita imaginação minha).
Estou a seguir ansioso pela continuação.
Obrigado mais uma vez, abraço
Valeu, eu estou estudando ainda pra preparar o próximo tutorial, acho que vou postar amanhã ou depois, até aí era a parte fácil, agora a próxima parte é mexer com a API de verdade