-
Notifications
You must be signed in to change notification settings - Fork 58
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor(examples-browser): rearrange files and docs
- Loading branch information
Showing
57 changed files
with
102 additions
and
320 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,129 +1,13 @@ | ||
| # ⚡ Examples | ||
|
|
||
| This folder contains examples of maintained code samples that you can run autonomously. | ||
| This folder contains examples of code samples that you can run autonomously. | ||
| Create a [new issue](https://github.com/aeternity/aepp-sdk-js/issues/new) to suggest another example. | ||
|
|
||
| ## VueJS (maintained) Examples to run in the `browser` | ||
| ## Run in the browser | ||
| 1. [Aepp](browser/connect-wallet-aepp) (VueJS) | ||
| 2. [iframe-based Wallet](browser/wallet-iframe) (VueJS) | ||
| 3. [Wallet WebExtension](browser/wallet-web-extension) | ||
|
|
||
| 1. VueJS [Wallet + Aepp RPC setup](browser/vuejs/connect-two-ae) | ||
| 2. [Suggest another example](https://github.com/aeternity/aepp-sdk-js/issues/new) | ||
|
|
||
| ## NodeJS (maintained and tested) Examples to run in the `terminal` | ||
|
|
||
| 1. [Simple Contract](../docs/examples/node/aecontract.md) - [Code](node/aecontract.js) | ||
| 2. [Wallet](../docs/examples/node/aewallet.md) - [Code](node/aewallet.js) | ||
| 3. [Suggest another example](https://github.com/aeternity/aepp-sdk-js/issues/new) | ||
|
|
||
| ## Quick Standalone _Browser_ Example | ||
| > This example interacts with aeternity's blockchain's [**Universal flavor**](docs/usage.md) (_all_ SDK's functionalities, in the Browser) | ||
| ```js | ||
| // Start the instance using Universal flavor | ||
| import Ae from '@aeternity/aepp-sdk/es/ae/universal' | ||
| import Node from '@aeternity/aepp-sdk/es/node' | ||
|
|
||
| // const node1 = await Node({ url }) | ||
|
|
||
| Ae({ | ||
| nodes: [ | ||
| // { name: 'someNode', instance: node1 }, | ||
| // node2 | ||
| ], | ||
| compilerUrl: 'https://compiler.aepps.com', | ||
| accounts: [ | ||
| MemoryAccount({ keypair: { secretKey: 'A_PRIV_KEY', publicKey: 'A_PUB_ADDRESS' } }), | ||
| // acc2 | ||
| ], | ||
| address: 'SELECTED_ACCOUNT_PUB', | ||
| networkId: 'ae_uat' // or any other networkId your client should connect to | ||
| }).then(ae => { | ||
|
|
||
| // Interacting with the blockchain client | ||
| // getting the latest block height | ||
| ae.height().then(height => { | ||
| // logs current height | ||
| console.log('height', height) | ||
| }).catch(e => { | ||
| // logs error | ||
| console.log(e) | ||
| }) | ||
|
|
||
| // getting the balance of a public address | ||
| ae.balance('A_PUB_ADDRESS').then(balance => { | ||
| // logs current balance of "A_PUB_ADDRESS" | ||
| console.log('balance', balance) | ||
| }).catch(e => { | ||
| // logs error | ||
| console.log(e) | ||
| }) | ||
| }) | ||
| ``` | ||
| ## Quick _Browser_ Examples for: | ||
| ### 1. Wallet Example (_only_ Wallet's functionalities) | ||
| > interact with aeternity's blockchain's [**Wallet flavor**](docs/usage.md) – For _Wallet_ development | ||
| > You can find a more [complete example using VueJS here](browser/vuejs/connect-two-ae/README.md) | ||
|
|
||
| ```js | ||
| // Start the instance using Wallet flavor | ||
| import Wallet from '@aeternity/aepp-sdk/es/ae/wallet' | ||
| const walletBalance | ||
|
|
||
| // Simple function to Guard SDK actions | ||
| const confirmDialog = function (method, params, {id}) { | ||
| return Promise.resolve(window.confirm(`User ${id} wants to run ${method} ${params}`)) | ||
| } | ||
|
|
||
| Wallet({ | ||
| nodes: [ | ||
| // { name: 'someNode', instance: node1 }, | ||
| // mode2 | ||
| ], | ||
| compilerUrl: 'https://compiler.aepps.com', | ||
| accounts: [ | ||
| MemoryAccount({ | ||
| keypair: { | ||
| secretKey: 'secr3tKeYh3RE', | ||
| publicKey: 'ak_pUbL1cH4sHHer3' | ||
| } | ||
| }) | ||
| ], | ||
| address: 'ak_pUbL1cH4sHHer3', | ||
| onTx: confirmDialog, | ||
| onChain: confirmDialog, | ||
| onAccount: confirmDialog, | ||
| onContract: confirmDialog, | ||
| networkId: 'ae_uat' // or any other networkId your client should connect to | ||
| }).then(ae => { | ||
|
|
||
| // Interact with the blockchain! | ||
| ae.balance(this.pub).then(balance => { | ||
| walletBalance = balance | ||
| }).catch(e => { | ||
| walletBalance = 0 | ||
| }) | ||
| }) | ||
| ``` | ||
|
|
||
| ### 2. Aepp Example (Aepp <--> Wallet via RPC) | ||
| > interact with aeternity's blockchain's [**Aepp flavor**](docs/usage.md) – For _Aepps_ development AKA DApp development | ||
| > You can find a more [complete example using VueJS here](browser/vuejs/connect-two-ae/README.md) | ||
|
|
||
| ```js | ||
| // Start the instance using Aepp flavor | ||
| import Aepp from '@aeternity/aepp-sdk/es/ae/aepp' | ||
| const pubKey | ||
|
|
||
| // Here, we're not initialising anything, assuming that this is an Aepp (DApp) | ||
| // working inside an Iframe of a "Wallet flavored" JS App | ||
| Aepp().then(ae => { | ||
|
|
||
| // Interact with the blockchain! | ||
| ae.address() | ||
| .then(address => { | ||
| //get address of the Wallet used by this Aepp | ||
| pubKey = address | ||
| }) | ||
| .catch(e => { console.log(`Rejected: ${e}`) }) | ||
| }) | ||
| ``` | ||
| ## Run in the terminal (NodeJS) | ||
| 1. [Simple Contract](../docs/examples/node/contract.md) - [Code](node/contract.js) | ||
| 2. [Wallet](../docs/examples/node/wallet.md) - [Code](node/wallet.js) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| # How to Connect Wallet to Aepp using Aeternity's JS SDK | ||
|
|
||
| ## Introduction | ||
| In aeternity ecosystem, the app that has access to user's private keys and grants other apps | ||
| access to them is called wallet. Respectively, the app that is granted access is called aepp. | ||
|
|
||
| This folder has been created to **showcase the aeternity SDK integration** to both wallets and aepps. | ||
|
|
||
| ## Setup info | ||
| If you are trying these examples after checking out the entire Aepp-SDK repo (this repo), | ||
| you want to first run `npm install`, from the repo root, to get all the SDK dependencies installed, | ||
| and only then, move to individual apps installations. | ||
|
|
||
| ## Available examples | ||
|
|
||
| ### 1. Aepp | ||
| The Sample [Aepp](aepp) project (Distributed App or dapp) shows how you can create a simple Aeternity Aepp, | ||
| dependent on a Wallet, in this case: offering the possibility to work with contracts. | ||
|
|
||
| ### 2. Wallet WebExtension | ||
| The [Wallet WebExtension](wallet-web-extension) example project shows how you can create a simple | ||
| Aeternity Wallet as a Chrome/Firefox browser extension. This approach is actively used in | ||
| [Superhero Wallet](https://github.com/aeternity/superhero-wallet). | ||
|
|
||
| ### 3. iframe-based Wallet | ||
| The [Wallet](wallet-iframe) example project shows how you can create a simple Aeternity Wallet | ||
| that opens aepps in iframe. This approach is actively used in [Base aepp](https://github.com/aeternity/aepp-base). |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| # Sample Aepp for Contracts | ||
|
|
||
| ## Overview | ||
| This is a sample Aepp that compiles contracts using the Aeternity JavaScript SDK. | ||
|
|
||
| ### How it works | ||
| 1. Choose the wallet example from [examples](..) folder (the simplest is [iframe-based Wallet](../wallet-iframe)) | ||
| 2. Start the wallet according to its readme | ||
| 3. Start this Aepp, which will start on port [9001](http://localhost:9001) | ||
| 4. Connect this Aepp to a choosed wallet according to its readme | ||
|
|
||
| ## Installation and running | ||
| 1. Install required dependencies with `npm install` | ||
| 1. Start the application `npm run start:dev` |
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.