Grecha-Susha.js, a modern Multi-Sided Framework

General Showcase
, , , , ,
1

Modern JS+Web framework

<!DOCTYPE html>
<html>

<head>
  <title>Grecha-Susha.js</title>
  <script src="https://sushajs.replit.app/grecha-sushsa.js"></script>
</head>

<body>
  <div id="entry"></div>
  <script>
    const kasha = img("Kasha.png");
    const kashaHard = img("KashaHard.gif");

    const r = router({
      "/": (r) => {
        const [count, setCount] = r.useState(0);
        const [hard, setHard] = r.useState(false);

        return div(
          h1("Grecha.js"),
          
          div(a("Foo").att$("href", "#/foo")),
          div(a("Bar").att$("href", "#/bar")),
          
          div(`Counter: ${count()}`),
          
          div(hard() ? kashaHard : kasha).onclick$(() => {
            setCount(count() + 1);
            setHard(!hard());
          }),
        )
      },
      
      "/foo": () => div(
        h1("Foo"),
        
        p(LOREM),
        
        div(a("Home").att$("href", "#")),
      ),
      
      "/bar": () => div(
        h1("Bar"),
        
        p(LOREM),
        
        div(a("Home").att$("href", "#"))
      )
      
    });
    
    entry.appendChild(r);
    
  </script>
</body>

</html>

Locations:

2

Your replit link gives a 404, but looks promising :slight_smile:

1 Like
3

@Spcfork Did you make this framework or is this showing how to use it?

1 Like
4

Both,
It’s a flavour/fork of Grecha, a waaay smaller framework.

Mine has a ton more, and is a really good choice for small, but powerful SPAs,

I’m currently working on hydration,
But might switch to a method like Quiks serialization.

5

I also have this, which uses Grecha-Susha:

6

Fixed, had it private.

1 Like
7

Here’s the original,
very small, just a meme.

8

You can now use Grecha Susha bundled in Asri.

A library meant for Class-like page design for a quick, intuitive workflow and ECMA JSDOM.
Asrı - Modern Flexibility, Client-side

2 Likes