A versatile JavaScript library offering a rich set of Hyperscript Based UI components, advanced mathematical utilities, interactivity ,animations, client side routing and more ...
npm install zikomapfun function, which allows mapping standard mathematical operations to complex and nested data structures.
cos function in ZikoJS is built on top of mapfun, enabling it to handle multiple arguments with diverse types (numbers, arrays, objects).
js
import { cos, PI } from "ziko";
const result = cos(PI, PI / 2, PI / 4, [PI / 6, PI / 3], {
x: PI / 2,
y: PI / 4,
z: [0, PI / 12],
}
);
/*
result =>
[
-1,
0,
0.707106781186548,
[0.866025403784439, 0.5],
{
x: 0,
y: 0.707106781186548,
z: [1, 0.965925826289068],
},
];
*/
// console.log(result)
`
You can also built your own flexible Math function using this mapfun util :
`js
import { mapfun } from "ziko";
const parabolic_func = (a, b, c, x) => a x 2 + b x + c;
const map_parabolic_func =
(a, b, c) =>
(...X) =>
mapfun((n) => parabolic_func(a, b, c, n), ...X);
const a = -1.5,
b = 2,
c = 3;
const X = [0, 1, 2, 3];
console.log(parabolic_func(a, b, c)(X));
// [3,3,1,3]
`
js
import {p, text, Random} from 'ziko'
const Hello = name => p(
text("Hello ", name)
).onClick(e => e.target.style({color : Random.color()}))
`
- 🔄 Built in State Mangement :
`js
import { tags } from 'ziko/ui'
import {useState, useDerived} from 'ziko/hooks'
const [timer, setTimer] = useState(0);
const converToHMS = seconds => ${Math.floor(seconds / 3600)} : ${Math.floor((seconds % 3600) / 60)} : ${seconds % 60}
const [time] = useDerived(t => converToHMS(t) , [timer] )
tags.p('Elapsed Time : ', time)
let i = 1;
setInterval(()=>{
setTimer(i);
i++
}, 1000)
`
- 📱 Single Page Application With File Based Routing
`js
import { FileBasedRouting } from "ziko";
FileBasedRouting(import.meta.glob("./pages/*/.js"))
`
- 🤝 One Way Interleaving With [Vanjs]()
- ⏰ Time loop and animations support
$3
- 🧩 Extra UI Components : Zextra
- 🖥️ Server Side Rendering With File Based Routing and Client Side Hydration : ziko-server
- 📝 Mdx-Like Markdown Preprocessor : Mdz
- 🔌 Flexible Integration with Popular Frameworks/Libraries : Ziko-wrapper
- 🔄 Bi-directional : React, Preact, Solid, Svelte, Vue , Vanjs
- ➡️ Uni-directional (ZikoJS → X) :
- Astro : (SSR + Client Hydration)
- 📦 Growing Add-On Ecosystem :
- Ziko-Tgl : WebGL/3D Graphics, Built on Top of Threejs
- Ziko-Chart
- Ziko-Code
- Ziko-Lottie
- ...
Install :
`bash
npm i ziko
`
Quick Start :
`bash
npx create-ziko-app [app-title]
``