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

[briwylde08]

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]

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

[briwylde08]

Fantastic!

[pius]

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

[briwylde08]

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]

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:

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

[Julian-dev28]

@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]

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:

1. motivate the tutorial with a user/job story
2. stand up a simple Soroban contract to accomplish it on-chain
3. create a dapp and connect it to the contract
4. 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
5. 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]

@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]

I think it means a lot Elliot! Ok @pius, I've created a new issue with this prompt here: #655. Can you comment over there? Thank you for the conversation!!

[Myestery]

@briwylde08
I'll like to take over this issue as the initial submission has been moved

[briwylde08]

@messiisgreat, hello are you still working on this issue? Thanks in advance for your response!

@Myestery, let's give our original assignee a chance to respond.

[Myestery]

@briwylde08 I'll like to start this since the original owner hasn't responded after 2 days

[briwylde08]

Hi @Myestery! Thank you for another great contribution! Your submission is eligible for $700 worth of XLM. I assume your previously submitted information is still accurate?

[Myestery]

Hi @Myestery! Thank you for another great contribution! Your submission is eligible for $700 worth of XLM. I assume your previously submitted information is still accurate?

yeah, same thanks