apphook: Event-Manager Hook Engine


apphook is a way to implant/modify other piece of code.

It is a lightweight Event-Manager that inspired by Wordpress Hooks

Computer software is a sort of sequence. We build software according to the business.

However, the user's behaviors are out-of-sequence and chaos.

You will never know what users want, how they use your software, what they want to customization.

So, we need to prepare a system to deal with out-of-sequence and chaos, which can make big changes and flexible customization available.

That's why we should know AppHook.

AppHook is a hooks engine which Event-Driven. It can intercept users' behaviors and extend our functionalities.

Quick Start

``bash
npm i --save apphook
`


TypeScript types declarations (.d.ts) are ready.

See examples for usage examples.

Principle

We place AppHook hooks in code and trigger event.

For example, when user click the button A, we can trigger a event called "click:button:A"

We have two way to trigger event:

1. Trigger. When event appear, do some actions or behaviors, it would not change code pipeline path.
2. Filter. When event appear, it will do some actions and behaviors, return a object. It can be an interceptor.

Use Case

- Event Tracking：Don't need to hard code in the code anymore, we can put all event tracking code in the file by bind and unbind.
- Rookie Onboarding: New register user onboarding
- Help Guiding: when the 10th click on a button, popup a UI window.
- Users Tasks: check whether user finished some tasks.
- Marketing Events: If match some condition, do something like popup a marketing ui windows.
- Users Recall: If user has not login 30 days, do something.
- Payment Interception: When click a feature button, users have no payment yet, trigger and open a UI windows until payment finished and go on.
- Third Party: customize 3rd plugins or more features
- ......

Terms

- hook：
- hookState：
- hookArgs：
- binding：
- add_trigger：
- remove_trigger：
- add_filter：
- remove_filter：
- trigger
- triggerCommand:
- triggerCommandArg ：any
- filter：
- filterCommand:
- filterCommandArg:
- rule
- condition
- conditionArgs
- action:
- trigger action:
- trigger command:
- arg:
- filter action:
- filter command:
- filter command arg:
- listener ：
- trigger Listner：
- filter Listner：

Example

$3

`typescript
// Window.tsx
// ...
onClickLoginButton: () => {
// ...
apphook.doTrigger('user:click_login_button');

}
// ...
`

`typescript
// EventTracking.ts, a independent file for event tracking
apphook.addTrigger('user:click_login_button', (args) => {

// Event Tracking Code
EventTracking.track('user:click_login_button', {...});

tracker.track('user:click_login_button', {...});
tracker.setProfile({email:'xxx@xxx.com'});
});
`

$3

`typescript
apphook.addFilter('get_form_name', (defaultValue, args) => {
let user = args[0];
if (user.is_cloud) {
return "Member ID";
} else if (user.is_self_hosted) {
return "Employee ID";
}
return defaultValue;
});
`

`typescript
// UI.tsx