CoCreate-api is a simple api helper component in vanilla javascript used by JavaScript developers to create thirdparty api intergrations. Thirdparty apis can be accessible using HTML5 attributes and/or JavaScript API. CoCreate-api includes the client component and server side for api processing.
npm i @cocreate/api
Or you can use cdn link:
<script>https://cdn.cocreate.app/api/latest/CoCreate-api.min.js</script>
CoCreate.js, CoCreate-api.js,
1. Rules
(1). Module should be CoCreate-{module_id}.js
Ex: CoCreate-stripe.js
(2). Module should include the actions that has unique name
(3). Module id and the endpoint is same.
(4). Action function name should be "action_{action_name}"
(5). Pre-processing function name should be "pre_{action_name}"
(6). Register module
Ex: CoCreateApi.register(CoCreateStripe.id, CoCreateStripe);
Stripe modules case's example
const CoCreateStripe = {
id: 'stripe', //. module id
actions: [ //. module actions
'CreateCustomer',
'CreateCard',
],
pre_CreateCustomer: function(data) {
console.log(data);
},
action_CreateCard: function(element, data) {
}
}
CoCreateApi.register(CoCreateStripe.id, CoCreateStripe);
2. Cycle Chain
(1). When click action button, Run action
(2). Run action function.If action function defined in module, the action function (action_{action_name}) call.
(2)-1. If action function defined in module, the action function (action_{action_name}) call.
(2)-2. If action funciton undefined in module, the common action function call.
- Get the dat from form
- Send the data and action by endpoint into server
(3). Server Processing.
(4). Received the response from server.
(5). If pre-processing function defined in module, the pre-processing function (pre_{action_name}) call.
(6). Call the render function by action .
(7). Fire the event for end (event name is {action_name})
(8). Run the next action by cocreate-action
3. Description
Action function
---------------------Module-----------------
// element: Node to define action
// data: data to receive from previous action
function action_{action_name}(element, data)
--------------------HTML------------------------
<button actions="{action_name}, {action_name1}, ...">Run</button>
Example:
action_CreateCard: function(element, data) {}
<button actions="CreateCustomer, CreateCard">Run</button>
Pre-processing function
// data: response data from server
function pre_{action_name}(data)
Example:
pre_CreateCard: function(data) {
localstorage['card'] = data['response'];
}
Server response
{
type: "{action_name}",
response: {...}
}
How Does It Works
CoCreate-api module works based on cocreate.api.
xxxxxx action_{action_name}
. pre_{action_name}