Hi! Let us guide you in starting and interacting with your first decentralized app (dApp) in NEAR: Hello NEAR.
Hello NEAR is a friendly dApp composed by two main components:
- A smart contract that stores and retrieves a greeting message
- A simple web-based frontend that displays the greeting and enables to change it.
Try Hello NEAR in Your Browser
A new browser window will open automatically with the code, give it a minute and the frontend will pop-up (make sure the pop-up window is not blocked).
Try Hello NEAR Locally
If you already have node installed, simply run:
Use the interactive menu to set up your first project folder.
Once the folder is ready, check the README! It will show you how to build your contract, deploy it, and start the frontend.
Interacting With Hello NEAR
Once the app starts you will see the screen below. Now go ahead and sign in with your NEAR account. If you don't have one, you will be able to create one in the moment.
Frontend of Hello NEAR
Once logged in, change the greeting and see how our Hello NEAR app greets you!
Structure of a dApp
Now that you understand what the dApp does, let us take a closer look to its structure:
- The frontend code lives in the
- The smart contract code is in the
- The compiled smart contract can be found in
- The account's name in which the contract was deployed is in
The contract presents 2 methods:
get_greeting. The first one stores a
String in the contract's parameter
message, while the second one retrieves it. By default, the contract returns the message
- 🦀 Rust
- 🚀 AssemblyScript
The frontend is composed by a single HTML file (
frontend/index.html). This file defines the components displayed in the screen.
The website's logic lives in
frontend/index.js, which communicates with the contract through
frontend/near-interface.js. You will notice in
/frontend/index.js the following code:
It indicates our app, when it starts, to check if the user is already logged in and execute either
When writing smart contracts it is very important to test all methods exhaustively. This project has both unit and integration tests. Before digging in their code, go ahead and execute them using the command
npm run test.
Unit tests check individual functions in the smart contract. They are written in the same language than the smart contract. If your contract is in Rust you will find the tests at the bottom of each
- 🦀 Rust
- 🚀 AssemblyScript
That's it for our first quickstart tutorial. You have now seen a fully functional contract with a minimal user interface and testing. Go ahead and check our examples or proceed straight to the Develop section to know how to write your own contract.
If you have any questions, do not hesitate in joining us on Discord. We regularly host Office Hours, in which you can join our voice channel and ask questions.