@agile-ts/core

Spacy, Simple, Scalable State Management Framework

🚀 Look how easy it is

Below example is based on React

// At first we have to create an Instance of Agile
const App = new Agile();

// Now we can create a State which has an initial Value of "Hello Stranger!"
const MY_FIRST_STATE = App.State("Hello Stranger!");

// Our cool React Component
const RandomComponent = () => {
    // With the Hook 'useAgile' we bind the State to our 'RandomComponent'
    const myFirstState = useAgile(MY_FIRST_STATE); // Returns "Hello Stranger!"
                                                              //       ^
    return (                                                  //       |
        <div>                                                 //       |  Through the 'set' action the State Value 
            <p>{myFirstState}</p>                             //       |  gets changed to "Hello Friend!" 
            <button                                           //       |  and causes a rerender on this Component.
                onClick={() => {                              //       |  -> myFirstState has the Value "Hello Friend!"
                    // Lets's update the State Value          //       |
                    MY_FIRST_STATE.set("Hello Friend!") // -------------
                }}
            >
                Update State
            </button>
        </div>
    );
}

You can't believe the simplicity?! Convince yourself here.

❓ Why AgileTs

🚅 Straightforward

Write minimalistic, boilerplate free code that captures your intent.
For instance

• Store State in Local Storage

  MY_STATE.persist("storage-key")
  

• Reactive Collection of States

  const MY_COLLECTION = App.Collection();
  MY_COLLECTION.collect({id: 1, name: "Frank"});
  MY_COLLECTION.collect({id: 2, name: "Dieter"});
  

• Cool State checks and mutations

  MY_STATE.undo(); // Undo last change
  MY_STATE.is({hello: "jeff"}); // Check if State has the Value {hello: "jeff"}
  

🤸‍ Flexible

Agile can be used in nearly every UI-Framework and surly works with the workflow that suits you best, since Agile isn't bound to dispatches, reducers, ..

🎯 Easy to Use

Learn the powerful and simple tools of Agile in a short amount of time.

⛳️ Centralize

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

🍃 Lightweight

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

⬇️ Installation

npm install @agile-ts/core

To use Agile we have to install the core package, it's the brain and handles your States, Collections, ..

npm install @agile-ts/react

In addition, we need to install a fitting integration for the Framework we are using.. in my case React.

📄 Documentation

The Agile Docs are located here

🗂 Packages of Agile

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

👨‍💻 Contribute

Feel free to contribute

🌠 Credits

AgileTs is inspired by PulseJs