In this tutorial, we will build a Rock-paper-Scissors Dapp. Two players, Alice and Bob, can bet on the outcome of the match. We will start from scratch and gradually improve the functionality of the application. You can copy the entire code of a program and see how it works; You can also type in each line of code yourself so that you become familiar with the Reach language and each part of the program. Start by creating a file named index.rsh. The file can be placed anywhere, but we recommend placing it in the current directory, ~ /reach/tut. In all subsequent code examples, we will name the file after the chapter number of the current tutorial. For example, enter the following in index. RSH: tu-2 /index. RSH

1 'reach 0.1';
2
3 export const main =
4  Reach.App(
5    {},
6    [Participant('Alice', {}), Participant('Bob', {})],
7    (A, B) => {
8      exit(); });
Copy the code


You can click export, const, exit to see the documentation.

Did you notice the link tut-2/index.rsh at the top of the code sample? You can click these links to go to Gitee to see the full file.

Does your text editor recognize index. RSH as a Reach program and display the appropriate syntax prompt? If not, access the extension support in the IDE/ text editor or manually configure the plug-in to treat the Reach (.rsh) file as JavaScript.

This is just the infrastructure of the Reach application, and it doesn’t do much, but it has some important parts.

  • Line 1 indicates that this is a Reach program. Always write it at the top of each program.
  • Line 3 defines the main output of the program. At compile time, the compiler looks at this.
  • Line 6 specifies two participants in the application: Alice and Bob.
  • Line 7 binds the Reach identifiers (A and B) to these participants and defines the body of the program.

Before going any further, let’s create a similar shell for our JavaScript front-end code. Create a new file named index.mjs with the following code: tu-2 /index.mjs

1  import { loadStdlib } from '@reach-sh/stdlib';
2  import * as backend from './build/index.main.mjs';
3 
4  (async() = > {5    const stdlib = await loadStdlib();
6    const startingBalance = stdlib.parseCurrency(10);
7  
8    const accAlice = await stdlib.newTestAccount(startingBalance);
9    const accBob = await stdlib.newTestAccount(startingBalance);
10 
11   const ctcAlice = accAlice.deploy(backend);
12   const ctcBob = accBob.attach(backend, ctcAlice.getInfo());
13 
14   await Promise.all([
15     backend.Alice(
16       ctcAlice,
17       {},
18     ),
19     backend.Bob(
20       ctcBob,
21       {},
22     ),
23   ]);
24}) ();// <-- Don't forget these!
Copy the code


You can click parseCurrency, NewestAccount, or Deploy to view the documentation.

The main structure of this JavaScript code will be used in all subsequent tests.

  • Line 1 imports the Reach standard function loader.
  • Line 2 imports the back-end code, which passes./reach compileIs generated.

  • Line 4 defines an asynchronous function, which is our front-end entry function.
  • Line 5 loads the standard library dynamically based on the REACH_CONNECTOR_MODE environment variable.
  • Line 6 adds 10 tokens as the initial balance for subsequent transfers.
  • Lines 8 and 9 create a test account with 10 tokens for Alice and Bob. This applies only to the developer test network provided by Reach.
  • In line 11, Alice deploys the application.
  • Line 12 appends Bob to the application.
  • Lines 15 through 18 initialize the back end of Alice.
  • Lines 19 through 22 initialize Bob’s back end.
  • Line 14 waits for the back end to complete.
  • Line 24 calls the asynchronous function we defined.

Now we are ready to compile and run our program. Enter $./reach run to run reach builds and starts the Docker container for the application. The application does nothing, and you just see a lot of diagnostic messages.

When you start the next tutorial, automate the scaffolding for creating REACH by running $./ REACH init!

In the next step, we will implement rock-paper-scissors logic! A prototype of our app will be built!

Do you know? : When you write a DApp using Reach, you should

  1. Write smart contracts with Solidity, write JavaScript backends with Ethereum SDK, write front ends with JavaScript, then test and deploy with Reach; or
  2. Write programs in Reach that generate smart contracts and JavaScript back ends and front ends, and then use Reach to test and deploy?

Answer: Reach trims the details of the consensus network.

Previous: 2.1 Installation and Initialization

2.3 Rock paper Scissors