Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/krpeacock/auth-client-demo
Example demo of how to use https://www.npmjs.com/package/@dfinity/auth-client to make authenticated calls to an IC app
https://github.com/krpeacock/auth-client-demo
authentication internet-computer javascript
Last synced: 3 months ago
JSON representation
Example demo of how to use https://www.npmjs.com/package/@dfinity/auth-client to make authenticated calls to an IC app
- Host: GitHub
- URL: https://github.com/krpeacock/auth-client-demo
- Owner: krpeacock
- Created: 2021-05-07T00:17:38.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-06-20T18:39:15.000Z (5 months ago)
- Last Synced: 2024-06-21T18:08:53.430Z (5 months ago)
- Topics: authentication, internet-computer, javascript
- Language: JavaScript
- Homepage: https://vasb2-4yaaa-aaaab-qadoa-cai.ic0.app/
- Size: 2.92 MB
- Stars: 71
- Watchers: 4
- Forks: 32
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-icp - krpeacock/auth-client-demo - client to make authenticated calls to an IC app (Front-end)
README
---
keywords: [intermediate, motoko, authentication, internet identity, integrate, auth, user auth]
---
# Auth-client
[View this sample's code on GitHub](https://github.com/dfinity/examples/tree/master/motoko/auth_client_demo)
This is an example project intended to demonstrate how a developer might integrate with [Internet Identity](https://identity.ic0.app).
:::info
This example uses TypeScript. See an alternative [vanilla JS example](https://github.com/krpeacock/auth-client-demo/tree/vanilla-js).
:::
[View a live demo of this sample](https://vasb2-4yaaa-aaaab-qadoa-cai.ic0.app/).
This example shows how to use [@dfinity/auth-client](https://www.npmjs.com/package/@dfinity/auth-client).
## Setting up for local development
To get started, start a local `dfx` development environment in this directory with the following steps:
```bash
git clone https://github.com/dfinity/examples
cd examples/motoko/auth-client-demo/
dfx start --background --clean
dfx deps deploy
dfx deploy
```
This will deploy the vanilla JS (using lit-html) version of the application as well as Internet Identity and the `whoami` canister. You can access the canister using the link provided from running `dfx deploy`
Once deployed, start the development server with `npm start`.
You can now access the app at `http://127.0.0.1:5173/`.
## Multiple versions
This demo has multiple versions, each of which demonstrates a different feature of the auth-client. `npm start` will run the vanilla JS version, but you can run the others by running `npm run start:version` where `version` is one of the following:
- React
- Vue
- Vanilla
- Svelte
> Note: the svelte project was created using sveltekit, and has its own `package.json`. Cd into ./src/auth_client_demo_assets/svelte and run `npm install` to run the svelte version.
You can also deploy each of the frontend canisters by editing `package.json` to run the `build:version` script, and `dfx.json` to pull from the `dist` directory of that framework.
## Pulling Internet Identity into your project
To pull Internet Identity into your project, you'll need to do the following:
- #### Step 1: Add Internet Identity to your `dfx.json` file:
```json
"internet-identity" : {
"type": "pull",
"id": "rdmx6-jaaaa-aaaaa-aaadq-cai"
}
```
- #### Step 2: Run the following commands to install the dependencies:
```bash
dfx deps pull
dfx deps init --argument '(null)' internet-identity
dfx deps deploy
```