Configuring RequireJS You can use either requirejs.config() or require.config() to setup RequireJS. I preferred the requirejs.config() and require() to load modules just so to give them some distinction on usage. A typical config usage is like this: requirejs.config({ baseUrl: "js/", paths: { 'foo': 'path/foo', 'bar': 'path/bar', } }); You can actually run…

I like some of the examples show cased from VueJS. I have re-implemented some of them using Oracle JET framework instead of VueJS. This proved to be a very good learning exercise. See below GitHub project for more details: zemian/oraclejet-for-vuejs-examples This project re-implements some of the VueJS examples using the Oracle JET library. Both of these are open source…github.com

Wrote a tiny JSON converter that you can check it out here: https://raw.githack.com/zemian/html-starter/master/tools/js-to-json.html The source is here: https://github.com/zemian/html-starter/blob/master/tools/js-to-json.html

The Bulma CSS library is a very nice project with work with. It’s small and has enough features to style just about any thing you want on the web. The Bulma is a pure CSS library and has no JS dependency! I like this minimalist approach to things. Here is…

I like VueJS because it’s similar to KnockoutJS that I am familiar with. The VueJS has much more modern feel and the code is a lot more smoother compare to the KnockoutJS. One big difference is KO uses the Observable object to bind reactive properties, while in VueJS it can be treated as normal JS properties. Get started on VueJS with single JS script. <div id="app"> <span v-text="message"></span> </div> <script src="https://unpkg.com/vue@2.6.11/dist/vue.js"></script> <script> let app = new Vue({ data: { message: "Hello" } }); app.$mount("#app"); </script>

The RequiredJS is a JavaScript library that helps you separate your code into modules as namespaces, and it helps to load them as dependencies when need it. Here is a simple html demo: <div id="app"> Hi </div> <script src="https://unpkg.com/requirejs@2.3.6/require.js"></script> <script> define('mymodule', [], function() {…

A new Oracle JET 8.2.0 just released! Good time to give you another tips on how to use the toolkit. You might have noticed that Oracle JET is published under NPM package, and hence you may get it through any CDN network that serve NPM packages directly. A popular one for developer is UNPKG.com. So here I will create a simple ClickCount application that uses external public CDN. Compare this to the Hello OJET I have shown in previous post, this is just a single html file. This is great for quick exploration and demo!

One cool thing about KnockoutJS library is that you can get started with just a single JS file. It allows you to bind a JS object model property to any HTML DOM elements, and automatically update it when property value has changed. Here is a hello KnockoutJS example app: <div id="app"> <span data-bind="text: message"></span> </div> <script src="https://unpkg.com/knockout@3.5.1/build/output/knockout-latest.js"></script> <script> let app = new function () { this.message = ko.observable("Hello"); }; ko.applyBindings(app, document.getElementById("app")); </script>

I found an old series of articles that introduced Oracle JET by Chris Muir on DZone. These articles seem dated way back in 2016 (with OJET v3 ?), but the core concepts are still valid. In fact many of these introductions are now captured in the Oracle JET Developer Guide…