JS/TS Peer for the Fluence p2p network
Go to file
2023-02-15 15:52:06 +04:00
.github feat!: Expose updated JS Client API via js-client.api package (#246) 2023-02-15 03:00:42 +03:00
packages feat!: Expose updated JS Client API via js-client.api package (#246) 2023-02-15 03:00:42 +03:00
.editorconfig Turn on noImplicitAny and strictNullChecks (#153) 2022-05-12 17:14:16 +03:00
.gitignore chore(deps): bump fluence-js to 0.27.0, avm: 0.31.11 (#199) 2022-11-01 20:00:17 +04:00
.npmrc feat!: Standalone web JS Client (#243) 2023-02-13 21:41:35 +07:00
.prettierrc.cjs feat!: Standalone web JS Client (#243) 2023-02-13 21:41:35 +07:00
ci.js Fix issue when FluenceJS was not working in webpack-based web projects (#176) 2022-09-05 18:24:19 +03:00
CONTRIBUTING.md Update readme 2023-02-15 14:56:32 +04:00
DEVLOPING.md fix extension 2023-02-15 15:33:05 +04:00
LICENSE Update readme 2023-02-15 14:56:32 +04:00
package.json feat!: Expose updated JS Client API via js-client.api package (#246) 2023-02-15 03:00:42 +03:00
pnpm-lock.yaml feat!: Expose updated JS Client API via js-client.api package (#246) 2023-02-15 03:00:42 +03:00
pnpm-workspace.yaml Fix issue when FluenceJS was not working in webpack-based web projects (#176) 2022-09-05 18:24:19 +03:00
README.md Add info about Fluence CLI usage 2023-02-15 15:52:06 +04:00
tsconfig.json feat!: Standalone web JS Client (#243) 2023-02-13 21:41:35 +07:00

Fluence JS Client

npm npm

Javascript client to Fluence network

WARNING

Client for NodeJS is broken. We will fix that shortly.

Getting started

Adding JS Client for your web application is very easy

  1. Pick you favorite framework
  2. Add a script tag with the JS Client bundle to your index.html. The easiest way to do so is using CDN (like https://www.jsdelivr.com/ or https://unpkg.com/) The script is large thus we highly recommend to use async attribute

Here is an example using React App and jsdelivr cdn.

  <title>React App</title>
  <script src='https://cdn.jsdelivr.net/npm/@fluencelabs/js-client.web.standalone@0.10.0/dist/js-client.min.js'
    async></script>
</head>

If you can't or don't want to use CDN, feel free to get the script directly from the npm package and host in yourself: https://www.npmjs.com/package/@fluencelabs/js-client.web.standalone. You can find the script in /dist directory of the package. (note: that options means that the developer understands what he's doing and he knows to serve this file from his own web server)

  1. Install the following packages:
npm i @fluencelabs/js-client.api @fluencelabs/fluence-network-environment
  1. In the beginning of your app do the following:
import { Fluence } from "@fluencelabs/js-client.api";
import { krasnodar } from "@fluencelabs/fluence-network-environment";

Fluence.start({
  relay: krasnodar[3],
});

Use aqua in web application

Once you've added the client you can compile aqua and run it in your application.

To compile aqua use Fluence CLI: https://github.com/fluencelabs/fluence-cli

  1. Install package:
npm i -D "@fluencelabs/fluence-cli"
  1. Add a directory in your project for aqua code. e.g _aqua

  2. Put *.aqua files in that directory

  3. Add a directory for compiled aqua files inside you sources. E.G if you app source are located in src folder, you can create src/_aqua

  4. To compile aqua code once run npx fluence aqua -i ./_aqua -o ./src/_aqua/ To watch for changes and recompile on the fly add -w flag npx fluence aqua -i ./_aqua -o ./src/_aqua/

Hint it might be a good idea to add these scripts to your package.json file

For example you project structure could look like this:

 ┣ aqua
 ┃ ┗ hello-world.aqua
 ┣ src
 ┃ ┣ _aqua
 ┃ ┃ ┗ hello-world.ts
 ┃ ┗ index.ts
 ┣ package-lock.json
 ┣ package.json
 ┗ tsconfig.json

And your package json:

{
  ...
  "scripts": {
    ...
    "aqua:compile": "fluence aqua -i ./aqua/ -o ./src/_aqua",
    "aqua:watch": "fluence aqua -w -i ./aqua/ -o ./src/_aqua"
  },
  ...
}

Developing

To hack on the JS Client itself refer to dev page.

Support

Please, file an issue if you find a bug. You can also contact us at Discord or Telegram. We will do our best to resolve the issue ASAP.

Contributing

Any interested person is welcome to contribute to the project. Please, make sure you read and follow some basic rules.

License

All software code is copyright (c) Fluence Labs, Inc. under the Apache-2.0 license.