@kamen/create-webapp

@kamen/create-webapp

Project Scaffolding (wip)

$ npm init @kamen/webapp

or

$ deno run npm:@kamen/create-webapp

Utility Functions

Basic example

Static import from NPM

import {
    createRandomFromRange,
    createRandomFromList
} from '@kamen/create-webapp/helpers/random';

Dynamic import from CDN

const {
    createRandomFromRange,
    createRandomFromList
} = await import('https://esm.run/@kamen/create-webapp/helpers/random');

function characterListFromCharacterRange(minCharacter = 'a', maxCharacter = 'z') {
    const characterCodeRange = [String(minCharacter).charCodeAt(), String(maxCharacter).charCodeAt()];
    const minCharacterCode = Math.min(...characterCodeRange);
    const maxCharacterCode = Math.max(...characterCodeRange);
    const length = maxCharacterCode - minCharacterCode + 1;
    return Array.from({length}, (_, index) => String.fromCharCode(index + minCharacterCode));
}

function characterListFromCharacterRanges(characterRanges = [['0', '9'], ['a', 'z'], ['A', 'Z']]) {
    return characterRanges
        .map(characterRange => characterListFromCharacterRange(...characterRange))
        .flat();
}

const ageHandler = createRandomFromRange(0, 99);
const colorHandler = createRandomFromList(['red', 'green', 'blue']);
const stateHandler = createRandomFromList([true, false]);
const characterHandler = createRandomFromList(characterListFromCharacterRanges());
const identHandler = () => Array
    .from({length: 1 << 6}, characterHandler)
    .join('');
const data = Array
    .from({length: 1 << 8}, (_, index) => ({
        index,
        age: ageHandler(),
        color: colorHandler(),
        state: stateHandler(),
        ident: identHandler()
    }));

console.dir(data);

Advanced example

SVG Path Generative Art