1 · Add the script

Use the pinned CDN URL with its integrity hash — it never changes, so browsers can cache it for a year:

HTML

<script src="https://jskjs.org/cdn/1.0.0/jskjs.min.js"
        integrity="sha384-RAPdwGto8HbdNSv2+1QToJzAy19GmU5390hxU7QTE6/o62UBBrC81ZqKcf3IOMWW"
        crossorigin="anonymous"></script>

Prefer to self-host? Download jskjs.min.js (21.6 KB, 8.1 KB gzipped) or the whole repository. Put the tag at the end of <body>, and register any $.component() or $.store() in a script right after it.

2 · Write your first page

HTML

<!DOCTYPE html>
<html lang="en">
<head><meta charset="utf-8"><title>My first jsKjs page</title></head>
<body>
  <!-- Pulse: reactive state, no JavaScript -->
  <div kj-data="{ count: 0 }">
    <button @click="count++">Clicked <span kj-text="count"></span> times</button>
  </div>

  <!-- Hyper: load HTML from the server on click -->
  <button kj-get="/hello.php" kj-target="#greeting">Say hello</button>
  <p id="greeting" aria-live="polite"></p>

  <ul id="list"><li>One</li><li>Two</li></ul>

  <script src="https://jskjs.org/cdn/1.0.0/jskjs.min.js"></script>
  <script>
    // Core: the jQuery API you know
    $('#list').on('click', 'li', function () { $(this).toggleClass('done'); });

    // Motion: a staggered entrance (seconds, not milliseconds)
    $.from('#list li', { x: -20, opacity: 0, duration: .4, stagger: .1 });
  </script>
</body>
</html>

3 · Add a backend endpoint

Hyper requests expect HTML back. Any server works; on shared hosting, a PHP file is the shortest path:

PHP

<?php // hello.php
header('Content-Type: text/html; charset=utf-8');
$name = htmlspecialchars($_GET['name'] ?? 'world', ENT_QUOTES, 'UTF-8');   // always escape
echo "Hello, $name — served at " . date('H:i:s');