Applying Koa's onion model to front-end requests

• redux

  268 60,503 9.0 TypeScript

  A JS library for predictable global state management

  

/** * Composer * https://github.com/reduxjs/redux/commit/44dfc39c3f8e5e8b51eeab7c44057da6c1086752 * @param {[fuction]} funcs middleware list * @return {function} (...args) => f1(f2(f3(...args))) */ const compose = (funcs) => funcs.reduce((a, b) => (...args) => a(b(...args))); // middlewares const timeout = (next) => async (req) => { console.log("1"); const res = await next(req); console.log("1"); return res; }; const errorHandler = (next) => async (req) => { console.log("2"); const res = await next(req); console.log("2"); return res; }; const eventTracing = (next) => async (req) => { console.log("3"); const res = await next(req); console.log("3"); return res; }; /** * This can be replaced with: fetch, XMLRequest */ const adapter = ({ params }) => { console.log("request"); // mock ruquest return Promise.resolve(`Hello ${params.username}, I'm mock data.`); }; /** * Http method */ const get = async (path, params) => { const dispatch = compose([middleware1, middleware2, middleware3]); return dispatch(adapter)({ path, params }); }; /** * mock login */ const login = async () => { const res = await get("/api/login", { username: "John" }); console.log(res); }; login(); // --- Login output: ---- /** * 1 * 2 * 3 * request * 3 * 2 * 1 * Hello John, I'm mock data. */

• resreq

  1 22 5.9 TypeScript

  🍭 Fetch-based onion model http client.

Github: https://github.com/molvqingtai/resreq

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

Suggest a related project