Stuff I'm Up To

Technical Ramblings

Understanding the Node.js Installation — December 3, 2016

Understanding the Node.js Installation

I’m still a little new to this Node.js stuff and it took me a which for how it is installed to come together in my head. After carrying out the install I was confused with reading the install routines needed for various modules I wanted to make use of.

I’d come across:

$ npm install --global
$ npm install --save-dev
$ npm install --save

And not really understood the difference.

Continue reading

Advertisements
Electron Installer for Windows — December 1, 2016
jQuery in Node.js — November 30, 2016

jQuery in Node.js

Using jQuery in Node.js gave me something to think about. Especially as there seems to be so many ways to do it.

If you’re using it in a renderer you can pretty much use it like you would in a plain old html page and use a script src. A couple of things I tried cause bootstrap to start complaining about jQuery not being defined. I eventually decided on this approach to get things working together.

In your html head you’ll need to include the css. You could get creative with Gulp and sass if you really want, but I’m just going for out of the box.

<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">    

Then in your script tags:

    <!-- Insert this line above script imports  -->

        if (typeof module === 'object') {
            window.module = module;
            module = undefined;
        }



        global.jQuery = require('jquery/dist/jquery.min.js');
        global.$ = jQuery;
        var jQueryUI = require('jqueryui');
        var jQueryMousewheel = require('jquery-mousewheel/jquery.mousewheel.js')($); // jQuery plugin handling
        var bootstrap = require('bootstrap');
        var tinysort = require('tinysort/dist/tinysort.js').tinysort;

    <!-- Insert this line after script imports -->

        if (window.module) module = window.module;

Notice the special handling ($) on the jQueryMousewheel plugin and the .tinysort to make these work as the should.

Learning Electron & Node.js — November 29, 2016

Learning Electron & Node.js

Many years ago in a galaxy far, far away I developed an application to manage and read my comic books. I developed it in a Windows environment and used C# Dot Net to build it. It worked just great and I still use it today.

It’s actually one of the things I use that prevents me from going full Linux on my home desktop. So I decided I’d see if I could remedy that by replacing it with a cross platform solution using Electron.

If nothing else it would provide me with an opportunity to learn how to use Electron & Node.js

Continue reading

Electron, JQuery & Bootstrap 3 — November 19, 2016
gulp.js — November 18, 2016
Node.js & Electron — November 16, 2016

Node.js & Electron

I’ve run into Node.js a few times and kinda struggled with just what it’s all about. I’ve decided to have a bit of a poke at trying to develop an application that is cross platform and runs locally on either Windows or Linux, maybe even the fruit stuff and ran into Electron.

http://electron.atom.io/

I’ll confess to being completely lost as to how to even begin. Setting it up seemed confusing in the documentation. In reality it pretty much fell onto my Windows machine once I figured it out.

Electron is a product delivering Node.js and the Chromium browser as a package. So put simply you write HTML, JavaScript & CSS that get delivered into a locally run browser. Node.js provides the scripting engine that has access to local resources that are accessed through the Chromium browser.

Continue reading