React Web3 Dapp Development

Job ID: 36241410

Budget: $30 – $250 USD

Project Title: React Web3 Dapp Development

Project Description:
We are seeking a skilled freelancer to develop a React Web3 Dapp into an existing React template we have (https://tinyurl.com/mstrx4wv) that will allow us to accept crypto payments for documents that we are selling.
The Dapp will need to integrate WalletConnect on the BSC network and support payments in BUSD, USDC, DAI, or BNB.
The Dapp will also need to perform POST calls to our backend when is required and display the result on the frontend according our needs.

Scope of Work:
Web3 Connectivity: The freelancer will create and integrate Web3 connectivity using WalletConnect (Web3Modal 2.2.1 with wagmi) on the BSC network on an existing React template.
Crypto Payment: The freelancer will add support for crypto payments in BUSD, USDC, DAI, or BNB and detect successful transactions within the Dapp.
POST Calls: The freelancer will perform POST calls to our backend after a successful transaction or action requested and parse the result to display it on the frontend.
Download Documents: The freelancer will allow users to download purchased documents one by one and a button that allow download all as a zipped file.

Wallet Connected/Disconnected Indicator:
- Wallet Disconnected: When Not Connected to Dapp: We only show HOME link at top, and on main page we show a CONNECT WITH WALLET on landing page * and a multistep form
- Wallet Connected: HOME (the same as not logged), PROFILE, API, DOCUMENTS, LOGOUT*
* We will leverage the login/logout state with the web3modal button.

HomePage to Dapp Form Workflow:

Step 1: Call to Action Page
[Get Started button]

Step 2: Article and Keyword Quantities
Phrase: "Articles Qty:"
Phrase: "Keywords Qty:"
[Next button]

Step 3: Payment Method //See Notes.
Phrase: "Payment Method:"
Crypto: BUSD, USDC, DAI, or BNB
Credit Card: (Temporarily Disabled)
[Next button]
//Notes: Look and feel for the 5 Payment Choices should be like https://tinyurl.com/fs8wp2tw

Step 4: Wallet Connection, Payment and Backend Query
Phrase: "Connect your crypto wallet to proceed"
Upon successful wallet connection, display phrase: "Payment accepted"
Query backend and get result
Display the result along with buttons to download articles
Include a link to restart the process if needed.

+ Profile: User will be able to enter email address for notifications.
+ Api: Show api key and simple api documentation text (provided by us)
+ Documents: The freelancer will allow users see the documents created on a list and allow view and download the details for each one.

* We will provide the backend api endpoints to query for each page.

Timeline:
The project is expected to take approximately 4-6 hours to complete, and we would like to have it completed today if possible.

Payment Terms:
No crypto or payment in advance
The payment for this project will be escrowed on freelancer platform upon the completion of the project and testing.
The freelancer will be paid in full upon successful completion of the project and testing.

Terms:
The freelancer will provide regular progress updates throughout the project.
The freelancer will adhere to our requirements and specifications.
The freelancer will adhere to all agreed-upon deadlines and milestones.
All intellectual property developed as part of this project will be owned by our company.
Confidentiality of work and project shall be agreed upon by chosen freelancer.

Please Mention in your response (so we know you read the entire project details): Web3 Rally Time!
Related categories: Bootstrap React.js Blockchain Next.js Web3.js