Let’s create dApp together? The type of bag meeting! _ Neo column

By September 6, 2020DApps
Click here to view original web page at hellomynameiseril.tumblr.com

Non-Fungible Token the big trend of world. Don't missout this once of lifetime chance. The top showcase of ethereum is Decentralized Application, games like my crypto heroes brings the future to gaming industry.

Developing on Neo
In the last article “Developing on Neo”, Neo’s overseas columnist Luca Fuster shared his studying experience about dApp development, and initially tried to develop a calculator model that may multiply two numbers.
This short article will mainly cover the following points
-The development tool on Neo: neon-js repository
-The two basic elements of dApp development: smart contract and front-end
-The purpose of React language
On-chain dApp development
First, I take advantage of the neon-js on-chain tool, which is a JavaScript repository which allows calling, investing, and smart contract development. You will find it by searching neon-js github and finding the documentation site, as proven below:

image
Following the installation is complete, it will enter the two stages of dApp development, namely front-end and smart contract.

Starting from the front end, I need to use the JavaScript repository of the respond language and create a project template by means of create-react.app.
react is really a development device in line with the JavaScript programming language. Produced by Facebook to build consumer interfaces, also referred to as front ends. Essentially with it, you can see the visual results produced by this program in the internet browser.

To write smart agreements, I find the Python growth vocabulary. Enter the primary function, which only needs two parameters procedure, args and something operation Mul.

I actually moved the contract to neo-local to facilitate the compilation and deployment of the contract on the network. Then use the COZ password to open up the wallet and enter the sc assist command.
Now, I can see the following execution step: two instructions sc build and build work are provided.
sc build can be used to compile, and may convert files from programming language to the format that Neo Virtual Device can understand. Wise contracts have to be changed into awm files; build run would be to directly deploy the contract.

In this step, I was asked to point whether the deal uses storage space, dynamic calls, and fund. Since this contract does not need these, you merely need to enter False Fake False.
Furthermore, when entering COZ Github, I was able to enter the correct parameter type (in this case (0710 02)), and then deploy the contract, that ought to appear to be this:
COZ Github:

The very last step of the smart contract requires entering the password of the wallet, then copying and saving the Hash for later use. Here is the Hash I received:

At this point, my React task template has been completely downloaded, and I can continue front-finish design. I additional the neon-js library to the task and entered yarn begin.
In order to make this dApp perform multiplication, I created tables A and B with a default value of zero, and used Condition to shop their values:

To ensure that A and B to interact, I have to first create a form in which to enter information.
For the specific process, please refer to this tutorial

This is the end result:

Now it’s time to call the smart contract. Hook up to the neon-js library by importing the link below: import Neon from @cityofzion / neon-js.
Import link

Here, I need to enter the last group of variables and duplicate the Hash preserved before:

caution
When copying Hash, be sure to delete the 0x before it.
I call the script through rpc query invokescript.

image
The final result is as follows:

Finally, I need to test if the calculation action is valid through the console below and enter the worthiness to be multiplied. According to the good execution of the smart contract, these values ??should be able to end up being multiplied. Or even, a message will appear, giving us with the precise located area of the Mistake and the tips required to fix it:

This is the end of the preliminary attempt for dApp growth. Actually, there’s still a long way to visit complete a real dApp. I will continue to focus on studying the rules supplied in the neon-js repository: https://cityofzion.io/neon-js/, and make an effort to develop a real dApp without any help through continuous learning.
I hope everyone likes this series and may make full use of Neo’s development classes like me! ??
Past review
-Developer Xiaobai really wants to develop on the chain, do you think I even now have a opportunity? -
-NEP-5 contract development notes, live! Xiaobai can also learn-

Leave a Reply