🚀 Butility – Your All-in-One Utility Library for Web Development

Hi, I’m 17 and working solo on Butility, a collection of powerful but simple-to-use utility packages that aim to handle everything you need in web development—from media handling to form validation, DOM manipulation, and more!

The GitHub organization

What is Butility?

Butility is an organization of small, focused packages under one consistent structure. Each package handles a specific set of tasks for modern web development, including:

• Media: Access the user's camera and microphone, work with images, files, and more.
• Forms: Validate forms, generate secure passwords, and simplify form submissions.
• DOM: Create and manipulate HTML elements, manage classes, and traverse the DOM with ease.
• Network: Handle AJAX requests, manage files and blobs, and streamline data fetching.

Each package is lightweight and easy to integrate, designed to help you stop juggling multiple libraries.

Why Butility?

Unlike bulky frameworks, Butility lets you pick and choose only what you need, while maintaining the same consistent API across all its packages.

Quick Start

Get started with Butility by installing any of the packages you need:

npm install @butility/media
npm install @butility/dom
npm install @butility/network
npm install @butility/form

Example use:

import { capturePhoto } from "./path/to/@butility/camera.js";
import { downloadBlob } from "./path/to/@butility/blob.js";

const options = {
    targetElementId: 'video-id',
    fileType: 'jpeg'
};

document.querySelector("#capture-btn").addEventListener("click", () => {
    capturePhoto(options).then(photoBlob => {
        downloadBlob(photoBlob, "photo.jpeg");
    }).catch(error => {
        console.error('Error capturing photo:', error);
    });
});

What’s Next?

Butility is growing! I’m planning future packages for CSS styling, device detection, and utilities for arrays, objects, and numbers.

Join the Journey!

Check out the project on GitHub, and I’d love to hear your feedback!

---