updating

README.md

@@ -1,148 +1,55 @@
-# Guest Book JS Example
+# Guest Book 📖 
+[![](https://img.shields.io/badge/⋈%20Examples-Basics-green)](https://docs.near.org/tutorials/welcome)
+[![](https://img.shields.io/badge/Gitpod-Ready-orange)](https://gitpod.io/#https://github.com/near-examples/guest-book-js})
+[![](https://img.shields.io/badge/Contract-js-yellow)](https://docs.near.org/develop/contracts/anatomy)
+[![](https://img.shields.io/badge/Frontend-React-blue)](https://docs.near.org/develop/integrate/frontend)
+[![](https://img.shields.io/badge/Testing-passing-green)](https://docs.near.org/develop/integrate/frontend)
 
-## Overview
 
-Our Guest Book example is a simple app composed by two main components:
+The Guest Book is a simple app that stores messages from users, allowing to pay for a premium message.
 
-1. A smart contract that stores messages from users, allowing to attach money to them.
-2. A simple web-based frontend that displays the last 10 messages posted.
+![](https://docs.near.org/assets/images/guest-book-b305a87a35cbef2b632ebe289d44f7b2.png)
 
-## Installation & Setup
 
-To clone run:
+# What This Example Shows
 
-```bash
-git clone https://github.com/near-examples/guest-book-js.git
-```
+1. How to receive $NEAR on a contract.
+2. How to store and retrieve information from the blockchain.
+3. How to use a `Vector`.
+4. How to interact with a contract from `React JS`.
 
-enter the folder with:
+<br />
 
-```bash
-cd guest-book-js
-```
+# Quickstart
 
-To download dependencies run:
+Clone this repository locally or [**open it in gitpod**](https://gitpod.io/#/github.com/near-examples/guest_book-js). Then follow these steps:
 
+### 1. Install Dependencies
 ```bash
-yarn
+npm install
 ```
 
-or
+### 2. Test the Contract
+Deploy your contract in a sandbox and simulate interactions from users.
 
 ```bash
-npm i
-```
-
-## Building Your Smart Contract
-
-The Smart Contract consists of two methods available for the user to call.
-
-```javascript @call
-    // Adds a new message under the name of the sender's account id.
-    add_message({ text }) {
-        const message = new PostedMessage(text);
-        near.log(message);
-        this.messages.push(message);
-    }
-
-    @view
-    // Returns an array of last N messages.
-    get_messages() {
-        return this.messages;
-    }
-
+npm test
 ```
 
-A `call` method stores or modifies information that exists in state on the NEAR blockchain. Call methods do incur a gas fee. `Call` methods return no values
-
-A `view` method retrieves information stored on the blockchain. No fee is charged for a view method. View methods always return a value.
-
-`NearBindgen` is a decorator that exposes the state and methods to the user.
-
-To build your smart contract run
-
+### 3. Deploy the Contract
+Build the contract and deploy it in a testnet account
 ```bash
-yarn build
-
+npm run deploy
 ```
 
-or
-
+### 4. Start the Frontend
+Start the web application to interact with your smart contract 
 ```bash
-npm run build
+npm start
 ```
 
-This build script will build your smart contract and compile it down to a `.wasm` file, in this case named `contract.wasm`.
-
-Once you have built out your smart contract you can deploy it to a NEAR account using:
-
-```bash
-near dev-deploy build/contract.wasm
-```
-
-`dev-deploy` will create a new dev account on NEAR's testnet, and deploy the selected `.wasm` file onto it.
-
-The output should display the dev account name as follows.
-
-example:
-
-```
-dev-1659920584637-66821958258766
-```
-
-Once a smart contract has been deployed it must be initialized.
-
-Initialize This contract by running the following
-
-```bash
-near call <dev-account> init --accountId <your-account.testnet>
-```
-
-## Calling methods from terminal
-
-This will store the string `"hi user"` onto the NEAR blockchain using the change method defined earlier
-
-```bash
-near call <dev account> add_message '{"text":"hi user"}' --accountId <your-account-name.testnet>
-```
-
-This will return and display your stored message
-
-```bash
-near view <dev account> get_messages '{}' --accountId <your-account.testnet>
-
-```
-
-## Running Frontend
-
-To spin up the frontend run
-
-```bash
-yarn start
-```
-
-or
-
-```bash
-npm run start
-```
-
-From there you should be able to modify the greeting.
-
-## Run Tests
-
-This example repo comes with integration tests written in rust and assembly type script.
-
-To run tests run the following in your terminal:
-
-```bash
-yarn test
-```
-
-or
-
-```bash
-npm run test
-```
+---
 
-Integration tests are generally written in javascript. They automatically deploy your contract and execute methods on it. In this way, integration tests simulate interactions from users in a realistic scenario. You will find the integration tests for hello-near in integration-tests/.
+# Learn More
+1. Learn more about the contract through its [README](./contract/README.md).
+2. Check [**our documentation**](https://docs.near.org/develop/welcome).

contract/README.md

@@ -0,0 +1,79 @@
+# Guest Book Contract
+
+The smart contract stores messages from users. Messages can be `premium` if the user attaches sufficient money (0.1 $NEAR).
+
+```ts
+this.messages = [];
+
+@call
+// Public - Adds a new message.
+add_message({ text }: { text: string }) {
+  // If the user attaches more than 0.01N the message is premium
+  const premium = near.attachedDeposit() >= BigInt(POINT_ONE);
+  const sender = near.predecessorAccountId();
+
+  const message = new PostedMessage({premium, sender, text});
+  this.messages.push(message);
+}
+
+@view
+// Returns an array of messages.
+get_messages({ fromIndex = 0, limit = 10 }: { fromIndex: number, limit: number }): PostedMessage[] {
+  return this.messages.slice(fromIndex, fromIndex + limit);
+}
+```
+
+<br />
+
+# Quickstart
+
+1. Make sure you have installed [node.js](https://nodejs.org/en/download/package-manager/) >= 16.
+2. Install the [`NEAR CLI`](https://github.com/near/near-cli#setup)
+
+<br />
+
+## 1. Build and Deploy the Contract
+You can automatically compile and deploy the contract in the NEAR testnet by running:
+
+```bash
+npm run deploy
+```
+
+Once finished, check the `neardev/dev-account` file to find the address in which the contract was deployed:
+
+```bash
+cat ./neardev/dev-account
+# e.g. dev-1659899566943-21539992274727
+```
+
+<br />
+
+## 2. Retrieve the Stored Messages
+`get_messages` is a read-only method (`view` method) that returns a slice of the vector `messages`.
+
+`View` methods can be called for **free** by anyone, even people **without a NEAR account**!
+
+```bash
+near view <dev-account> get_messages '{"from_index":0, "limit":10}'
+```
+
+<br />
+
+## 3. Add a Message
+`add_message` adds a message to the vector of `messages` and marks it as premium if the user attached more than `0.1 NEAR`.
+
+`add_message` is a payable method for which can only be invoked using a NEAR account. The account needs to attach money and pay GAS for the transaction.
+
+```bash
+# Use near-cli to donate 1 NEAR
+near call <dev-account> add_message '{"text": "a message"}' --amount 0.1 --accountId <account>
+```
+
+**Tip:** If you would like to add a message using your own account, first login into NEAR using:
+
+```bash
+# Use near-cli to login your NEAR account
+near login
+```
+
+and then use the logged account to sign the transaction: `--accountId <your-account>`.

babel.config.json → contract/babel.config.json

@@ -4,4 +4,4 @@
     ["@babel/plugin-proposal-decorators", {"version": "legacy"}]
   ],
   "presets": ["@babel/preset-typescript"]
-}
+}

contract/build.sh

@@ -0,0 +1,5 @@
+#!/bin/sh
+
+echo ">> Building contract"
+
+near-sdk-js build src/contract.ts build/contract.wasm

contract/deploy.sh

@@ -0,0 +1,7 @@
+#!/bin/sh
+
+# build the contract
+npm run build
+
+# deploy the contract
+near dev-deploy --wasmFile build/contract.wasm

contract/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "contract",
+  "version": "1.0.0",
+  "license": "(MIT AND Apache-2.0)",
+  "type": "module",
+  "scripts": {
+    "build": "./build.sh",
+    "deploy": "./deploy.sh",
+    "test": "echo no unit testing"
+  },
+  "dependencies": {
+    "near-cli": "^3.4.0",
+    "near-sdk-js": "0.5.0-0"
+  },
+  "devDependencies": {
+    "typescript": "^4.7.4"
+  }
+}