I was quite comfortable with jsFiddle as a playground and testing site for simple Oracle JET samples. As I moved onto ojModule and ojRouter, which require multiple files, I found jsFiddle somewhat limiting. There may be a way to create fiddles on fiddles, but I haven't found it. While considering how to build ojModule examples in jsFiddle, I stumbled upon this online roundup of code playgrounds which got me thinking about CodePen. Specifically, I was intrigued by the 10 Cool Things You Can Do with CodePen and JavaScript. For example, I can create a CodePen that has JavaScript and HTML and then never run it (View and ViewModel), but instead reference each by URL from another CodePen (one that defines an ojModule). Being able to create a CodePen JavaScript file that I can reference from other CodePens also means I can move the RequireJS configuration into a single file and reference it from other CodePens, eliminating the RequireJS/OJet configuration noise from my examples. This allows me to focus on just the important stuff (the delta).
One other concern I had with jsFiddle is finding fiddles. CodePen allows for tags which means I can Search for all CodePens tags with oraclejet.
With these issues in mind, I ported my Oracle JET Base 2.0.1 Debug fiddle to CodePen. Unlike my prior jsFiddles, these CodePens only contain the "delta" code necessary to implement a solution. The RequireJS configuration is visible from the pen's JavaScript configuration, but is now in a separate pen. Likewise, I no longer have to import the CSS but reference it in the pen's CSS settings. Before becoming familiar with CodePen, I found these "invisible" dependencies confusing. Now that I understand CodePen, I find them really helpful because they allow me to remove the configuration noise and focus on the pen's main idea.
Relevant CodePens
No comments:
Post a Comment