Create a comprehensive frontend guide for building functional user interfaces for dapps (including everything from basic button logic to more complex frontend component logic)

stellar / stellar-docs

Documentation for Stellar

https://developers.stellar.org

Apache License 2.0

45 stars 101 forks source link

Create a comprehensive frontend guide for building functional user interfaces for dapps (including everything from basic button logic to more complex frontend component logic) #612

Open briwylde08 opened 1 month ago

briwylde08 commented 1 month ago

Get awarded: up to $1,000 worth of XLM Section: How-To Guides - Dapp Development: https://github.com/stellar/stellar-docs/tree/main/docs/smart-contracts/guides/dapps

The guide could include:

Introduction
- The role in frontend in dapps and how they interact with blockchain
- Explain the importance of user interface and user experience
Set up the development environment
- Walkthrough for setting up the development environment needed for dapp frontend creation, including frameworks and tools
Building the interface
- Detail the process for building basic frontend elements such as buttons, forms, and displays
- Explain the logic behind interactive components that communicate with smart contracts
Integrating with the blockchain
- Step-by-step instructions on integrating frontend components with the blockchain via smart contracts
Advanced component logic
- Explain more complex topics, such as handling state changes, updates based on blockchain events, and error handling

messiisgreat commented 4 weeks ago

@briwylde08 Hello How are you! I'd like to work on it

briwylde08 commented 4 weeks ago

Fantastic!

pius commented 3 weeks ago

@briwylde08 hi there! I’d like to do a terminal user interface (TUI) oriented version of this if there’s interest

briwylde08 commented 3 weeks ago

Hello @pius! Super glad you're interested. Can you help me understand a bit first how is your TUI is distinct from the existing Soroban CLI.

pius commented 3 weeks ago

sure thing @briwylde08! unlike the autogenerated CLI, this would be an interactive dapp, just meant to be served over ssh instead of http. sometimes a picture is worth a thousand words, so I whipped up a notional example:

soroban_tui

of course, it's possible to create arbitrarily sophisticated UI in this setting but hopefully this basic version clarifies things a bit!

Julian-dev28 commented 3 weeks ago

@pius awesome work so far!

Can you please tell me how this tool covers the prompt: "Create a comprehensive frontend guide for building functional user interfaces for dapps"

Would you be able to deploy dapps from the terminal?

pius commented 3 weeks ago

thanks @Julian-dev28!

most protocol ecosystems rightly have tutorials for creating dapps with web and mobile-app based frontends but few if any cover alternative frontends.

given that, it’d provide a unique advantage to our ecosystem to also have a comprehensive frontend dapp guide for building a functional user interface powered by a TUI framework instead.

here’s what that would look like:

motivate the tutorial with a user/job story
stand up a simple Soroban contract to accomplish it on-chain
create a dapp and connect it to the contract
guide the reader through using UI framework components to create a complete, functional user interface for the user with good affordances that accounts for latency and other practical concerns
finish with a working end-to-end dapp they can serve and deploy however they want

sure, a person can deploy their dapp from the terminal but more to the point, other users can access the dapp from the terminal!

ElliotFriend commented 3 weeks ago

@pius Thanks for answering our questions! I think you've described it pretty well, you've sold me on the idea. I'll give you my vote of approval (whatever that's worth lol). @briwylde08, @Julian-dev28 what do you think?

One question, though, and I'm only asking for the sake of my own curiosity hehe. You said:

... just meant to be served over ssh instead of http.

I'm curious what this means "mechanically." Is there some "backend" service that the TUI would interact with (assuming via SSH)? Or, is the TUI interacting directly with contract that's deployed on-chain (like if the TUI is itself building/simulating/submitting transactions, querying rpc, etc.; or maybe kinda like if someone made a "wrapper" around the Soroban-CLI to interact with a specific contract, if that makes sense)?

briwylde08 commented 3 weeks ago

I think it means a lot Elliot! Ok @pius, I've created a new issue with this prompt here: https://github.com/stellar/stellar-docs/issues/655. Can you comment over there? Thank you for the conversation!!