diff --git a/01-wallet/index.md b/01-wallet/index.md index 5d9a632..e346bfd 100644 --- a/01-wallet/index.md +++ b/01-wallet/index.md @@ -131,7 +131,7 @@ library:npmton Next, we're going to install a JavaScript package named [ton](https://www.npmjs.com/package/ton) that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running: ```console -npm install ton ton-crypto ton-core +npm install @ton/ton @ton/crypto @ton/core ``` --- @@ -159,8 +159,8 @@ Create the file `step7.ts` with the following content: network:testnet library:npmton --- ```ts -import { mnemonicToWalletKey } from "ton-crypto"; -import { WalletContractV4 } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { WalletContractV4 } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) @@ -184,8 +184,8 @@ main(); network:mainnet library:npmton --- ```ts -import { mnemonicToWalletKey } from "ton-crypto"; -import { WalletContractV4 } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { WalletContractV4 } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) @@ -302,8 +302,8 @@ network:testnet library:npmton --- ```ts import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { WalletContractV4, TonClient, fromNano } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { WalletContractV4, TonClient, fromNano } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) @@ -335,8 +335,8 @@ network:mainnet library:npmton --- ```ts import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { WalletContractV4, TonClient, fromNano } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { WalletContractV4, TonClient, fromNano } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) @@ -458,8 +458,8 @@ network:testnet library:npmton --- ```ts import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { TonClient, WalletContractV4, internal } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { TonClient, WalletContractV4, internal } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) @@ -516,8 +516,8 @@ network:mainnet library:npmton --- ```ts import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { TonClient, WalletContractV4, internal } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { TonClient, WalletContractV4, internal } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) diff --git a/01-wallet/test/npmton/index.sh b/01-wallet/test/npmton/index.sh index 0160184..4a66cb7 100755 --- a/01-wallet/test/npmton/index.sh +++ b/01-wallet/test/npmton/index.sh @@ -2,7 +2,7 @@ set -ev npm init --yes npm install dotenv npm install ts-node -npm install ton ton-core ton-crypto +npm install @ton/ton @ton/crypto @ton/core npm install @orbs-network/ton-access npx ts-node step7.ts > step7.output.txt diff step7.output.txt step7.expected.txt diff --git a/01-wallet/test/npmton/step7.expected.txt b/01-wallet/test/npmton/step7.expected.txt index 0dbfb77..a9d4efb 100644 --- a/01-wallet/test/npmton/step7.expected.txt +++ b/01-wallet/test/npmton/step7.expected.txt @@ -1,2 +1,2 @@ -kQCJRglfvsQzAIF0UAhkYH6zkdGPFxVNYMH1nPTN_UpDqEFK +kQBwP1UC3dbBjqOgWHNu3Nfa10FbQI-VGwck7JeOO92qnaEv workchain: 0 diff --git a/01-wallet/test/npmton/step7.ts b/01-wallet/test/npmton/step7.ts index dcb0b0e..342f936 100644 --- a/01-wallet/test/npmton/step7.ts +++ b/01-wallet/test/npmton/step7.ts @@ -1,12 +1,14 @@ import dotenv from "dotenv"; dotenv.config({ path: "../../../.env" }); -import { mnemonicToWalletKey } from "ton-crypto"; -import { WalletContractV4 } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { WalletContractV4 } from "@ton/ton"; async function main() { - // open wallet v4 (notice the correct wallet version here) - const mnemonic = process.env.MNEMONIC;; // your 24 secret words (replace ... with the rest of the words) + // use your mnemonic phrase from .end file in the root of the project and change wallet address + // const mnemonic = process.env.MNEMONIC; + // also you need to change your wallet address in step7.expected.txt to run test + const mnemonic = "memory album during buyer copper until arm forest identify race eyebrow bunker dawn phrase butter knock owner thumb click lottery catalog desk trial copper"; // your 24 secret words (replace ... with the rest of the words) const key = await mnemonicToWalletKey(mnemonic!.split(" ")); const wallet = WalletContractV4.create({ publicKey: key.publicKey, workchain: 0 }); diff --git a/01-wallet/test/npmton/step8.ts b/01-wallet/test/npmton/step8.ts index 7404871..021e1de 100644 --- a/01-wallet/test/npmton/step8.ts +++ b/01-wallet/test/npmton/step8.ts @@ -2,8 +2,8 @@ import dotenv from "dotenv"; dotenv.config({ path: "../../../.env" }); import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { WalletContractV4, TonClient, fromNano } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { WalletContractV4, TonClient, fromNano } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) diff --git a/01-wallet/test/npmton/step9.ts b/01-wallet/test/npmton/step9.ts index 2513af5..c94c949 100644 --- a/01-wallet/test/npmton/step9.ts +++ b/01-wallet/test/npmton/step9.ts @@ -2,8 +2,8 @@ import dotenv from "dotenv"; dotenv.config({ path: "../../../.env" }); import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { TonClient, WalletContractV4, internal } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { TonClient, WalletContractV4, internal } from "@ton/ton"; async function main() { // open wallet v4 (notice the correct wallet version here) diff --git a/01-wallet/test/tonweb/step7.expected.txt b/01-wallet/test/tonweb/step7.expected.txt index 0dbfb77..a9d4efb 100644 --- a/01-wallet/test/tonweb/step7.expected.txt +++ b/01-wallet/test/tonweb/step7.expected.txt @@ -1,2 +1,2 @@ -kQCJRglfvsQzAIF0UAhkYH6zkdGPFxVNYMH1nPTN_UpDqEFK +kQBwP1UC3dbBjqOgWHNu3Nfa10FbQI-VGwck7JeOO92qnaEv workchain: 0 diff --git a/01-wallet/test/tonweb/step7.ts b/01-wallet/test/tonweb/step7.ts index 497be11..557780f 100644 --- a/01-wallet/test/tonweb/step7.ts +++ b/01-wallet/test/tonweb/step7.ts @@ -5,7 +5,10 @@ import { mnemonicToKeyPair } from "tonweb-mnemonic"; import TonWeb from "tonweb"; async function main() { - const mnemonic = process.env.MNEMONIC; // your 24 secret words (replace ... with the rest of the words) + // use your mnemonic phrase from .end file in the root of the project and change wallet address + // const mnemonic = process.env.MNEMONIC; + // also you need to change your wallet address in step7.expected.txt to run test + const mnemonic = "memory album during buyer copper until arm forest identify race eyebrow bunker dawn phrase butter knock owner thumb click lottery catalog desk trial copper"; // your 24 secret words (replace ... with the rest of the words) const key = await mnemonicToKeyPair(mnemonic!.split(" ")); // open wallet v4 (notice the correct wallet version here) diff --git a/01-wallet/test/tonweb/step8.ts b/01-wallet/test/tonweb/step8.ts index 52fb639..ea54693 100644 --- a/01-wallet/test/tonweb/step8.ts +++ b/01-wallet/test/tonweb/step8.ts @@ -6,7 +6,8 @@ import { mnemonicToKeyPair } from "tonweb-mnemonic"; import TonWeb from "tonweb"; async function main() { - const mnemonic = process.env.MNEMONIC; // your 24 secret words (replace ... with the rest of the words) + // const mnemonic = process.env.MNEMONIC; // use your mnemonic phrase from .end file in the root of the project + const mnemonic = "memory album during buyer copper until arm forest identify race eyebrow bunker dawn phrase butter knock owner thumb click lottery catalog desk trial copper"; // your 24 secret words (replace ... with the rest of the words) const key = await mnemonicToKeyPair(mnemonic!.split(" ")); // initialize ton rpc client on testnet diff --git a/01-wallet/test/tonweb/step9.ts b/01-wallet/test/tonweb/step9.ts index 37b807f..ac2e7ec 100644 --- a/01-wallet/test/tonweb/step9.ts +++ b/01-wallet/test/tonweb/step9.ts @@ -6,7 +6,8 @@ import { mnemonicToKeyPair } from "tonweb-mnemonic"; import TonWeb from "tonweb"; async function main() { - const mnemonic = process.env.MNEMONIC; + // const mnemonic = process.env.MNEMONIC; // use your mnemonic phrase from .end file in the root of the project + const mnemonic = "memory album during buyer copper until arm forest identify race eyebrow bunker dawn phrase butter knock owner thumb click lottery catalog desk trial copper"; const key = await mnemonicToKeyPair(mnemonic!.split(" ")); // initialize ton rpc client on testnet diff --git a/02-contract/test/counter.fc b/02-contract/test/counter.fc index 23d51cb..bc7d0cd 100644 --- a/02-contract/test/counter.fc +++ b/02-contract/test/counter.fc @@ -1,4 +1,4 @@ -#include "imports/stdlib.fc"; +#include "stdlib.fc"; ;; =============== storage ============================= diff --git a/02-contract/test/counter.step10.ts b/02-contract/test/counter.step10.ts index 93d6729..52a9412 100644 --- a/02-contract/test/counter.step10.ts +++ b/02-contract/test/counter.step10.ts @@ -1,4 +1,4 @@ -import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "ton-core"; +import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "@ton/core"; export default class Counter implements Contract { diff --git a/02-contract/test/counter.step7.ts b/02-contract/test/counter.step7.ts index 98fc955..74b795a 100644 --- a/02-contract/test/counter.step7.ts +++ b/02-contract/test/counter.step7.ts @@ -1,4 +1,4 @@ -import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "ton-core"; +import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "@ton/core"; export default class Counter implements Contract { diff --git a/02-contract/test/counter.step9.ts b/02-contract/test/counter.step9.ts index a909635..9a0ed13 100644 --- a/02-contract/test/counter.step9.ts +++ b/02-contract/test/counter.step9.ts @@ -1,4 +1,4 @@ -import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "ton-core"; +import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "@ton/core"; export default class Counter implements Contract { diff --git a/02-contract/test/deploy.step8.ts b/02-contract/test/deploy.step8.ts index 6b3f254..cb0131d 100644 --- a/02-contract/test/deploy.step8.ts +++ b/02-contract/test/deploy.step8.ts @@ -3,8 +3,8 @@ dotenv.config({ path: "../../.env" }); import * as fs from "fs"; import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { TonClient, Cell, WalletContractV4 } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { TonClient, Cell, WalletContractV4 } from "@ton/ton"; import Counter from "./counter.step7"; // this is the interface class from step 7 export async function run() { @@ -51,6 +51,8 @@ export async function run() { console.log("deploy transaction confirmed!"); } +run() + function sleep(ms: number) { return new Promise(resolve => setTimeout(resolve, ms)); } diff --git a/02-contract/test/index.sh b/02-contract/test/index.sh index 84c741f..0ceb79d 100755 --- a/02-contract/test/index.sh +++ b/02-contract/test/index.sh @@ -3,7 +3,7 @@ npm init --yes npm install dotenv npm install ts-node npm install @ton-community/func-js -npm install ton ton-core ton-crypto +npm install @ton/ton @ton/core @ton/crypto npm install @orbs-network/ton-access npx func-js stdlib.fc counter.fc --boc counter.cell npx ts-node deploy.step8.ts > deploy.step8.output.txt diff --git a/02-contract/test/sendIncrement.ts b/02-contract/test/step10.ts similarity index 92% rename from 02-contract/test/sendIncrement.ts rename to 02-contract/test/step10.ts index defd606..81caeaf 100644 --- a/02-contract/test/sendIncrement.ts +++ b/02-contract/test/step10.ts @@ -2,11 +2,11 @@ import dotenv from "dotenv"; dotenv.config({ path: "../../.env" }); import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { mnemonicToWalletKey } from "ton-crypto"; -import { TonClient, WalletContractV4, Address } from "ton"; +import { mnemonicToWalletKey } from "@ton/crypto"; +import { TonClient, WalletContractV4, Address } from "@ton/ton"; import Counter from "./counter.step10"; // this is the interface class we just implemented -export async function run() { +export async function main() { // initialize ton rpc client on testnet const endpoint = await getHttpEndpoint({ network: "testnet" }); const client = new TonClient({ endpoint }); @@ -43,6 +43,8 @@ export async function run() { console.log("transaction confirmed!"); } +main() + function sleep(ms: number) { return new Promise(resolve => setTimeout(resolve, ms)); } diff --git a/02-contract/test/getCounter.ts b/02-contract/test/step9.ts similarity index 83% rename from 02-contract/test/getCounter.ts rename to 02-contract/test/step9.ts index ff7ca17..849f0b2 100644 --- a/02-contract/test/getCounter.ts +++ b/02-contract/test/step9.ts @@ -2,22 +2,29 @@ import dotenv from "dotenv"; dotenv.config({ path: "../../.env" }); import { getHttpEndpoint } from "@orbs-network/ton-access"; -import { TonClient, Address } from "ton"; +import { TonClient, Address } from "@ton/ton"; import Counter from "./counter.step9"; // this is the interface class we just implemented -export async function run() { +export async function main() { // initialize ton rpc client on testnet const endpoint = await getHttpEndpoint({ network: "testnet" }); const client = new TonClient({ endpoint }); //const client = new TonClient({ endpoint: "https://testnet.toncenter.com/api/v2/jsonRPC", apiKey: "f20ff0043ded8c132d0b4b870e678b4bbab3940788cbb8c8762491935cf3a460" }); - + // open Counter instance by address const counterAddress = Address.parse(process.env.COUNTER_ADDRESS!.trim()); const counter = new Counter(counterAddress); const counterContract = client.open(counter); // call the getter on chain + await sleep(1500); const counterValue = await counterContract.getCounter(); //console.log("value:", counterValue.toString()); console.log("value:", counterValue >= 1000000000000n ? "more than 1T" : "less than 1T"); } + +main() + +function sleep(ms: number) { + return new Promise(resolve => setTimeout(resolve, ms)); +} \ No newline at end of file diff --git a/03-client/test/index.sh b/03-client/test/index.sh index dd6a428..d0c4528 100755 --- a/03-client/test/index.sh +++ b/03-client/test/index.sh @@ -3,7 +3,7 @@ rm -rf ./temp npm create vite@latest temp -- --template react-ts cd temp npm install -npm install ton ton-core ton-crypto +npm install @ton/ton @ton/core @ton/crypto npm install @orbs-network/ton-access npm install vite-plugin-node-polyfills cp -f ../vite.config.ts . diff --git a/03-client/test/src/contracts/counter.ts b/03-client/test/src/contracts/counter.ts index 93d6729..52a9412 100644 --- a/03-client/test/src/contracts/counter.ts +++ b/03-client/test/src/contracts/counter.ts @@ -1,4 +1,4 @@ -import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "ton-core"; +import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "@ton/core"; export default class Counter implements Contract { diff --git a/03-client/test/src/hooks/useCounterContract.step6.ts b/03-client/test/src/hooks/useCounterContract.step6.ts index ebbfa2d..da08ac3 100644 --- a/03-client/test/src/hooks/useCounterContract.step6.ts +++ b/03-client/test/src/hooks/useCounterContract.step6.ts @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; import Counter from '../contracts/counter'; import { useTonClient } from './useTonClient'; import { useAsyncInitialize } from './useAsyncInitialize'; -import { Address, OpenedContract } from 'ton-core'; +import { Address, OpenedContract } from '@ton/core'; export function useCounterContract() { const client = useTonClient(); diff --git a/03-client/test/src/hooks/useCounterContract.step7.ts b/03-client/test/src/hooks/useCounterContract.step7.ts index fe1c895..35342a6 100644 --- a/03-client/test/src/hooks/useCounterContract.step7.ts +++ b/03-client/test/src/hooks/useCounterContract.step7.ts @@ -3,7 +3,7 @@ import Counter from '../contracts/counter'; import { useTonClient } from './useTonClient'; import { useAsyncInitialize } from './useAsyncInitialize'; import { useTonConnect } from './useTonConnect'; -import { Address, OpenedContract } from 'ton-core'; +import { Address, OpenedContract } from '@ton/core'; export function useCounterContract() { const client = useTonClient(); diff --git a/03-client/test/src/hooks/useTonClient.ts b/03-client/test/src/hooks/useTonClient.ts index 26f50eb..d3a8ff2 100644 --- a/03-client/test/src/hooks/useTonClient.ts +++ b/03-client/test/src/hooks/useTonClient.ts @@ -1,5 +1,5 @@ import { getHttpEndpoint } from '@orbs-network/ton-access'; -import { TonClient } from 'ton'; +import { TonClient } from '@ton/ton'; import { useAsyncInitialize } from './useAsyncInitialize'; export function useTonClient() { diff --git a/03-client/test/src/hooks/useTonConnect.ts b/03-client/test/src/hooks/useTonConnect.ts index 2944449..a31ac65 100644 --- a/03-client/test/src/hooks/useTonConnect.ts +++ b/03-client/test/src/hooks/useTonConnect.ts @@ -1,5 +1,5 @@ import { useTonConnectUI } from '@tonconnect/ui-react'; -import { Sender, SenderArguments } from 'ton-core'; +import { Sender, SenderArguments } from '@ton/core'; export function useTonConnect(): { sender: Sender; connected: boolean } { const [tonConnectUI] = useTonConnectUI(); diff --git a/04-testing/test/counter.ts b/04-testing/test/counter.ts index 93d6729..52a9412 100644 --- a/04-testing/test/counter.ts +++ b/04-testing/test/counter.ts @@ -1,4 +1,4 @@ -import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "ton-core"; +import { Contract, ContractProvider, Sender, Address, Cell, contractAddress, beginCell } from "@ton/core"; export default class Counter implements Contract { diff --git a/04-testing/test/index.sh b/04-testing/test/index.sh index 7de309b..e6d46cf 100755 --- a/04-testing/test/index.sh +++ b/04-testing/test/index.sh @@ -2,7 +2,7 @@ set -ev npm init --yes npm install dotenv npm install typescript jest @types/jest ts-jest -npm install ton-core @ton-community/sandbox @ton-community/test-utils +npm install @ton/core @ton/sandbox @ton/test-utils npx jest step2 npx jest step3 npx jest step4 diff --git a/04-testing/test/step2.spec.ts b/04-testing/test/step2.spec.ts index 30ea970..541adfa 100644 --- a/04-testing/test/step2.spec.ts +++ b/04-testing/test/step2.spec.ts @@ -1,6 +1,6 @@ import * as fs from "fs"; -import { Cell } from "ton-core"; -import { Blockchain, SandboxContract, TreasuryContract } from "@ton-community/sandbox"; +import { Cell } from "@ton/core"; +import { Blockchain, SandboxContract, TreasuryContract } from "@ton/sandbox"; import Counter from "./counter"; // this is the interface class from tutorial 2 describe("Counter tests", () => { diff --git a/04-testing/test/step3.spec.ts b/04-testing/test/step3.spec.ts index 78e2edf..e14671a 100644 --- a/04-testing/test/step3.spec.ts +++ b/04-testing/test/step3.spec.ts @@ -1,8 +1,8 @@ import * as fs from "fs"; -import { Cell } from "ton-core"; -import { Blockchain, SandboxContract, TreasuryContract } from "@ton-community/sandbox"; +import { Cell } from "@ton/core"; +import { Blockchain, SandboxContract, TreasuryContract } from "@ton/sandbox"; import Counter from "./counter"; // this is the interface class from tutorial 2 -import "@ton-community/test-utils"; // register matchers +import "@ton/test-utils"; // register matchers describe("Counter tests", () => { let blockchain: Blockchain; diff --git a/04-testing/test/step4.spec.ts b/04-testing/test/step4.spec.ts index 7fd1bda..0c0d35e 100644 --- a/04-testing/test/step4.spec.ts +++ b/04-testing/test/step4.spec.ts @@ -1,8 +1,8 @@ import * as fs from "fs"; -import { Cell } from "ton-core"; -import { Blockchain, SandboxContract, TreasuryContract } from "@ton-community/sandbox"; +import { Cell } from "@ton/core"; +import { Blockchain, SandboxContract, TreasuryContract } from "@ton/sandbox"; import Counter from "./counter"; // this is the interface class from tutorial 2 -import "@ton-community/test-utils"; // register matchers +import "@ton/test-utils"; // register matchers describe("Counter tests", () => { let blockchain: Blockchain; diff --git a/04-testing/test/step5.spec.ts b/04-testing/test/step5.spec.ts index 19d2cb7..4188520 100644 --- a/04-testing/test/step5.spec.ts +++ b/04-testing/test/step5.spec.ts @@ -1,8 +1,8 @@ import * as fs from "fs"; -import { Cell, toNano } from "ton-core"; -import { Blockchain, SandboxContract, TreasuryContract } from "@ton-community/sandbox"; +import { Cell, toNano } from "@ton/core"; +import { Blockchain, SandboxContract, TreasuryContract } from "@ton/sandbox"; import Counter from "./counter"; // this is the interface class from tutorial 2 -import "@ton-community/test-utils"; // register matchers +import "@ton/test-utils"; // register matchers describe("Counter tests", () => { let blockchain: Blockchain; diff --git a/docs/01-wallet/index.html b/docs/01-wallet/index.html index 37a5188..7a0ab69 100644 --- a/docs/01-wallet/index.html +++ b/docs/01-wallet/index.html @@ -172,14 +172,14 @@

Step 6: Set up your local machine f
npm install ts-node
 

Next, we're going to install a JavaScript package named ton that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running:

-
npm install ton ton-crypto ton-core
+
npm install @ton/ton @ton/crypto @ton/core
 

Step 7: Get the wallet address programmatically

The first thing we'll do is calculate the address of our wallet in code and see that it matches what we saw in the explorer. This action is completely offline since the wallet address is derived from the version of the wallet and the private key used to create it.

Let's assume that your secret 24 word mnemonic is unfold sugar water ... - this is the phrase we backed up in step 2.

Create the file step7.ts with the following content:

-
import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4 } from "ton";
+
import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4 } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -209,8 +209,8 @@ 

Step 8: Read wallet state from the cha

Create the file step8.ts with the following content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4, TonClient, fromNano } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4, TonClient, fromNano } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -246,8 +246,8 @@ 

Step 9: Send transfer transactio

Create a new file step9.ts with this content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { TonClient, WalletContractV4, internal } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { TonClient, WalletContractV4, internal } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -520,7 +520,7 @@ 

Mainnet or testnet

Step 1: Create a new wallet using an app

The simplest way to create a TON wallet is visit https://ton.org/wallets and choose one of the wallet apps from the list. This page explains the difference between custodial and non-custodial wallets. With a non-custodial wallet, you own the wallet and hold its private key by yourself. With a custodial wallet, you trust somebody else to do this for you.

The point of blockchain is being in control of your own funds, so we'll naturally choose a non-custodial option. They're all pretty similar, let's choose Tonkeeper. Go ahead and install the Tonkeeper app on your phone and run it.

-

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Version number on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

+

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Tonkeeper Logo on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

If you don't already have a wallet connected to the app, tap on the "Set up wallet" button. We're going to create a new wallet. After a few seconds, your wallet is created and Tonkeeper displays your recovery phrase - the secret 24 words that give access to your wallet funds.

Step 2: Backup the 24 word recovery phrase

The recovery phrase is the key to accessing your wallet. Lose this phrase and you'll lose access to your funds. Give this phrase to somebody and they'll be able to take your funds. Keep this secret and backed up in a safe place.

@@ -562,14 +562,14 @@

Step 6: Set up your local machine f
npm install ts-node
 

Next, we're going to install a JavaScript package named ton that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running:

-
npm install ton ton-crypto ton-core
+
npm install @ton/ton @ton/crypto @ton/core
 

Step 7: Get the wallet address programmatically

The first thing we'll do is calculate the address of our wallet in code and see that it matches what we saw in the explorer. This action is completely offline since the wallet address is derived from the version of the wallet and the private key used to create it.

Let's assume that your secret 24 word mnemonic is unfold sugar water ... - this is the phrase we backed up in step 2.

Create the file step7.ts with the following content:

-
import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4 } from "ton";
+
import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4 } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -599,8 +599,8 @@ 

Step 8: Read wallet state from the cha

Create the file step8.ts with the following content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4, TonClient, fromNano } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4, TonClient, fromNano } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -636,8 +636,8 @@ 

Step 9: Send transfer transactio

Create a new file step9.ts with this content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { TonClient, WalletContractV4, internal } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { TonClient, WalletContractV4, internal } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -717,7 +717,7 @@ 

Mainnet or testnet

Step 1: Create a new wallet using an app

The simplest way to create a TON wallet is visit https://ton.org/wallets and choose one of the wallet apps from the list. This page explains the difference between custodial and non-custodial wallets. With a non-custodial wallet, you own the wallet and hold its private key by yourself. With a custodial wallet, you trust somebody else to do this for you.

The point of blockchain is being in control of your own funds, so we'll naturally choose a non-custodial option. They're all pretty similar, let's choose Tonkeeper. Go ahead and install the Tonkeeper app on your phone and run it.

-

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Version number on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

+

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Tonkeeper Logo on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

If you don't already have a wallet connected to the app, tap on the "Set up wallet" button. We're going to create a new wallet. After a few seconds, your wallet is created and Tonkeeper displays your recovery phrase - the secret 24 words that give access to your wallet funds.

Step 2: Backup the 24 word recovery phrase

The recovery phrase is the key to accessing your wallet. Lose this phrase and you'll lose access to your funds. Give this phrase to somebody and they'll be able to take your funds. Keep this secret and backed up in a safe place.

diff --git a/docs/01-wallet/mainnet-npmton.html b/docs/01-wallet/mainnet-npmton.html index a3a49f4..5f8e0b6 100644 --- a/docs/01-wallet/mainnet-npmton.html +++ b/docs/01-wallet/mainnet-npmton.html @@ -49,14 +49,14 @@

Step 6: Set up your local machine f
npm install ts-node
 

Next, we're going to install a JavaScript package named ton that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running:

-
npm install ton ton-crypto ton-core
+
npm install @ton/ton @ton/crypto @ton/core
 

Step 7: Get the wallet address programmatically

The first thing we'll do is calculate the address of our wallet in code and see that it matches what we saw in the explorer. This action is completely offline since the wallet address is derived from the version of the wallet and the private key used to create it.

Let's assume that your secret 24 word mnemonic is unfold sugar water ... - this is the phrase we backed up in step 2.

Create the file step7.ts with the following content:

-
import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4 } from "ton";
+
import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4 } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -86,8 +86,8 @@ 

Step 8: Read wallet state from the cha

Create the file step8.ts with the following content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4, TonClient, fromNano } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4, TonClient, fromNano } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -123,8 +123,8 @@ 

Step 9: Send transfer transactio

Create a new file step9.ts with this content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { TonClient, WalletContractV4, internal } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { TonClient, WalletContractV4, internal } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
diff --git a/docs/01-wallet/mainnet-npmton.md b/docs/01-wallet/mainnet-npmton.md
index d8e9c82..6c771cc 100644
--- a/docs/01-wallet/mainnet-npmton.md
+++ b/docs/01-wallet/mainnet-npmton.md
@@ -102,7 +102,7 @@ npm install ts-node
 Next, we're going to install a JavaScript package named [ton](https://www.npmjs.com/package/ton) that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running:
 
 ```console
-npm install ton ton-crypto ton-core
+npm install @ton/ton @ton/crypto @ton/core
 ```
 
 ## Step 7: Get the wallet address programmatically
@@ -114,8 +114,8 @@ Let's assume that your secret 24 word mnemonic is `unfold sugar water ...` - thi
 Create the file `step7.ts` with the following content:
 
 ```ts
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4 } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4 } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -159,8 +159,8 @@ Create the file `step8.ts` with the following content:
 
 ```ts
 import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4, TonClient, fromNano } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4, TonClient, fromNano } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -207,8 +207,8 @@ Create a new file `step9.ts` with this content:
 
 ```ts
 import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { TonClient, WalletContractV4, internal } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { TonClient, WalletContractV4, internal } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
diff --git a/docs/01-wallet/testnet-npmton.html b/docs/01-wallet/testnet-npmton.html
index c716b88..2b9cb23 100644
--- a/docs/01-wallet/testnet-npmton.html
+++ b/docs/01-wallet/testnet-npmton.html
@@ -9,7 +9,7 @@ 

Mainnet or testnet

Step 1: Create a new wallet using an app

The simplest way to create a TON wallet is visit https://ton.org/wallets and choose one of the wallet apps from the list. This page explains the difference between custodial and non-custodial wallets. With a non-custodial wallet, you own the wallet and hold its private key by yourself. With a custodial wallet, you trust somebody else to do this for you.

The point of blockchain is being in control of your own funds, so we'll naturally choose a non-custodial option. They're all pretty similar, let's choose Tonkeeper. Go ahead and install the Tonkeeper app on your phone and run it.

-

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Version number on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

+

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Tonkeeper Logo on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

If you don't already have a wallet connected to the app, tap on the "Set up wallet" button. We're going to create a new wallet. After a few seconds, your wallet is created and Tonkeeper displays your recovery phrase - the secret 24 words that give access to your wallet funds.

Step 2: Backup the 24 word recovery phrase

The recovery phrase is the key to accessing your wallet. Lose this phrase and you'll lose access to your funds. Give this phrase to somebody and they'll be able to take your funds. Keep this secret and backed up in a safe place.

@@ -51,14 +51,14 @@

Step 6: Set up your local machine f
npm install ts-node
 

Next, we're going to install a JavaScript package named ton that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running:

-
npm install ton ton-crypto ton-core
+
npm install @ton/ton @ton/crypto @ton/core
 

Step 7: Get the wallet address programmatically

The first thing we'll do is calculate the address of our wallet in code and see that it matches what we saw in the explorer. This action is completely offline since the wallet address is derived from the version of the wallet and the private key used to create it.

Let's assume that your secret 24 word mnemonic is unfold sugar water ... - this is the phrase we backed up in step 2.

Create the file step7.ts with the following content:

-
import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4 } from "ton";
+
import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4 } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -88,8 +88,8 @@ 

Step 8: Read wallet state from the cha

Create the file step8.ts with the following content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4, TonClient, fromNano } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4, TonClient, fromNano } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -125,8 +125,8 @@ 

Step 9: Send transfer transactio

Create a new file step9.ts with this content:

import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { TonClient, WalletContractV4, internal } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { TonClient, WalletContractV4, internal } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
diff --git a/docs/01-wallet/testnet-npmton.md b/docs/01-wallet/testnet-npmton.md
index ad24aa2..9484cab 100644
--- a/docs/01-wallet/testnet-npmton.md
+++ b/docs/01-wallet/testnet-npmton.md
@@ -21,7 +21,7 @@ The simplest way to create a TON wallet is visit [https://ton.org/wallets](https
 
 The point of blockchain is being in control of your own funds, so we'll naturally choose a non-custodial option. They're all pretty similar, let's choose [Tonkeeper](https://tonkeeper.com). Go ahead and install the Tonkeeper app on your phone and run it.
 
-Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Version number on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.
+Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Tonkeeper Logo on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.
 
 If you don't already have a wallet connected to the app, tap on the "Set up wallet" button. We're going to create a new wallet. After a few seconds, your wallet is created and Tonkeeper displays your recovery phrase - the secret 24 words that give access to your wallet funds.
 
@@ -106,7 +106,7 @@ npm install ts-node
 Next, we're going to install a JavaScript package named [ton](https://www.npmjs.com/package/ton) that will allow us to make TON API calls and manipulate TON objects. Install the package by opening terminal in the project directory and running:
 
 ```console
-npm install ton ton-crypto ton-core
+npm install @ton/ton @ton/crypto @ton/core
 ```
 
 ## Step 7: Get the wallet address programmatically
@@ -118,8 +118,8 @@ Let's assume that your secret 24 word mnemonic is `unfold sugar water ...` - thi
 Create the file `step7.ts` with the following content:
 
 ```ts
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4 } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4 } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -163,8 +163,8 @@ Create the file `step8.ts` with the following content:
 
 ```ts
 import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { WalletContractV4, TonClient, fromNano } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { WalletContractV4, TonClient, fromNano } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
@@ -211,8 +211,8 @@ Create a new file `step9.ts` with this content:
 
 ```ts
 import { getHttpEndpoint } from "@orbs-network/ton-access";
-import { mnemonicToWalletKey } from "ton-crypto";
-import { TonClient, WalletContractV4, internal } from "ton";
+import { mnemonicToWalletKey } from "@ton/crypto";
+import { TonClient, WalletContractV4, internal } from "@ton/ton";
 
 async function main() {
   // open wallet v4 (notice the correct wallet version here)
diff --git a/docs/01-wallet/testnet-tonweb.html b/docs/01-wallet/testnet-tonweb.html
index 8c6afd3..7c5cc6e 100644
--- a/docs/01-wallet/testnet-tonweb.html
+++ b/docs/01-wallet/testnet-tonweb.html
@@ -9,7 +9,7 @@ 

Mainnet or testnet

Step 1: Create a new wallet using an app

The simplest way to create a TON wallet is visit https://ton.org/wallets and choose one of the wallet apps from the list. This page explains the difference between custodial and non-custodial wallets. With a non-custodial wallet, you own the wallet and hold its private key by yourself. With a custodial wallet, you trust somebody else to do this for you.

The point of blockchain is being in control of your own funds, so we'll naturally choose a non-custodial option. They're all pretty similar, let's choose Tonkeeper. Go ahead and install the Tonkeeper app on your phone and run it.

-

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Version number on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

+

Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Tonkeeper Logo on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet.

If you don't already have a wallet connected to the app, tap on the "Set up wallet" button. We're going to create a new wallet. After a few seconds, your wallet is created and Tonkeeper displays your recovery phrase - the secret 24 words that give access to your wallet funds.

Step 2: Backup the 24 word recovery phrase

The recovery phrase is the key to accessing your wallet. Lose this phrase and you'll lose access to your funds. Give this phrase to somebody and they'll be able to take your funds. Keep this secret and backed up in a safe place.

diff --git a/docs/01-wallet/testnet-tonweb.md b/docs/01-wallet/testnet-tonweb.md index 85ccc64..c433de4 100644 --- a/docs/01-wallet/testnet-tonweb.md +++ b/docs/01-wallet/testnet-tonweb.md @@ -21,7 +21,7 @@ The simplest way to create a TON wallet is visit [https://ton.org/wallets](https The point of blockchain is being in control of your own funds, so we'll naturally choose a non-custodial option. They're all pretty similar, let's choose [Tonkeeper](https://tonkeeper.com). Go ahead and install the Tonkeeper app on your phone and run it. -Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Version number on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet. +Tonkeeper works by default on TON mainnet. If you decided to work on testnet, you will need to switch the app manually to dev mode. Open the "Settings" tab and tap 5 times quickly on the Tonkeeper Logo on the bottom. The "Dev Menu" should show up. Click on "Switch to Testnet" and make the switch. You can use this menu later to return to mainnet. If you don't already have a wallet connected to the app, tap on the "Set up wallet" button. We're going to create a new wallet. After a few seconds, your wallet is created and Tonkeeper displays your recovery phrase - the secret 24 words that give access to your wallet funds. diff --git a/docs/03-client/index.html b/docs/03-client/index.html index 56bcdb5..18a8265 100644 --- a/docs/03-client/index.html +++ b/docs/03-client/index.html @@ -113,9 +113,9 @@

TON Hell

In the previous tutorial we deployed a Counter smart contract to TON Blockchain (either testnet or mainnet). This contract acts as the backend server of our application. In this tutorial, we will implement the frontend or client and allow end-users to access it from a web browser.

We will also recall that the appilcation that we're building is decentralized. Decentralized apps (dapps) have special properties. For example, their frontend must only run client-side. This means that we're not supposed to rely on a backend server for serving our frontend. If we had such a server, by definition it would be centralized (our end-users will not have equal access to it), and thus make our entire app centralized as well.

-

Usage patterns

+

Step 1: Define usage patterns

TON Blockchain is inspired by and complementary to Telegram messenger. It aims for mass adoption by the next billion users. Since Telegram messenger is a mobile-first app, it makes sense that we design our dapp to be mobile-first as well.

-

The first usage patten of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

+

The first usage pattern of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

The second usage pattern is a bit more special. Since TON Blockchain complements the Telegram messenger, we will also want to embed our dapp right into the Telegram app itself. Telegram provides special API for building Telegam Web Apps (TWAs). These tiny apps closely resemble websites and also rely on HTML and JavaScript. They normally run within the context of a Telegram bot and provide a sleek user experience without ever leaving the host Telegram app.


@@ -581,9 +581,9 @@

TON Hell

In the previous tutorial we deployed a Counter smart contract to TON Blockchain (either testnet or mainnet). This contract acts as the backend server of our application. In this tutorial, we will implement the frontend or client and allow end-users to access it from a web browser.

We will also recall that the appilcation that we're building is decentralized. Decentralized apps (dapps) have special properties. For example, their frontend must only run client-side. This means that we're not supposed to rely on a backend server for serving our frontend. If we had such a server, by definition it would be centralized (our end-users will not have equal access to it), and thus make our entire app centralized as well.

-

Usage patterns

+

Step 1: Define usage patterns

TON Blockchain is inspired by and complementary to Telegram messenger. It aims for mass adoption by the next billion users. Since Telegram messenger is a mobile-first app, it makes sense that we design our dapp to be mobile-first as well.

-

The first usage patten of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

+

The first usage pattern of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

The second usage pattern is a bit more special. Since TON Blockchain complements the Telegram messenger, we will also want to embed our dapp right into the Telegram app itself. Telegram provides special API for building Telegam Web Apps (TWAs). These tiny apps closely resemble websites and also rely on HTML and JavaScript. They normally run within the context of a Telegram bot and provide a sleek user experience without ever leaving the host Telegram app.


diff --git a/docs/03-client/mainnet-npmton.html b/docs/03-client/mainnet-npmton.html index e06a4cb..b438c23 100644 --- a/docs/03-client/mainnet-npmton.html +++ b/docs/03-client/mainnet-npmton.html @@ -1,9 +1,9 @@

TON Hello World part 3: Step by step guide for building your first web client

In the previous tutorial we deployed a Counter smart contract to TON Blockchain (either testnet or mainnet). This contract acts as the backend server of our application. In this tutorial, we will implement the frontend or client and allow end-users to access it from a web browser.

We will also recall that the appilcation that we're building is decentralized. Decentralized apps (dapps) have special properties. For example, their frontend must only run client-side. This means that we're not supposed to rely on a backend server for serving our frontend. If we had such a server, by definition it would be centralized (our end-users will not have equal access to it), and thus make our entire app centralized as well.

-

Usage patterns

+

Step 1: Define usage patterns

TON Blockchain is inspired by and complementary to Telegram messenger. It aims for mass adoption by the next billion users. Since Telegram messenger is a mobile-first app, it makes sense that we design our dapp to be mobile-first as well.

-

The first usage patten of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

+

The first usage pattern of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

The second usage pattern is a bit more special. Since TON Blockchain complements the Telegram messenger, we will also want to embed our dapp right into the Telegram app itself. Telegram provides special API for building Telegam Web Apps (TWAs). These tiny apps closely resemble websites and also rely on HTML and JavaScript. They normally run within the context of a Telegram bot and provide a sleek user experience without ever leaving the host Telegram app.


diff --git a/docs/03-client/mainnet-npmton.md b/docs/03-client/mainnet-npmton.md index b0f3a91..b3b9895 100644 --- a/docs/03-client/mainnet-npmton.md +++ b/docs/03-client/mainnet-npmton.md @@ -5,11 +5,11 @@ In the previous tutorial we deployed a Counter smart contract to TON Blockchain We will also recall that the appilcation that we're building is *decentralized*. Decentralized apps (dapps) have special [properties](https://defi.org/ton/#app-safety-guidelines). For example, their frontend must only run client-side. This means that we're not supposed to rely on a backend server for serving our frontend. If we had such a server, by definition it would be centralized (our end-users will not have equal access to it), and thus make our entire app centralized as well. -## Usage patterns +## Step 1: Define usage patterns TON Blockchain is inspired by and complementary to [Telegram](https://telegram.org/) messenger. It aims for mass adoption by the next billion users. Since Telegram messenger is a mobile-first app, it makes sense that we design our dapp to be mobile-first as well. -The first usage patten of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like [GitHub Pages](https://pages.github.com/). End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard. +The first usage pattern of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like [GitHub Pages](https://pages.github.com/). End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard. The second usage pattern is a bit more special. Since TON Blockchain complements the Telegram messenger, we will also want to embed our dapp right into the Telegram app itself. Telegram provides special API for building [Telegam Web Apps](https://core.telegram.org/bots/webapps) (TWAs). These tiny apps closely resemble websites and also rely on HTML and JavaScript. They normally run within the context of a Telegram bot and provide a sleek user experience without ever leaving the host Telegram app. diff --git a/docs/03-client/testnet-npmton.html b/docs/03-client/testnet-npmton.html index d0404b4..3b4a706 100644 --- a/docs/03-client/testnet-npmton.html +++ b/docs/03-client/testnet-npmton.html @@ -1,9 +1,9 @@

TON Hello World part 3: Step by step guide for building your first web client

In the previous tutorial we deployed a Counter smart contract to TON Blockchain (either testnet or mainnet). This contract acts as the backend server of our application. In this tutorial, we will implement the frontend or client and allow end-users to access it from a web browser.

We will also recall that the appilcation that we're building is decentralized. Decentralized apps (dapps) have special properties. For example, their frontend must only run client-side. This means that we're not supposed to rely on a backend server for serving our frontend. If we had such a server, by definition it would be centralized (our end-users will not have equal access to it), and thus make our entire app centralized as well.

-

Usage patterns

+

Step 1: Define usage patterns

TON Blockchain is inspired by and complementary to Telegram messenger. It aims for mass adoption by the next billion users. Since Telegram messenger is a mobile-first app, it makes sense that we design our dapp to be mobile-first as well.

-

The first usage patten of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

+

The first usage pattern of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like GitHub Pages. End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard.

The second usage pattern is a bit more special. Since TON Blockchain complements the Telegram messenger, we will also want to embed our dapp right into the Telegram app itself. Telegram provides special API for building Telegam Web Apps (TWAs). These tiny apps closely resemble websites and also rely on HTML and JavaScript. They normally run within the context of a Telegram bot and provide a sleek user experience without ever leaving the host Telegram app.


diff --git a/docs/03-client/testnet-npmton.md b/docs/03-client/testnet-npmton.md index f5e4a2b..54b0fbe 100644 --- a/docs/03-client/testnet-npmton.md +++ b/docs/03-client/testnet-npmton.md @@ -5,11 +5,11 @@ In the previous tutorial we deployed a Counter smart contract to TON Blockchain We will also recall that the appilcation that we're building is *decentralized*. Decentralized apps (dapps) have special [properties](https://defi.org/ton/#app-safety-guidelines). For example, their frontend must only run client-side. This means that we're not supposed to rely on a backend server for serving our frontend. If we had such a server, by definition it would be centralized (our end-users will not have equal access to it), and thus make our entire app centralized as well. -## Usage patterns +## Step 1: Define usage patterns TON Blockchain is inspired by and complementary to [Telegram](https://telegram.org/) messenger. It aims for mass adoption by the next billion users. Since Telegram messenger is a mobile-first app, it makes sense that we design our dapp to be mobile-first as well. -The first usage patten of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like [GitHub Pages](https://pages.github.com/). End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard. +The first usage pattern of our dapp would be through a regular web browser. Our frontend would be hosted on some domain using a service like [GitHub Pages](https://pages.github.com/). End-users would input the dapp URL in their favorite web browser and access our dapp using HTML and JavaScript. This is quite standard. The second usage pattern is a bit more special. Since TON Blockchain complements the Telegram messenger, we will also want to embed our dapp right into the Telegram app itself. Telegram provides special API for building [Telegam Web Apps](https://core.telegram.org/bots/webapps) (TWAs). These tiny apps closely resemble websites and also rely on HTML and JavaScript. They normally run within the context of a Telegram bot and provide a sleek user experience without ever leaving the host Telegram app.