npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ziko

v0.0.20

Published

a versatile javaScript framework offering a rich set of UI components, advanced mathematical utilities, reactivity, animations, client side routing and graphics capabilities

Downloads

316

Readme

💡 Zikojs a versatile JavaScript library offering a rich set of UI components, advanced mathematical utilities,Reactivity,animations,client side routing and graphics capabilities

Install

npm install ziko

🎬 Demos

Features :

🔰 Seamlessly operates in both browser and Node.js environments

🔰 Mathematical Utilities & Tips

  • Flexible Math Functions :

ZikoJS offers flexible math utilities, such as the mapfun function, which allows mapping standard mathematical operations to complex and nested data structures. For example, the cos function in ZikoJS is built on top of mapfun, enabling it to handle multiple arguments with diverse types (numbers, arrays, objects).

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 :

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]
  • Built in Matrix, Complex, Random ... classes

🔰 No Template Engines :

zikojs UI module adopts a distinctive approach to building and updating user interfaces. It doesn't rely on predefined markup templates. Instead, it leverages a hyperscript-like syntax to dynamically create and update user interfaces.

🔰 Built in File-Based Routing with Single Page Application

ZikoJS provides an intuitive file-based routing mechanism that simplifies the development of single-page applications. By organizing your page components into a directory structure, you can automatically generate routes based on the file paths. This approach enhances the maintainability of your code by allowing you to easily manage and navigate between different views in your application.

To implement file-based routing, simply use the following code:

import { FileBasedRouting } from "ziko";
FileBasedRouting(import.meta.glob("./src/pages/**/*.js"))

In this example, the import.meta.glob function dynamically imports all JavaScript files from the specified directory (./src/pages/**). Each file represents a separate route in your application, allowing you to create a clean and organized routing structure without the need for manual route configuration.

🔰 Flexible Integration with Popular Frameworks/Libraries

ZikoJS is designed to seamlessly integrate into other frameworks and libraries. By installing the ziko-wrapper package, you can easily use ZikoJS within your favorite frontend ecosystems.

Currently supported frameworks:

  • REACT
  • Solid
  • Preact
  • Svelte
  • Vue

🔰 Custom Markdown Parser

Mdzjs allowing you to write markdown content alongside Zikojs Elements

---
 module : 
  - import InteractiveBlock from "./InteractiveBlock"
 title : Article 1
---

# Hello World this is markdown heading 

<InteractiveBlock data = "Hello" />

🔰 Growing Add-On Ecosystem

|Addon|Purpose|Dependencies|Repository| |-|-|-|-| |ziko-gl||threejs| |ziko-code||codeMirror|| |ziko-chart||chartjs|| |ziko-pdf||jsPdf.js|| |ziko-xls||xls.js|| |ziko-lottie||Lottie-web| |ziko-rough||rough.js| |ziko-icons||fontawesome| |ziko-tippy||tippy.js|

🔰 Rich UI elements

🔰 Reactivity

🔰 Time loop and animations support

⭐️ Show your support

If you appreciate the library, kindly demonstrate your support by giving it a star! Star

License

This projet is licensed under the terms of MIT License