JSPM

  • Created
  • Published
  • Downloads 38
  • Score
    100M100P100Q70786F
  • License MIT

Spacy, Simple, Scalable State Management Framework

Package Exports

  • @agile-ts/core

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@agile-ts/core) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

AgileTs

Spacy, Simple, Scalable State Management Framework


GitHub License npm minified size npm total downloads

Build Status Build Status

Tweet


How to create a State?
// -- core.js ------------------------------------------

// Let's start by creating an Instance of AgileTs
const App = new Agile();

// Now we are able to build our first State πŸ˜ƒ
const MY_FIRST_STATE = App.createState("Hello Stranger!");


// -- myComponent.whatever ------------------------------------------

// Finally, we bind our just created State to our desired UI-Component
// And wolla its reactive. Everytime the State mutates the Component gets rerendered
const myFirstState = useAgile(MY_FIRST_STATE); // returns value of State ("Hello Stranger!")

To find out more checkout our documentation.

⛳️ Sandbox

Test AgileTs yourself, it's only one click away. Just select your preferred Framework below.

  • React
  • Vue (coming soon)
  • Angular (coming soon)


Why should I use AgileTs?

πŸš… Straightforward

Write minimalistic, boilerplate free code that captures your intent.

Some straightforward syntax examples:

  • Store State in the Local Storage
    MY_STATE.persist("storage-key")
  • Create reactive Collection of States
    const MY_COLLECTION = App.Collection();
    MY_COLLECTION.collect({id: 1, name: "Frank"});
    MY_COLLECTION.collect({id: 2, name: "Dieter"});
  • Mutate or Check States with simple Functions
    MY_STATE.undo(); // Undo last change
    MY_STATE.is({hello: "jeff"}); // Check if State has the Value {hello: "jeff"}

πŸ€Έβ€ Flexible

  • Works in nearly every UI-Framework. Check here if your desired framework is supported, too.
  • Surly behaves with the workflow that suits you best. No need for reducers, actions, ..
  • Has no external dependencies

🌌 Centralize

Manage your Application Logic in a central place outside any UI-Framework. This makes your code more decoupled, portable, and above all, easily testable.

🎯 Easy to Use

Learn the powerful tools of AgileTs in a short amount of time. A good place to start is in our documentation. And I'm sure you'll be able to use AgileTs very soon.

πŸƒ Lightweight

AgileTs has an unpacked size of 52.7kB and 0 dependencies.



Installation

To properly use AgileTs, in an UI-Framework we need two packages.

  • The Core Package, which acts as the brain of AgileTs and manages all our States

    npm install @agile-ts/core
  • And a fitting Integration for our preferd UI-Framework.. in my case React. Check here if your desired Framework is supported, too.

    npm install @agile-ts/react


Documentation

If AgileTs sounds interesting to you. Checkout our docs. And I am sure you will be able to use it in no time. In case you have any questions don't mind joining our Discord Community.



Contribute

Get a part of AgileTs and start contributing. To find out more checkout the CONTRIBUTING.md. We welcome any meaningful contribution πŸ˜€

Maintainability

Packages of Agile
Name Latest Version Description
@agile-ts/core badge Brain of Agile
@agile-ts/react badge React Integration
@agile-ts/api badge Promise based Api
@agile-ts/multieditor badge Simple Form Manager


Credits

AgileTs is inspired by PulseJs