Elemental ZEC – Zcash UI Component Kit and Payment Processor

Applicant background

Software Engineer with 5 years’ experience working in web and app development. Extensive expertise in building full-stack apps, design systems and server management; experienced with JavaScript and Java. Founder of open-source organization Elemental Design: https://github.com/elemental-design

Active member of the open-source community.

Contributor to:

  • airbnb/react-sketchapp – render React code to Sketch designs or component library
  • react-figma – render React code to Figma designs
  • lona/xd-file – Adobe XD file manipulation utility for Airbnb’s Lona
  • styled-components – one of the most-used React CSS-in-JS libraries
  • commaai/explorer – annotator for self-driving car video footage

Description of Problem or Opportunity

Building a Zcash app is time consuming and a lot of work needs to be done from scratch. Node.js integrations with a light client currently need to be done manually; there should be npm packages for this. This makes prototyping ideas and developing apps for Zcash harder. Also, there are currently no open-source solutions for a merchant to accept Zcash payments. There has been community interest in a BTCPayServer integration or fork that adds support to Zcash.

Proposed Solution

A set of open-source modular components and libraries for Zcash apps to use, including a minimal payment processor, compatible with BTCPayServer/BitPay API.

The main users initially will be developers of existing and new Zcash apps. There will also be some example apps which can be used by ZEC holders, such as a Zcash donation app with a confirmation message or action, together with a demo Point of Sale app.

Solution Format

Open-source, published to GitHub. React.js and Node.js component libraries published to npm.

Technical approach

Agile methodology making use of GitHub for project management (Issues and Projects), with weekly sprints.

Front-end components

  • Built with cross-platform React.js code: using @react-platform and elemental-react
  • Published as elemental-zec

Back-end components (payment processing, light client integration)

  • Node.js libraries, including:
    • a watch-only wallet for payment processing (elemental-pay, exposing a BitPay compatible REST API)
    • ZECpages and memo.cash protocol support; decode action codes and messages, and cache/expose via Postgres and REST API. These could be integrated into wallets

How big of a problem would it be to not solve this problem?

The absence of an open-source and self-custodial payment processor is a significant hindrance to Zcash adoption. Projects such as BTCPayServer have proved popular, even being used by companies like Tesla. There is also a high risk of developers duplicating work across Zcash applications, which would be solved by creating a common component library.

Execution risks

If a BTCPayServer fork is not ready by the project's completion, then the project may have to rely on a non-audited Node.js backend.

Developers of existing Zcash apps may be keen to stick with the frameworks/languages they use currently, so cooperation and outreach will be needed.

Unintended Consequences

Inexperienced developers could inadvertently introduce security holes while creating apps using the libraries, especially if working on payment processing apps; clear documentation will be needed to explain the risks of using certain approaches and the need for audits or using audited software for sensitive applications.

There could also be performance issues with popular apps using the libraries. Clear contribution guidelines will be needed, together with the ability to easily debug issues and benchmark performance to make it easy to implement optimisations.

Evaluation plan

Since the work will be on GitHub, repository stars, forks and community discussion in issues or GitHub Discussions will be useful metrics of usage. GitHub tracks usage of npm packages in open-source repositories, giving an insight into how many open-source projects are using the libraries. npm downloads can be tracked too. Community feedback can be collected via the Zcash forums, GitHub Discussions and Discord.

Schedule and Milestones

Total timeline will be 24 weeks (5.6 months). Weekly sprints with deliverables for milestones (GitHub and npm releases, together with demos). The first month of the project will start out with defining specifications for the full scope of the libraries and designs.

Budget

Development

Time Amount
Hourly Rate $100 / hr
Hours Per Week 21 hours
Number of Weeks 24 weeks
Total $50,400

Hosting

$57 / month (OVH Dedi) – $744 for 12 months

  • machine for development purposes (can be used to host a full node if light client isn’t sufficient), testing and demo apps.

Tipping

Tips Received
???  
ZEC

Campaign

Requested Funding
$51,144
Open for Public Review