DEV Community: Alleo

Fortress wallets vs disposable envelope

Alleo — Tue, 02 Jun 2026 14:34:25 +0000

Fortress wallet vs disposable envelope

A fortress wallet (like MetaMask) is meant to be kept in a secure place for a long time—often years—and used to hold funds you care about over the long term. You guard one root secret (typically a seed phrase). You do not paste it into a chat or email.

In everyday life the opposite is also needed: a disposable envelope. Something is placed inside, handed off, and the envelope is discarded. For crypto, that means a one-time wallet: create it, fund it, transfer full ownership, and move on.

Examples:

Create many wallets, fund them with a memecoin or NFT, and distribute them to campaign participants.
Gift crypto without asking for a recipient’s address—fund a wallet and send the wallet itself (link or QR), not only a transfer to an address they already have.

The sections below describe how that one-time model is implemented: client-side key derivation, credential rules, and Scrypt parameters.

Security philosophy

For a disposable envelope, the purpose is literally one-time. It is not a vault for large amounts, and top-tier cold-storage security is not the main goal. Convenience comes first.

That leads to a deterministic design: the same credentials always produce the same private key. Converting passphrase and PIN into a key with a one-way process is the natural implementation.

Brain wallets already demonstrated the failure mode—weak passwords hashed once and guessed at scale. The choice of hash function and its parameters therefore matters.

Scrypt was chosen and tuned for a tradeoff between safety and hashing time on desktop and mobile browsers. Same credential → same wallet (same private key). Brute force is made expensive; a GPU farm should not be economical to crack a five-dollar gift wallet.

passphrase + PIN → zxcvbn checks → Scrypt → Keccak256 → private key → address

Everything runs in the browser. There is no server that stores or recovers your credentials.

Passphrase + PIN, auto-fill, and zxcvbn

Even when “maximum security” is not the product goal, funds in the envelope should still be reasonably safe.

People often pick weak or already-leaked passwords. The app enforces zxcvbn before hashing and rejects weak passphrase/PIN pairs.

User-typed secrets usually have lower entropy than machine-generated ones. Auto-fill (randomPassphrase() and randomPIN() in @mybucks.online/core) was added so strong credentials can be generated without the user inventing them for every gift.

For a one-time wallet: generate with auto-fill, fund, hand off, discard the credentials after claim. Do not reuse your email, bank, or MetaMask passwords.

There is no “forgot password” recovery. If credentials are lost, funds on that address are gone.

Key generation

Minimal JavaScript for the Scrypt path used by mybucks.online (also in @mybucks.online/core and key-generation):

import { Buffer } from "buffer";
import { ethers } from "ethers";
import { scrypt } from "scrypt-js";

const abi = new ethers.AbiCoder();

const HASH_OPTIONS = { N: 131072, r: 8, p: 1, keyLen: 64 };
const KDF_DOMAIN_SEPARATOR = "mybucks.online-core.generateHash.v2";

async function generatePrivateKey(passphrase, pin) {
  const encoded = abi.encode(
    ["string", "string", "string"],
    [KDF_DOMAIN_SEPARATOR, passphrase, pin],
  );
  const saltBuffer = Buffer.from(ethers.keccak256(encoded).slice(2), "hex");

  const hashBuffer = await scrypt(
    Buffer.from(passphrase),
    saltBuffer,
    HASH_OPTIONS.N,
    HASH_OPTIONS.r,
    HASH_OPTIONS.p,
    HASH_OPTIONS.keyLen,
    (p) => console.log(Math.floor(p * 100)),
  );
  const hashHex = Buffer.from(hashBuffer).toString("hex");
  return ethers.keccak256(abi.encode(["string"], [hashHex]));
}

Using the npm package:

import { generateHash, getEvmWalletAddress } from "@mybucks.online/core";

const hash = await generateHash(passphrase, pin);
const address = getEvmWalletAddress(hash);

Key generation docs · CodeSandbox

Next (series): Gifting links and #wallet= URL delivery.

v-show versus .d-flex !!

Alleo — Fri, 14 May 2021 08:35:06 +0000

While programming with Vue/Bootstrap, I was facing one case that v-show is not working unexpectedly.
In the below example, those two div elements are always visible, not based on showBack.
So I wondered, is Vue having some internal problem? :)

<div class="d-flex justify-content-between" v-show="showBack">
~~
</div>
<div class="d-flex justify-content-end pt-4" v-show="!showBack">
~~
</div>

But finally I noticed, the reason.
v-show="false" => display: none;
.d-flex in bootstrap, => display: flex!important. omg~~

Do you have any experience like this?
With this opportunity, I noticed, that I am not still professional myself. lol

JavaScript Arrow & Regular functions case study

Alleo — Mon, 16 Nov 2020 12:04:37 +0000

We know the differences between arrow and regular functions in JavaScript. But sometimes I often meet difficult situations to predict the running results of JavaScript functions correctly.
So I have built simple test scripts to explain deeper about JavaScript functions and introduce here.
For the beginners, please visit here.

const case1 = {
    name: "Case1",
  fnArrow: () => {
    console.log("case1/fnArrow: ", this.name)
  },
  fnRegular: function(){
    console.log("case1/fnRegular: ", this.name)
  },
  fnArrowOutside: () => {
    console.log("case1/fnArrowOutside: ", this.name)
  },
  fnRegularOutside: function(){
    console.log("case1/fnRegularOutside: ", this.name)
  },
}

class Case2 {
    constructor() {
    this.name = "Case2"
  }
  fnArrow = () => {
    console.log("case2/fnArrow: ", this.name)
  }
  fnRegular(){
    console.log("case2/fnRegular: ", this.name)
  }
  fnArrowOutside = () => {
    console.log("case2/fnArrowOutside: ", this.name)
  }
  fnRegularOutside(){
    console.log("case2/fnRegularOutside: ", this.name)
  }
}
const case2 = new Case2()

case1.fnArrow();
case1.fnRegular();
case2.fnArrow();
case2.fnRegular();

setTimeout(case1.fnArrowOutside, 100);
setTimeout(case1.fnRegularOutside, 200);
setTimeout(case2.fnArrowOutside, 300);
setTimeout(case2.fnRegularOutside, 400);

And this is a running result.

CSS Selectors 'nth-of-type' and '~'

Alleo — Thu, 01 Oct 2020 00:42:48 +0000

Description

p:nth-of-type(2)
/* Selects every <p> element that is the second <p> element of its parent */

p ~ ul
/* Selects every <ul> element that are preceded by a <p> element */

I often use those 2 selectors in CSS stylesheet.
But I did not know about this correctly.
So I would like to share about my fault here with all of us.

div:nth-of-type(2n){
  background-color: red;
}
.c ~ .c {
  background-color:blue;
}
.d ~ .c {
  background-color:green;
}

Tools for work and project!

Alleo — Sun, 20 Sep 2020 15:05:48 +0000

What kind of tools are you using for development?
I am using these ones. and you ?
What is more effective and convenient?
Let's share our environment, and improve our productivity here.

Documentation

notion, asana

Wireframing

balsamiq

UI/UX Design

Figma, Photoshop

communication

slack

editor

VScode, vim

Version control

sourcetree

screenshot sharing & highlighting

cloudapp

screen recording

Snagit

Browsers

Chrome, Firefox

Chrome Extensions

lighthouse, Windows Resizer, Pesticide

How can I refactor this code snippet?

Alleo — Sat, 19 Sep 2020 08:55:29 +0000

While developing vuejs project, I often meet a situation like the following:
Here "this" is the vue component.
I would love to refactor this code to look it very nice.
Please share your idea with me.
Thank you.

const newReportPart = {
        id: this.id,
        title: this.title,
        description: this.description,
        product_id: this.product_id,
        product_title: this.product_title,
        rate: this.rate,
        saved: this.saved,
        attachments: this.attachments,
      };
      this.$emit('submitReportPart', this.index, newReportPart);

Beginners' free but exciting trip to ReactJS with CardGame!

Alleo — Fri, 18 Sep 2020 09:33:45 +0000

Hello All Beginners!
I would like to introduce one of my Reactjs example projects here.
It has used React, Redux, and axios to communicate with Rails based backend.

1 Minute's demonstration video here.
https://drive.google.com/file/d/1ouZHTJv2J71HVZSfRgqFxvaXuVi5pvkO/view?usp=sharing

It was very difficult to implement small & simple logic game with plain #JavaScript, but now with #ReactJS, and it gives us great possibility to build anything we want.
But here it also requires great wisdom and knowledge to divide and modularize the project into components.
And one more important thing is to manage the status flow with the sequences of user's activity.
Please feel free to take a look at the source repository.
Then you will notice easily about components, and state management.

How ReactJS creates inside functions? amazing !

Alleo — Wed, 19 Aug 2020 00:05:06 +0000

In the past, I did not care how ReactJS creates functions and variables while re-rendering components.
But I had a few chance to look at about this.

Now ReactJS creates all functions and variables newly whenever they re-render their component.
To optimize performance with memory, useCallback was very effective for this, and decreased re-creation times a lot more.
Please check my repository, and github pages to test.

https://github.com/yeahCH/react-performance-inspector
https://yeahch.github.io/react-performance-inspector/

NestJS-JumpStart

Alleo — Tue, 18 Aug 2020 00:50:59 +0000

github.com/clj-solutions/nestjs-jumpstart

Nest (NestJS) is a framework for building efficient, scalable Node.js server-side applications. It uses progressive JavaScript, is built with and fully supports TypeScript (yet still enables developers to code in pure JavaScript) and combines elements of OOP (Object Oriented Programming), FP (Functional Programming), and FRP (Functional Reactive Programming).

For beginners, it is a bit difficult to land on, and develop a new project with it.
So I have created public repo as a jumpstart, and here it provides basic authentication by passport and unit testing by jest.
Please take a look, and give your feedback.
Thank you.

CardGame by ReactJS

Alleo — Tue, 18 Aug 2020 00:44:06 +0000

ReactJS is very popular thesedays, and it is really helpful to build a web application by component based.
For beginners, I have created my own card game with ReactJS.

Major Components
CardHolder
Card
BlankCard
BackCard

Now it is not enough to play with good mood, and much things to update.
Welcome for any developers to contribute, and provide great idea.