adam505hq commented 3 years ago

Description

Harmony Dapp Template to encourage newcomers and web2.0 developers to participate and play around in sandbox environment with possibility to build upon and deploy to testnet. This can be potentially used on future Hackatons to speed up creation of projects.

Context

The purpose of this bounty is to answer "How do I start developing on Harmony?" by extracting most essential elements of DApp project and including them in template as well as providing simple interface to deploy and test their application locally.

What matters here is simplicity and intuitive interface as well flexibility so that the template can be expanded and built upon. We want to encourage people to try to code on Harmony as well as provide easy to use sandbox for web2.0 developers.

Acceptance Criteria

MUST: Create template repository that will include:

[ ] UI/UX React boilerplate code for DApp
- [ ] Simple UI with Home Page
- [ ] Connection to as many popular wallets as possible
- [ ] Simple interaction with demo contract (see below)
- [ ] Tests for UI/UX application
[ ] Smart contract:
- [ ] Something simple but more than Hello World so that it can interact with UX/UI
- [ ] Tests
[ ] Development environment (CLI):
- [ ] CLI command to create sandbox env for both contract (Galache) and UX/UI (React) so that it can run on localhost.
- [ ] CLI command to deploy contract to testnet/mainet.
- [ ] CLI command to run tests for both contract and UX/UI.
[ ] README:
- [ ] Installation guide (any dependencies etc.)
- [ ] Basic usage on how to run and interact with template.
- [ ] Document CLI.
- [ ] Provide extra resources and "kickstart" documentation links for developers.
- [ ] Document how to deploy React application (simplified).

NICE-TO-HAVE:

[ ] Would be nice to use tool like cookiecutter to make template customizable with Author, App Name, Software Versions, Tags, Logos and other things that might be non-static.
[ ] Include CI workflow (probably easiest to use git workflow) to run test on push.

NOTES:

Important that user will be able to iterate through: deploy locally > play around > change code > deploy locally...
Stick to web3.0 good practices to expose user to best quality code right from the start, keep good project structure.
The purpose of demo contract and UX/UI interaction is to showcase to user how this is done. The contract should be simple enough just to give idea of how DApp works and how UI calls contract function.
Don't use unmaintained dependencies, this is suppose to last.
Readability and simple interface is very important.
I am not web3.0 developer so I might not know and might have missed something but I hope that general idea is clear. I am sure that most of web3.0 devs already have some kind of templates and include their useful tools in their boilerplate code so feel free to include something extra as long as it's useful and doesn't complicate the template too much.

Useful Links / Examples:

* Remember we want to be Harmony first and make sure everything works on Harmony :)

Reward

This should take ~40-60h to complete with quality. $2500 in ONE tokens.

DylanCkawalec commented 3 years ago

" SmartPress" - The word press for building Smart Contracts: I love the idea. In theory, I already see this being used by many beginners. Many coaches and mentors would let students play with this application to send fake money to their friends in a Local Network.

I support this project, mainly because I know how critical of a promotional tool education program's can become. All of my students would be asked by me to play with this application to try to test their new business ideas in a Smart Contract Sandbox that is supported by the "Fastest and most efficient blockchain". Tell that to 1000 new comers, and you have yourself an empire of developers.

I think this can be a great application for people to use. I know that the biggest issues new Blockchain developers have is deploying the right commands in accordance to their Operating System. Depending what your workstation supports, the testnet will either launch or fail, even though the documentation you read online says otherwise. That's because there is no 1 way of doing any development on the Web 3.0 yet; and there's too many resources that don't specify where one should have started in order to utilize the information they are viewing.

This stops development from even occurring, or, it delays the process.

So how about get everyone up to speed on the same level where they can then code with confidence without troubleshooting the car to begin the race.

secretnamebasis commented 3 years ago

This seems pretty cool.

I was thinking to myself today that I wanted to get into Harmony development because I couldn't find what I was looking for on the Harmony Network.

And so now I am doing my best.

gitcoinbot commented 3 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

This issue now has a funding of 39461.0525 ONE (2531.43 USD @ $0.06/ONE) attached to it.

If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
- Want to chip in? Add your own contribution here.
- Questions? Checkout Gitcoin Help or the Gitcoin's Discord
- $2,026,389.78 more funded OSS Work available on the Gitcoin Issue Explorer

gitcoinbot commented 3 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

Work has been started.

These users each claimed they can complete the work by 2 weeks, 1 day from now. Please review their action plans below:

1) mikyr has started work.

Crear proyectos educativos y auto sustentanbles 2) fine-lines has started work.

Code / template generation. 3) jotagep has started work.

Harmony dapp template

Frontend App: React
Contracts: Hardhat
Testing: Jest & Ganache
CI: Github Actions

Learn more on the Gitcoin Issue Details page.

gitcoinbot commented 3 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

Work for 39461.0525 ONE (2580.91 USD @ $0.07/ONE) has been submitted by:

Learn more on the Gitcoin Issue Details page
Want to chip in? Add your own contribution here.
Questions? Checkout Gitcoin Help or the Gitcoin's Discord
$1,909,495.60 more funded OSS Work available on the Gitcoin Issue Explorer

touhonoob commented 3 years ago

Made a MVP here: https://github.com/scaffold-harmony/generator-scaffold-harmony I will polish the project then try to create a demo later.

touhonoob commented 3 years ago

Demo Videos of my submission:

Intro: https://youtu.be/RThMOFCN-0M
Auto-reload: https://youtu.be/2iEv3VrNLjA

adam505hq commented 3 years ago

Demo Videos of my submission:

* Intro: https://youtu.be/RThMOFCN-0M

* Auto-reload: https://youtu.be/2iEv3VrNLjA

@touhonoob Thank you for your submission. We will check that out in upcoming days.

vikramIde commented 3 years ago

https://youtu.be/RThMOFCN-0M

good job bro

touhonoob commented 2 years ago

Released 1.2.0: https://youtu.be/Wd6NLh5gf04

jotagep commented 2 years ago

I submit my solution a few days ago https://github.com/jotagep/harmony-dapp-template

Demo video here: https://youtu.be/ys7dtz1YvpM

I hope you like it 😉 Thanks guys

toniton commented 2 years ago

Nice work @jotagep! Tutorial is on-point too. 😍

A few suggestions:

Is it possible to put the generators in the master branch. (E.g. User clones the repository and run a command such as yarn build to generate the base skeleton of the project). My assumption is that when this is published, using the generator would be the most preferred option.

There could be more clarity if the folder structure was arranged similar to below format:

harmony-dapps-scaffold
├── ...
├── .generator/.                # config files for the generators being used...
├── docker/.                    # docker environment config files...
├── bin/.                       # miscellaneous, init .sh scripts...
├── src/.                       # build files generated by the generator...
│   ├── frontend/
│.  └── hardhat/
├── packages/.                  # the template/skeleton files to be replaced by the generator...
│   ├── frontend/
│.  └── hardhat/
├── ...
└── package.json

Perhaps .vscode, .editorconfig could be added to .gitignore and removed from the tracked files in git.

toniton commented 2 years ago

Great job! @touhonoob Simple and straightforward. 👏

You may consider:

It would be helpful for a newbie, if you could add some form of transcript in the demo video, indicating what actions are currently running. (some background music if you want to be fancy too)
There seems to be no clear way to create a build or generate the scaffold without going through NPM. It'd be nice to have an alternative incase NPM is down. Also, it would be easier for other developers to contribute and test without having to publish to NPM.
I get conflict package.json warning when running the command yo scaffold-harmony, it's not a critical one, but it got me lost for a few mins.
You can also update the README.md file, to include instructions on how to deploy/run the dapp manually.

givp commented 2 years ago

Winner selected and paid. Thank you all.

gitcoinbot commented 2 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

The funding of 39461.0525 ONE (4513.00 USD @ $0.12/ONE) attached to this issue has been approved & issued to @jotagep.

Learn more on the Gitcoin Issue Details page
Questions? Checkout Gitcoin Help or the Gitcoin's Discord
$3,918,215.81 more funded OSS Work available on the Gitcoin Issue Explorer

harmony-one / bounties

scaffold-harmony: DApp Template / Sandbox enviroment. #53

Description

Context

Acceptance Criteria

Reward