Create Interacitve Declarative UIs In jQuery - jqDeclare

Create Interacitve Declarative UIs In jQuery - jqDeclare

The jqDeclare library helps developers to create React-style interactive, declarative web interfaces in jQuery.

The library allows you to dynamically update the UI according to the state. Without the need of manipulating the DOM directly.

1. To get started, include the jqDeclare plugin after jQuery.

<script src="/path/to/jquery.slim.min.js"></script>
<script src="/path/to/jquery.declare.js"></script>

2. Create an alert popup along with a button. In this example, when you click the button it displays an alert popup:

$("#example").declare(function (name) {
  return ["button", {"click": function(ev) { alert("Hello " + name); }}, "Say hello"];
}).render("jQueryScript");

3. Full JavaScript syntax:

// jQuery object
$("#example").declare($("<p>Hello World!</p>").click(callback));
// Or jqDeclare definition
$("#example").declare(["p", {"click": callback}, "Hello World!"]);
// function
$("#example").declare(function(data) {
  // ..
}).render(data);

This awesome jQuery plugin is developed by chr15m. For more Advanced Usages, please check the demo page or visit the official website.

  • Publication date: 17.06.2019
  • Source

Whoops, looks like something went wrong.

(1/1) ErrorException

file_put_contents(): Only 0 of 246 bytes written, possibly out of free disk space

in Filesystem.php (line 122)
at HandleExceptions->handleError(2, 'file_put_contents(): Only 0 of 246 bytes written, possibly out of free disk space', '/home/p336588/web/ivanovdmitry.com/public_html/vendor/laravel/framework/src/Illuminate/Filesystem/Filesystem.php', 122, array('path' => '/home/p336588/web/ivanovdmitry.com/public_html/storage/framework/sessions/yiyoWF3WW3CH3NfRZ1yuJSu0djoIA3sIDnZLgg3Y', 'contents' => 'a:3:{s:6:"_token";s:40:"9TbTDbHDtxLPbfGiHbsxei0CLDNQFSFd4V31I2an";s:9:"_previous";a:1:{s:3:"url";s:88:"http://ivanovdmitry.com/blog/post/create-interacitve-declarative-uis-in-jquery-jqdeclare";}s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}}', 'lock' => true))
at file_put_contents('/home/p336588/web/ivanovdmitry.com/public_html/storage/framework/sessions/yiyoWF3WW3CH3NfRZ1yuJSu0djoIA3sIDnZLgg3Y', 'a:3:{s:6:"_token";s:40:"9TbTDbHDtxLPbfGiHbsxei0CLDNQFSFd4V31I2an";s:9:"_previous";a:1:{s:3:"url";s:88:"http://ivanovdmitry.com/blog/post/create-interacitve-declarative-uis-in-jquery-jqdeclare";}s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}}', 2)in Filesystem.php (line 122)
at Filesystem->put('/home/p336588/web/ivanovdmitry.com/public_html/storage/framework/sessions/yiyoWF3WW3CH3NfRZ1yuJSu0djoIA3sIDnZLgg3Y', 'a:3:{s:6:"_token";s:40:"9TbTDbHDtxLPbfGiHbsxei0CLDNQFSFd4V31I2an";s:9:"_previous";a:1:{s:3:"url";s:88:"http://ivanovdmitry.com/blog/post/create-interacitve-declarative-uis-in-jquery-jqdeclare";}s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}}', true)in FileSessionHandler.php (line 83)
at FileSessionHandler->write('yiyoWF3WW3CH3NfRZ1yuJSu0djoIA3sIDnZLgg3Y', 'a:3:{s:6:"_token";s:40:"9TbTDbHDtxLPbfGiHbsxei0CLDNQFSFd4V31I2an";s:9:"_previous";a:1:{s:3:"url";s:88:"http://ivanovdmitry.com/blog/post/create-interacitve-declarative-uis-in-jquery-jqdeclare";}s:6:"_flash";a:2:{s:3:"old";a:0:{}s:3:"new";a:0:{}}}')in Store.php (line 128)
at Store->save()in StartSession.php (line 88)
at StartSession->terminate(object(Request), object(Response))in Kernel.php (line 218)
at Kernel->terminateMiddleware(object(Request), object(Response))in Kernel.php (line 189)
at Kernel->terminate(object(Request), object(Response))in index.php (line 58)