Paas open-source off-chain libraries, web3 UI components to build dApp transactions (TXs) with free Paas APIs

[GENERAL] Name and surname of main applicant

Thang Tran

[GENERAL] Are you delivering this project as an individual or as an entity (whether formally incorporated or not)

Individual

[GENERAL] Please specify how many months you expect your project to last (from 2-12 months)

8

[GENERAL] Please indicate if your proposal has been auto-translated into English from another language

No

[GENERAL] Summarize your solution to the problem (200-character limit including spaces)

Develop, publish typescript libraries, React web3 components at off-chain side to build, submit TXs with free, available smart contracts on Paas for building dApps or upgrading web2 to Cardano web3.

[GENERAL] Does your project have any dependencies on other organizations, technical or otherwise?

Yes

[GENERAL] If YES, please describe what the dependency is and why you believe it is essential for your project’s delivery. If NO, please write “No dependencies.”

We intend to use below open-source dependencies from Cardano ecosystem: https://github.com/Emurgo/cardano-serialization-lib, https://github.com/MeshJS/mesh, https://github.com/spacebudz/lucid, https://github.com/StricaHQ.

[GENERAL] Will your project’s output/s be fully open source?

Yes

[GENERAL] Please provide here more information on the open source status of your project outputs

MIT license.

Public gitHub repo: https://github.com/bWorksApp/paas

Public shared documents.

[METADATA] Horizons

Developer Tools

[SOLUTION] Please describe your proposed solution

We have completed technical milestones, deployed Catalyst project 1100097 PAAS MVP for smart contract developers to publish, provide free compiled smart contracts as JSON objects through APIs at: https://paas.bworks.app/web. There are already several published Aiken, Plutus smart contracts on PAAS MVP with various signature, string, number and time validators ready to use.

This proposal continues our F11 PAAS project by developing open-source typescript off-chain libraries, React components as web3 UIs that integrate with PAAS APIs for dApp developers to build smart contract transactions (TXs) via internet as below:

const lockTx = await paasLib.lock({wallet: 'connectedWallet', contract: 'paasContractId', assetPolicy: 'assetPolicy', amount: 'assetAmount', datum: 'datum'})

const unlockTxHash = await paasLib.unlock({wallet: 'connectedWallet', lockedUtxo: 'lockedUtxo', receiverAddress: 'receiverAddress', redeemer: ''redeemer})

The project to result out published open-source libraries, components on public NPM package registry for others can use freely via Yarn add, NPM install with below details:

Off-chain library functions

• Build, sign and submit a TX with available smart contracts on PAAS.
• Record submitted TX metadata, error message to PAAS API.
• Get locked UTXO, contractId to use for unlocking a locked TX.
• Utils, validations around Cardano smart contract subject.

React components

• Connect installed wallet.
• Lock asset to a smart contract.
• Unlock asset from a locked UTXO.
• Mint asset token with smart contract.

Features

• Sign TX by installed wallet.
• Tracking TX metadata, error message via the web and APIs.
• Support Plutus V3, Conway era and contract mint policy. Up to date nodeJs, React and Cardano node versions.
• WASM packing with webpack, vite.

Language

Typescript (javascript), the popular language to develop web frontend, mobile apps.

Diagram

Demo

https://www.youtube.com/watch?v=lxcB5J475hU

Users

dApp developers, researchers and learners.

Conclusion

As a result others can use these open-source libraries, components with free and available smart contracts on PAAS to build dApp similarly to building web2, migrate existing web2 to Cardano web3 by including web3 React components into current projects. This benefits community at some level.

[IMPACT] Please define the positive impact your project will have on the wider Cardano community

Benefits when building dApps with these off-chain libraries, web3 components:

• Have open-source and free solution with off-chain libraries, dApp UIs, free smart contract to build dApps or migrate existing web2 to Cardano web3.
• Build web3 like web2 with lower time, human cost. Keeping programing mindset, code style.
• Intuitive, realtime tools to track dApp TX submission status, error message on the web.
• Improving developer experience, accelerating dApp adoption and grow TXs.

Share the outputs: the developed libraries, components are open-source and published to public NPM registry for community can use to develop dApps or reuse source code.

Measure the impact: Number of downloads from NPM registry, number of TXs built by the libraries, components monitored on Paas report.

[CAPABILITY & FEASIBILITY] What is your capability to deliver your project with high levels of trust and accountability? How do you intend to validate if your approach is feasible?

Team capacity 

We are a team that building Paas platform and its free smart contracts consists experienced members in various domains:

• Cardano web3, smart contract developers.
• Backend, frontend software and Cardano DevOps developers.
• Community, social marketing people.

Cardano projects

• bWorks - The seamless Cardano smart contract, web3 HR platform. App gitHub, contract gitHub.
• cReport - The Catalyst community analytic application. GitHub
• PAAS MVP: Catalyst milestone report, app gitHub, Plutus smart contract gitHub, Aiken smart contract gitHub.

Process and report

• Document with function, task list and acceptance criteria for each function/feature. 
• Development and deployment to public github repo and demo URL.
• User guide for community and reviewers to verify the functions, features.

The evidences of works

• Shared google docs task and checklist.
• Github commits.
• App screenshots, deploy code url, video demo.

[PROJECT MILESTONES] What are the key milestones you need to achieve in order to complete your project successfully?

Develop off-chain typescript libraries for dApp transaction

Time: month 01-02, 25% of project works

Milestone outputs

Develop typescript off-chain library with below functions:

• Fetch available smart contract from PAAS APIs to build lock, unlock and mint asset transactions.
• Connect installed wallet then submit transaction to Cardano blockchain.
• Record transaction metadata to PAAS API when lock.
• Get locked transaction UTXO to unlock asset from smart contract.

Acceptance criteria

• Can use the libraries to build smart contract lock, unlock and mint asset TXs with Paas contractId without error.
• The libraries functions return TxHash or error message if the transaction is failed.
• Libraries worked with no error, acceptant latency.

Evidence of milestone completion

• Google docs task list, user guide.
• Recorded screenshoots, demo youtube video.
• Github commits.

Develop web3 components use for dApp to submit transactions

Time: month 03-04, 25% of project works

Milestone outputs

Develop below React component:

• Connect installed wallet component.
• Lock asset to smart contract component.
• Unlock asset from smart contract component.
• Mint asset token component.

Acceptance criteria

• React components works as expected to connect wallet, lock, unlock and mint transactions without error.
• Javascript, typescript project can use these components to make smart contract transactions.
• Components worked with no error, acceptant latency.

Evidence of milestone completion

• Google docs task list, user guide.
• Recorded screenshoots, demo youtube video.
• Github commits.

Develop APIs

Time: month 05, 15% of project works

Milestone outputs

Develop and deploy APIs:

• Record (post) transaction metadata for smart contract lock transaction.
• Return (get) the UTXO use for smart contract unlock transaction.
• Utils around smart contract transaction subject e.g parse contract address, wallet public key hash and validations.
• Get contractId from a locked UTXO use for unlock TX.

Acceptance criteria

• Users can post, get data through APIs and the APIs return valid data.
• The APIs work fast, lesser than 2 seconds through internet.
• APIs worked with no error, acceptant latency.

Evidence of milestone completion

• Google docs task list, user guide.
• API endpoint URLs for community to try.
• Screenshoots recorded the APIs test, demo youtube demo.
• Github commits.

Develop dApp examples for demo

Time: month 06, 15% of project works

Milestone outputs

Develop and deploy 04 examples that use library in milestone-1 and components in milestone-2 with some typical Aiken and Plutus smart contracts:

• Build and submit smart contract lock and unlock transactions.
• Mint asset token transaction with smart contract.

Acceptance criteria

• Examples are developed and deployed with public URLs.
• User can build and submit smart contract TXs on Cardano mainnet.
• Examples worked without errors and acceptant latency.

Evidence of milestone completion

• Google docs task lists, user guide.
• Public URLs for community user to try examples.
• Recorded screenshoots, demo youtube video.
• Github commits.

Publish libraries and components to NPM registry for dApp can use via NPM install or Yarn add. Build community and support

Time: month 07-08, 20% of project works

Milestone outputs

• Publish libraries, components NPM registry so developer can add them to project via NPM install or Yarn add.
• Communicate the project via Cardano community telegram, discord to build community.
• Create social channel twitter(X), youtube, telegram for user to update information and support.
• Close out report.

Acceptance criteria

• Libraries, components are packed and published. User can get packages with NPM install or Yarn add.
• User can build dApp TXs, migrate web2 to web3 with libraries, components.
• Project is communicated to Cardano community, Twitter, Youtube. Created social channels to support users.
• Close out report is submitted.

Evidence of milestone completion

• Google docs checklist, user guide.
• NPM registry urls to download libraries and components.
• Recorded screenshoots, demo Youtube video, Communicated messages on social channels.
• Github commits, release tags.

[RESOURCES] Who is in the project team and what are their roles?

1.Thang Tran - full stack, smart contract & web3 engineer.

GitHub: https://github.com/saigonbitmaster, https://github.com/bWorksApp

Responsibilities: engineering management, smart contract, web3 developer, full stack developer. 

2-David do - professional social marketing and community manager

https://www.linkedin.com/in/david-do-0bb52b283/

Responsibilities: Promotion, user acquisition and community engagement. 

3-Thang Vu - senior software and web3 developer.

https://github.com/vmthang 

Responsibilities: smart contract, web3 developer, full stack engineer.

4-Thanh Nguyen - senior full stack engineer

https://www.linkedin.com/in/congthanh-nguyen-b152361a0

GitHub: https://github.com/makotovnjp

Responsibilities: full stack engineer.

5-Oanh Ngo - experienced QA/QC.

https://www.linkedin.com/in/oanh-ngo-06b331100

Responsibilities: QA/QC test, report.

6-Chuong Pham - senior devOps, experienced Cardano engineer.

https://github.com/jackchuong 

Responsibilities: Cardano CLI scripts, web3 dev, build tools.

7-Dung Phan - senior devOps, experienced Cardano engineer.

https://www.linkedin.com/in/phan-d%C5%A9ng-6682b5245/ 

Responsibilities: dApp deployment. Library, web assembly packing and publishing.

[BUDGET & COSTS] Please provide a cost breakdown of the proposed work and resources

Total cost 115k Ada, equivalent to 40k $ at Ada price ~0.35$. Average 120 Ada per a work hour for estimated total 958 work hours.

Milestone-1: Develop off-chain typescript libraries for dApp TXs

25,000 Ada for estimated 208 work hours.

Milestone-2: Develop web3 components use for dApp to submit transactions

25,000 Ada for estimated 208 work hours.

Milestone-3: Develop APIs

20,000 Ada for estimated 167 work hours.

Milestone-4: Develop dApp examples for demo

20,000 Ada. Estimated 167 work hours.

Final milestone: QA/QC and fix bugs. Pack, publish libraries, components to NPM registry. Build , support community. 

25,000 Ada. Estimated 208 work hours.

[VALUE FOR MONEY] How does the cost of the project represent value for money for the Cardano ecosystem?

The use of requested budget

We use budget to develop off-chain library, web3 components and communicate project to community as described in milestones.

The return of funds

Published open-source libraries, components to build dApp easier with free smart contracts, this accelerate dApp adoption, attract existing web2 projects migrate to Cardano web3 and developers from web2 background to build Cardano based dApps. These make positive impacts to Cardano ecosystem.