Skip to content

ben-haim/demo-ethers-passkeys

 
 

Repository files navigation

Demo Ethers 🤝 Passkeys

This repo contains a sample application for demonstration purposes only, walking through how to create sub-organizations, create private keys, and sign with the @turnkey/ethers signer, using passkeys. Please feel free to clone or fork this repo, or file an issue if there are improvements to be made! ❤️

UI screenshot

The flow showcases 3 ways to make requests to Turnkey:

  • the initial request to create a new sub-organization is authenticated in the NextJS backend with an API signature (using API_PUBLIC_KEY/API_PRIVATE_KEY from your .env.local file)
  • the request to create a new ETH address is signed on the frontend with your passkey, but it's passed to the NextJS backend as a signed request (the body, stamp, and url are POSTed). This lets the backend submit this request on your behalf, and poll until the new "create private keys" activity completes. Once the activity completes it returns the new address to the frontend
  • the request to sign a message is done 100% client-side via a Turnkey Ethers signer (see @turnkey/ethers): it's signed with your passkey, and submitted from the browser to the Turnkey API directly.

If you want to see a Viem demo with API keys instead of passkeys, head to the example with-ethers. A demo using passkeys with Viem can be found here. See our SDK repo for additional packages and examples.

Getting started

1/ Clone or fork this repo

Make sure you have Node.js installed locally; we recommend using Node v16+.

$ git clone https://github.com/tkhq/demo-ethers-passkeys.git
$ corepack enable  # Install `pnpm`
$ pnpm install # Install dependencies
$ pnpm run build  # Compile source code

2/ Setting up Turnkey

The first step is to set up your Turnkey organization and account. By following the Quickstart guide, you should have:

  • A public/private API key pair for Turnkey
  • An organization ID

Once you've gathered these values, add them to a new .env.local file. Notice that your API private key should be securely managed and never be committed to git.

$ cp .env.local.example .env.local

Now open .env.local and add the missing environment variables:

  • API_PUBLIC_KEY
  • API_PRIVATE_KEY
  • NEXT_PUBLIC_TURNKEY_API_BASE_URL
  • NEXT_PUBLIC_ORGANIZATION_ID

3/ Running the app

$ pnpm run dev

This command will start a NextJS app on localhost. If you navigate to https://localhost:3000 in your browser, you can follow the prompts to create a sub organization, create a private key for the newly created sub-organization, and sign a message using your passkey with a ethers custom account!

Legal Disclaimer

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL TURNKEY BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 90.7%
  • CSS 8.8%
  • JavaScript 0.5%