Show and tell | ReactiveDOT × PAPI

Tech Talk
1

Hi all :wave:,

I’m the author of Reactive DOT, and I’ve been hard at work building it with the support of two proposals: #812 and #948.

My first goal (out of many) for the upcoming weeks is to:

  1. Finalise the first set of production-ready public APIs.
  2. Test their performance, efficacy, and developer ergonomics.

To achieve these goals, I need a real-world application with real-world hands-on usage :thinking:.

Dogfooding my own work, I quickly put together this nifty little application last week, showcasing Reactive DOT and PAPI capabilities:

It’s a developer console, similar to the PJS app, but instead powered by:

  • The heart/engine: PAPI
  • The state management/FE interfaces: Reactive DOT
  • Additionally, one small UI library for managing wallet connections: DOT Connect

Features include

Minimalistic statistics & blocks viewer

image
image1920×1092 133 KB

Wallet connection

image
image2994×1720 295 KB

Storage, constants & runtime APIs querying

image
image3024×1720 386 KB

Extrinsic builder

From simple remarks to full-blown XCM.

image
image3023×1719 230 KB

Final remarks

I’m hopeful that this DApp, along with its source code, demonstrates how lightning-fast and simple it can be to develop a DApp with now future-ready tools.

I’m looking forward to receiving feedback and hearing about your personal experiences when using Reactive DOT :pray:.

For those not quite ready to test out Reactive DOT, I still recommend using PAPI anyway for all future projects and migrating any existing ones over from PJS if possible. It :clap: really :clap: is :clap: that :clap: good

22 Likes
2

This is amazing.

I tried it out locally and it works right away: this is very high on Maslow’s hierarchy of needs for backend nerds like myself. Kudos on the great results and thanks for sharing the write-up and demos!

Do you think it would make sense to link to your products and libraries here: Polkadot Developer Portal · Polkadot Wiki ? This will help with visibility and ranking. Instead of adding it to the list here I recommend making a specific page for Dapps/Building blocks that developers can leverage, and add a GitHub badge to show that it’s being updated etc.

I think DOT Connect is key to enable application builders to get started quickly. Connecting wallets to Dapps should be as smooth as possible and a 5 minute sort of integration effort.

1 Like
3

Thanks, @Karim, I’m glad that you find it useful :smile:.

I do believe being featured on Polkadot Wiki make sense and would definitely help with adoption! I’m assuming anyone can create a PR to it, or is there someone who I should contact regarding this?

1 Like
4

I think a PR would work best. :v:

@radha , @bader and @filippoweb3 are extremely helpful in this regard, I would start there in case you have any doubts or aren’t certain about the structure/name for the pages etc.

2 Likes
7

Super cool. One nice addition would be a beginner-level tutorial - how to build a simple web-wallet from scratch or whatever. Especially one which allows for parachain functionality.

8 Likes
8

Thank you, @gavofyork :pray:. Taking a note from Ethereum with Wagmi/Viem, tutorials are super valuable and are the main drive for new developers. I know that there are people like @tbaut who are well-versed in this area (developers outreach) and are keen to help out :muscle:.

4 Likes