npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

butility

v1.0.1

Published

Browser Utility, a set of utility classes, is the new version of the deprecated Awedde package, offering a streamlined set of utility classes across four modules: DOM, Form, Network, and Media and Device. These utilities simplify common web development ta

Downloads

8

Readme

Browser Utility

New Release Version 1.0.1

This update addresses the issue with ./file/file.js not providing the File module and enhances flexibility with import statements.

Example usage for the new import:

// Import a single class or method
import { Element } from "./butility/dist/index.js";

// Import all methods with your own declaration
import * as YourAppModule from "./butility/dist/index.js";

This change enables developers to import specific components or modules from the butility library, enhancing code organization and providing more flexibility in project structures.

Description:

Browser Utility is a comprehensive set of utility classes designed to streamline common web development tasks. It serves as the successor to the deprecated Awedde package, offering improved functionality, reduced redundancy, and enhanced code quality. Browser Utility consists of four modules: DOM, Form, Network, and Media and Device, each providing a range of utilities to simplify web development processes.

Modules:

  1. DOM Module:

    • Provides utilities for DOM manipulation, such as adding and removing classes, handling events, and creating and modifying elements.
  2. Form Module:

    • Offers utilities for form manipulation, including validation, serialization, and submission handling.
  3. Network Module:

    • Includes utilities for making HTTP requests, handling responses, and managing network-related tasks.
  4. Media and Device Module:

    • Provides utilities for working with media elements (such as images and videos) and accessing device-related information (such as screen size and orientation).

Features:

  • Streamlined set of utility classes for common web development tasks.
  • Improved functionality compared to the deprecated Awedde package.
  • Reduced redundancy and enhanced code quality.
  • Four distinct modules covering DOM manipulation, form handling, network requests, and media/device interactions.

Usage:

  1. Install the Browser Utility package using npm package manager.
  2. Import the desired modules or specific utility classes into your project.
  3. Utilize the provided utility methods to simplify and optimize your web development workflow.

Example:

  1. Install the Browser Utility package using npm package manager:

    npm install butility

    Or use jsdelivr cdn

    import BrowserUtility from "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.min.js";
    <script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/index.min.js"></script>
    
  2. Import the desired modules or specific utility classes into your project:

    import BrowserUtility from "./butility/dist/index.js";
    // or
    import { dom } from "./butility/dist/index.js";
    import { form } from "./butility/dist/index.js";
  3. Utilize the provided utility methods to simplify and optimize your web development workflow.

Example:

import { dom } from "./butility/dist/index.js";
import { form } from "./butility/dist/index.js";

const emailInput = dom.Element.createElement({  // Using the dom Element method
    name: 'input',
    class: ['input', 'input-form'],
    attr: {
        id: 'email',
        type: 'email',
        name: 'email',
        required: true,
        placeholder: 'Email',
    },
}, e => {
    e.addEventListener('change', () => {
        form.Validate.validateEmailAddress(e.value); // Using form Validate method
    });
});

dom.Element.appendElement(document.body, emailInput);

Note:

Browser Utility aims to provide a modern and efficient solution for common web development tasks, offering improved functionality and code quality compared to previous solutions.

Contribution:

Contributions to Browser Utility are welcome! If you'd like to contribute, please follow these guidelines:

  • Fork the repository and create a new branch for your feature or bug fix.
  • Make your changes, ensuring they adhere to the project's coding style and conventions.
  • Write tests to cover your changes, if applicable.
  • Submit a pull request detailing the changes you've made and any relevant information.

Made By:

Browser Utility is developed and maintained by Ermiyas Arage.

License:

Browser Utility is licensed under the MIT License. You are free to use, modify, and distribute this software under the terms of the MIT License. See the LICENSE file for details.

If you have any questions, suggestions, or issues, feel free to reach out or open an issue on the project's GitHub repository. Thank you for your interest in Browser Utility!