CoCreate-api modules

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.

Install

npm i @cocreate/api

Or you can use cdn link:

<script>https://cdn.cocreate.app/api/latest/CoCreate-api.min.js</script>

Dependencies components

CoCreate.js, CoCreate-api.js,

Development Guide

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}

Effects and Styles

Events

Demo