Remaining Balance


MetaCartel Dragon Quest - Create a 'create-react-app' clone for scaffolding apps on Ocean Protocol






Create a create-react-app clone for Ocean Protocol


1000 DAI equivalent OCEAN tokens at the time of reward distribution

How can you help?

  • We would like you to build a scaffold cli tool for spinning up a web app (just like create-react-app does) for Ocean Protocol. This cli needs to be build using Node.js and React.js.

  • Using this cli, a developer can spin up a demo react app which displays publishing and consuming features of Ocean Protocol.

Goal is to quick start development of dapps on Ocean Protocol with a couple of commands using this tool. You can use our react tutorial for publishing and consuming assets on Ocean Protocol as a reference.

  • This demo react app (when spun up using this cli) should have a minimal UI with nice layout. Here is the sample wireframes you can refer to - Wireframes for Quick Start App

  • Above wireframes can be used as reference and are not mandatory to be followed. However, do check out Minimum Requirements section for your submission to be qualified for the reward.

It should behave as per following -

npm i -g create-ocean-dapp

npx create-ocean-app my-ocean-app

cd my-ocean-app

npm start

At the end of above command, user should be able to see above react based simple UI spin up and ready to be customised. Sample layout and features for reference - Wireframes for this web app

  • Also, this tool should incorporate environment variables (via .env) for developers to choose to connect to Nile testnet or Pacific mainnet

What needs to be done?

  • Create a commandline tool using Node.js and React.js just like create-react-app
  • Users should be able to access publishing, serching and consuming in a web app after typing in 4 commands as shown above.
  • Proper tests are written

Minimum Requirements

  • CLI tool spins up a webapp that is minimal and code is properly commented and very easy to read and customise. This is important because that's the purpose of this bounty that other developers can use this as foundation to build dapps on Ocean Protocol.
  • CLI is written in Node.js and Web app is written in React.js
  • As shown in wireframes above, home page or welcome page allows users to Search in Ocean Protocol. And there is feature to Publish data into Ocean Protocol. Also, search results are displayed and users can Consume/Download search results after paying applicable Price in OCEAN
  • Pagination in search results in not required (to keep codebase to minimum)
  • Metamask is integrated and supported to sign txs for publishing and consuming
  • Instructions on CLI usage should be well written in README file of your project
  • webapp is configurable with .env to allow to choose to connect to Ocean's Nile test or Pacific Mainnet.
  • Your submission should be open-source

How to Submit?

  • Publish your submission into public Github repo with proper README describing how to usage of this cli tool.
  • Next, submit the link to this repo to the bounty.

Questions & Reviews

You can reach out to me for any queries via email to manan@oceanprotocol.com

6 monthsexpired
2 revisionsexpected





completed bounty as per requirement

reduced creating ocean protocol powered dapps to few commands(Three atmost to get server,client,contracts compiled)

More scripts are remaining to be added to make it one click whole environment setup,also few more tools to make life of developer easy

follow directions on github readme to get started
its not published yet on npm registry as there are already two create-ocean-dapp packages with conflicting name

Also I am working on adding ocean template for create-eth-app
You can follow developments here