mirror of
https://github.com/XRPLF/xrpl-dev-portal.git
synced 2025-11-22 20:55:50 +00:00
Migrate content syntax via script
The changes in this commit were auto-generated by running tool/migrate.sh Following this commit, the Dactyl build no longer works but the Redocly build (mostly) should.
This commit is contained in:
mDuo13
@@ -12,7 +12,7 @@ showcase_icon: assets/img/logos/javascript.svg
|
||||
|
||||
This tutorial guides you through the basics of building an XRP Ledger-connected application in JavaScript or TypeScript using the [`xrpl.js`](https://github.com/XRPLF/xrpl.js/) client library in either Node.js or web browsers.
|
||||
|
||||
The scripts and config files used in this guide are [available in this website's GitHub Repository]({{target.github_forkurl}}/tree/{{target.github_branch}}/content/_code-samples/get-started/js/).
|
||||
The scripts and config files used in this guide are {% repo-link path="content/_code-samples/get-started/js/" %}available in this website's GitHub Repository{% /repo-link %}.
|
||||
|
||||
|
||||
## Learning Goals
|
||||
@@ -21,7 +21,7 @@ In this tutorial, you'll learn:
|
||||
|
||||
* The basic building blocks of XRP Ledger-based applications.
|
||||
* How to connect to the XRP Ledger using `xrpl.js`.
|
||||
* How to get an account on the [Testnet](xrp-testnet-faucet.html) using `xrpl.js`.
|
||||
* How to get an account on the [Testnet](/resources/dev-tools/xrp-faucets) using `xrpl.js`.
|
||||
* How to use the `xrpl.js` library to look up information about an account on the XRP Ledger.
|
||||
* How to put these steps together to create a JavaScript app or web-app.
|
||||
|
||||
@@ -42,7 +42,7 @@ npm install xrpl
|
||||
|
||||
## Start Building
|
||||
|
||||
When you're working with the XRP Ledger, there are a few things you'll need to manage, whether you're adding XRP to your [account](accounts.html), integrating with the [decentralized exchange](decentralized-exchange.html), or [issuing tokens](tokens.html). This tutorial walks you through basic patterns common to getting started with all of these use cases and provides sample code for implementing them.
|
||||
When you're working with the XRP Ledger, there are a few things you'll need to manage, whether you're adding XRP to your [account](../../concepts/accounts/accounts.md), integrating with the [decentralized exchange](../../concepts/tokens/decentralized-exchange/index.md), or [issuing tokens](../../concepts/tokens/index.md). This tutorial walks you through basic patterns common to getting started with all of these use cases and provides sample code for implementing them.
|
||||
|
||||
Here are some steps you use in many XRP Ledger projects:
|
||||
|
||||
@@ -89,32 +89,36 @@ To make queries and submit transactions, you need to connect to the XRP Ledger.
|
||||
|
||||
**Tip:** Many network functions in `xrpl.js` use [Promises](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) to return values asynchronously. The code samples here use the [`async/await` pattern](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await) to wait for the actual result of the Promises.
|
||||
|
||||
{{ include_code("_code-samples/get-started/js/base.js", language="js") }}
|
||||
{% code-snippet file="/_code-samples/get-started/js/base.js" language="js" /%}
|
||||
|
||||
#### Connect to the XRP Ledger Mainnet
|
||||
|
||||
The sample code in the previous section shows you how to connect to the Testnet, which is one of the available [parallel networks](parallel-networks.html). When you're ready to move to production, you'll need to connect to the XRP Ledger Mainnet. You can do that in two ways:
|
||||
The sample code in the previous section shows you how to connect to the Testnet, which is one of the available [parallel networks](../../concepts/networks-and-servers/parallel-networks.md). When you're ready to move to production, you'll need to connect to the XRP Ledger Mainnet. You can do that in two ways:
|
||||
|
||||
* By [installing the core server](install-rippled.html) (`rippled`) and running a node yourself. The core server connects to the Mainnet by default, but you can [change the configuration to use Testnet or Devnet](connect-your-rippled-to-the-xrp-test-net.html). [There are good reasons to run your own core server](networks-and-servers.html#reasons-to-run-your-own-server). If you run your own server, you can connect to it like so:
|
||||
* By [installing the core server](../../infrastructure/installation/index.md) (`rippled`) and running a node yourself. The core server connects to the Mainnet by default, but you can [change the configuration to use Testnet or Devnet](../../infrastructure/configuration/connect-your-rippled-to-the-xrp-test-net.md). [There are good reasons to run your own core server](../../concepts/networks-and-servers/index.md#reasons-to-run-your-own-server). If you run your own server, you can connect to it like so:
|
||||
|
||||
const MY_SERVER = "ws://localhost:6006/"
|
||||
const client = new xrpl.Client(MY_SERVER)
|
||||
await client.connect()
|
||||
```
|
||||
const MY_SERVER = "ws://localhost:6006/"
|
||||
const client = new xrpl.Client(MY_SERVER)
|
||||
await client.connect()
|
||||
```
|
||||
|
||||
See the example [core server config file](https://github.com/XRPLF/rippled/blob/c0a0b79d2d483b318ce1d82e526bd53df83a4a2c/cfg/rippled-example.cfg#L1562) for more information about default values.
|
||||
|
||||
* By using one of the available [public servers][]:
|
||||
|
||||
const PUBLIC_SERVER = "wss://xrplcluster.com/"
|
||||
const client = new xrpl.Client(PUBLIC_SERVER)
|
||||
await client.connect()
|
||||
```
|
||||
const PUBLIC_SERVER = "wss://xrplcluster.com/"
|
||||
const client = new xrpl.Client(PUBLIC_SERVER)
|
||||
await client.connect()
|
||||
```
|
||||
|
||||
|
||||
### 3. Get Account
|
||||
|
||||
The `xrpl.js` library has a `Wallet` class for handling the keys and address of an XRP Ledger account. On Testnet, you can fund a new account like this:
|
||||
|
||||
{{ include_code("_code-samples/get-started/js/get-acct-info.js", start_with="// Create a wallet", end_before="// Get info", language="js") }}
|
||||
{% code-snippet file="/_code-samples/get-started/js/get-acct-info.js" from="// Create a wallet" before="// Get info" language="js" /%}
|
||||
|
||||
If you only want to generate keys, you can create a new `Wallet` instance like this:
|
||||
|
||||
@@ -130,42 +134,39 @@ const test_wallet = xrpl.Wallet.fromSeed("sn3nxiW7v8KXzPzAqzyHXbSSKNuN9") // Tes
|
||||
|
||||
### 4. Query the XRP Ledger
|
||||
|
||||
Use the Client's `request()` method to access the XRP Ledger's [WebSocket API](request-formatting.html). For example:
|
||||
Use the Client's `request()` method to access the XRP Ledger's [WebSocket API](../../references/http-websocket-apis/api-conventions/request-formatting.md). For example:
|
||||
|
||||
{{ include_code("_code-samples/get-started/js/get-acct-info.js", start_with="// Get info", end_before="// Listen to ledger close events", language="js") }}
|
||||
{% code-snippet file="/_code-samples/get-started/js/get-acct-info.js" from="// Get info" before="// Listen to ledger close events" language="js" /%}
|
||||
|
||||
|
||||
### 5. Listen for Events
|
||||
|
||||
You can set up handlers for various types of events in `xrpl.js`, such as whenever the XRP Ledger's [consensus process](consensus.html) produces a new [ledger version](ledgers.html). To do that, first call the [subscribe method][] to get the type of events you want, then attach an event handler using the `on(eventType, callback)` method of the client.
|
||||
You can set up handlers for various types of events in `xrpl.js`, such as whenever the XRP Ledger's [consensus process](../../concepts/consensus-protocol/index.md) produces a new [ledger version](../../concepts/ledgers/index.md). To do that, first call the [subscribe method][] to get the type of events you want, then attach an event handler using the `on(eventType, callback)` method of the client.
|
||||
|
||||
{{ include_code("_code-samples/get-started/js/get-acct-info.js", start_with="// Listen to ledger close events", end_before="// Disconnect when done", language="js") }}
|
||||
{% code-snippet file="/_code-samples/get-started/js/get-acct-info.js" from="// Listen to ledger close events" before="// Disconnect when done" language="js" /%}
|
||||
|
||||
|
||||
## Keep on Building
|
||||
|
||||
Now that you know how to use `xrpl.js` to connect to the XRP Ledger, get an account, and look up information about it, you can also:
|
||||
|
||||
* [Send XRP](send-xrp.html).
|
||||
* [Issue a Fungible Token](issue-a-fungible-token.html)
|
||||
* [Set up secure signing](secure-signing.html) for your account.
|
||||
* [Send XRP](send-xrp.md).
|
||||
* [Issue a Fungible Token](../use-tokens/issue-a-fungible-token.md)
|
||||
* [Set up secure signing](../../concepts/transactions/secure-signing.md) for your account.
|
||||
|
||||
|
||||
## See Also
|
||||
|
||||
- **Concepts:**
|
||||
- [XRP Ledger Overview](xrp-ledger-overview.html)
|
||||
- [Client Libraries](client-libraries.html)
|
||||
- [XRP Ledger Overview](/about/)
|
||||
- [Client Libraries](../../references/client-libraries.md)
|
||||
- **Tutorials:**
|
||||
- [Send XRP](send-xrp.html)
|
||||
- [Send XRP](send-xrp.md)
|
||||
- **References:**
|
||||
- [`xrpl.js` Reference](https://js.xrpl.org/)
|
||||
- [Public API Methods](public-api-methods.html)
|
||||
- [API Conventions](api-conventions.html)
|
||||
- [base58 Encodings](base58-encodings.html)
|
||||
- [Transaction Formats](transaction-formats.html)
|
||||
- [Public API Methods](../../references/http-websocket-apis/public-api-methods/index.md)
|
||||
- [API Conventions](../../references/http-websocket-apis/api-conventions/index.md)
|
||||
- [base58 Encodings](../../references/protocol/data-types/base58-encodings.md)
|
||||
- [Transaction Formats](../../references/protocol/transactions/index.md)
|
||||
|
||||
<!--{# common link defs #}-->
|
||||
{% include '_snippets/rippled-api-links.md' %}
|
||||
{% include '_snippets/tx-type-links.md' %}
|
||||
{% include '_snippets/rippled_versions.md' %}
|
||||
{% raw-partial file="/_snippets/common-links.md" /%}
|
||||
|
||||
Reference in New Issue
Block a user