On: April 16, 2018 In: APEX Nitro, Oracle APEX Comments: 0

Vincent Morneau’s full collection of APEX Nitro tips, right here

For the past month and a half, we’ve been feeding our Twitter community (see @InsumSolutions)  APEX Nitro tips. How nice of us. You are welcome, world!

These quickly digestible tips are to help you appreciate what a fabulous front-end development tool APEX Nitro is for Oracle Application Express (APEX), which is, of course, an awesome Rapid Application Development tool for Oracle Database users. APEX Nitro is quickly gaining popularity in the tightly-knit and ridiculously enthusiastic APEX community. It takes your front-end development to the next level by reducing mundane tasks, boosting performance, modularizing code, enhancing teamwork, and more.

To Save You Time

Now, since we didn’t want to force you to scroll through our numerous tweets, we put all these tips in an easily accessible single-entry point in the ever-popular blog format. It actually turns out to be a great idea because it’s just in time for Insum’s Ace Director (and Nitro inventor) Vincent Morneau’s presentation at Oracle Code Boston.

By the way, Vincent will be at Oracle Code Boston

If you’re not familiar with Oracle Code, It’s a free event, hosted by Oracle and held in cities across the world. It brings together local developers in a one-day meet so they can learn from their peers and experience the latest Oracle technologies. Since it started last year, it’s been attended by literally hundreds of thousands of developers. Vincent will be talking about his creation on April 17th at 4:05 pm. in Grand Ballroom “B” of the Westin Boston Waterfront. Hope you can make it!

A tool that runs in the background

Ok, so back to APEX Nitro.  It’s a command line tool that runs in the background while you develop an APEX app.
While running, it watches for local static file (e.g. `js`, `css`) modifications inside of a given directory, compiles them into a better format and sends them back to your APEX application seamlessly. It makes front-end coding faster by syncing these local files to your APEX application in real-time.

APEX Nitro also makes front-end development easier by establishing clear guidelines and by enforcing good programming practices. It starts by streamlining CSS and JavaScript and by entirely eliminating the (bad) practice of inline coding, so your APEX application benefits from an efficient 100% file-based approach.
APEX Nitro is available on GitHub.

And Now, the APEX Nitro tips

And without further ado, here is the series of tips that we provided:

Tip #1: Prerequisites & installation. Node.js is required to get APEX Nitro. Once Node.js is installed, simply execute the following on your command line and you are up and running

APEX Nitro tip 1 Prerequisites

Tip #2: Using the command line #APEXNitro has a powerful CLI (command line interface). Fire it up by executing the following command: apex-nitro Use the “help” command to read more about a specific feature.

APEX Nitro tip 2 Command Line

Tip #3: Project Configuration Before you can use #APEXNitro, you need to configure a project. Executing the following on your command line: apex-nitro config <myprojectname> A browser tab will open and follow the steps.

APEX Nitro tip 3 Configuration image

APEX Nitro tip 3 Project configuration image B

Tip #4: Application Setup Before launching #APEXNitro, it needs to connect to an #orclapex app. An Application Process enables the connection: apex_application.g_flow_images := owa_util.get_cgi_env(‘APEX-Nitro’)

APEX Nitro tip 4 Application setup

Tip #5: Launch your project After you’ve configured APEX Nitro project (tip #3) & your #orclapex app (tip #4), you are ready to go. Execute this on your command line: apex-nitro launch <myprojectname>

APEX Nitro top 5 Publishing files

Tip #6: Understanding Browser Synchronization When you have launched APEX Nitro, files from your computer are synchronized with your #orclapex application in real-time.
In a short time, we’ll also be officially launching our APEX Nitro Service offer.

 

 

Tip #7: Publishing files in APEX Thanks to @oraclesqlcl, APEX Nitro allows to upload a whole local directory to APEX Shared Components. Execute this on your command line: apex-nitro publish <myprojectname>

 

APEX Nitro tip 7 Publishing Files-Images

 

Tip #8: JavaScript & CSS File Minification APEX Nitro automatically produces a minified version of your code. The idea is to remove all unnecessary white spaces in a static file. Smaller file size = faster page load. Read more github.com/OraOpenSource/… #orclapex

Apex Nitro

 

Tip #9: JavaScript & CSS File Concatenation

APEX Nitro can concatenate multiple files into one. This makes file maintenance easier and you benefit from referencing a single file in #orclapex.

Nitro tip 9_JavaScript and CSS File Concatination

Tip #10: Autofixer

Some CSS properties require complex knowledge of browser vendor prefix “display: -webkit-box;”? With APEX Nitro, the developer doesn’t need to remember when they apply.

Nitro tip 10 Autofixer

 

Continuing with the next batch

Tip #11: Dealing with error handling

It’s very easy to introduce syntax errors into your JavaScript or CSS because these languages are not compiled. APEX Nitro will get you ahead of the curve with error notifications.

Nitro tip 11 dealing with error handling 1

Nitro tip 11 dealing with error handling 2

Nitro tip 11 dealing with error handling 3

APEX Nitro Tip #12: CSS Preprocessing

Do you find CSS to be lacking compared to other languages? APEX Nitro comes with #SASS and #LESS support. Give your CSS some love with variables, nesting and functions. Read more github.com/OraOpenSource/…

 

APEX Nitro Tip #13: External device synchronization

You can use APEX Nitro to enhance responsive design and cross-platform development. Simply enable this option in your project config (screenshot1) and use the external URL (screenshot2).

Nitro Tip 13 External Device Synchronization 1

Nitro Tip 13 External Device Synchronization 2

 

APEX Nitro Tip #14: Developing an APEX Plugin

A lot of #orclapex plugins are achieved by bundling a JavaScript / CSS library with an APEX item / region / DA. APEX Nitro will take your plugin to the next level.

More on this: https://github.com/OraOpenSource/apex-nitro/blob/master/docs/setup.md#apex-plugin-development

 

So there you have them. If you’d like to learn more about APEX Nitro or other Insum products and services. Contact us!

Read more about what inspired Vincent Morneau to create APEX Nitro here!

 

Subscribe

Get our latest content delivered to your inbox and stay informed on our upcoming educational events.

Related Content

Power Ranking Oracle APEX 18.1 New Features – May

FINALLY! After months of anticipation, Oracle Application Express (APEX) version 18.1 has arrived! Taking a look at the new features included definitely makes it...

Learn More
Dynamic Actions in Oracle Application Express – Go From Basic to Awesome

If you’re just starting out in Oracle Application Express, know that Dynamic Actions can take your applications from basic to awesome very quickly. And,...

Learn More
Collaborative Development in Oracle APEX – Steering Clear of Trouble

The ability to work collaboratively as a team is certainly one of the wonderful aspects of Application Express, Oracle's rapid application development platform. Developers work...

Learn More
Progressive Web Apps: Two worlds colliding to everyone’s benefit

The Story of Progressive Web Apps (PWAs) is now playing out at the frontier of two worlds, inside your smartphone. Once upon a time, inside...

Learn More
Blockchain – Technology you’ll have to Address, Sooner or Later

Blockchain is a technology buzzword getting a lot of attention these days. At its core, this technology is a means for securing data in...

Learn More

Related Case Studies

Ivy League University

A large department at an Ivy-league University needed to quickly streamline its mainly manual salary increase process.

Learn More
CIS Field Reporting System with Oracle APEX

Using Oracle APEX, Insum helped CIS develop a field data capture system for use in large scale fiber optics installation projects. The system is...

Learn More
Tap 50:50 Raffle System with Oracle APEX

Using Oracle APEX, Insum developed a shopping cart that could securely dovetail with Tap 5050’s existing system and provide a quality user experience.

Learn More