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

@lava.ts/serializable

v0.4.0

Published

Library to manage Wanadev's projects, by replacing abitbol-serializable

Downloads

1,620

Readme

@lava.ts/serializable

Name

Lava.ts Serializable

Description

Typescript classes for data serialization

Visuals

Depending on what you are making, it can be a good idea to include screenshots or even a video (you'll frequently see GIFs rather than actual videos). Tools like ttygif can help, but check out Asciinema for a more sophisticated method.

Installation

npm install @lava.ts/serializable

Usage

import { SerializableClass } from "@lava.ts/serializable/lib/SerializableClass";
import { AutoSerializer } from "@lava.ts/serializable/lib/AutoSerializer";
import { addSerializer } from "@lava.ts/serializable/lib/serializers";

export class MyDataClass extends SerializableClass {
    static __name__ = "my-data-class"; // name for serializable class

    declare $data: { // raw data
        position: number,
        type: string,
    };

    constructor(params: Record<string, unknown>) {
        super({
            position: 0,
            type: "default",
            ...params,
        }); // contructor apply parameters to setters
    }

    get position() { // computed getter
        return this.$data.position;
    }

    set position(position) { // computed setter
        this.$data.position = position;
    }

    get type() {
        return this.$data.type;
    }

    set type(type) {
        this.$data.type = type;
    }

    // directive to mark field as not serializable
    get triple() {
        "@serializable false";

        return this.position * 3;
    }

    set triple(triple) {
        this.position = triple / 3;
    }

}

// AutoSerializer serializes all fields with a getter and a setter
// expect if directive `"@serializable false"` has been set
const autoserializer = new AutoSerializer(MyDataClass);

addSerializer(autoserializer);

export default MyDataClass;

Support

Submit issue on github or gitlab

Roadmap

  • Project Manager with Structures
  • History manager for undo/redo
  • Integration with Vue.js reactivity

Contributing

Not open for contribution at the moment. Currently building the first steps of the librairy

Authors and acknowledgment

License

BSD-3-Clause

Project status

Currently building the first steps of the librairy