4. October 2017

Webpack: How to read version from file and render it into React web

Imagine the simple scenario.The string with version is stored in the file, and it is necessary to transport it from the file into a React application using Webpack.

The solution is relatively simple.

The whole idea is to execute child process which will read the file and transfers the content via variable into the application.

You will need DefinePlugin which allows defining a custom variable and transports it into the transpiler.

Update your package.json and add there

new webpack.DefinePlugin({
   __VERSION__: JSON.stringify('1.2.3')
})

Update your compoents to render the version:

... {__VERSION__} ...

Check the application and you should see there version 1.2.3.

Let’s move further and read a value from the file version.txt. You will need child_process. Add following line to package.json:

const childProcess = require('child_process');

Now update our previous code to read the value from the file. It is necessary to wrap the output into JSON.stringify otherwise you won’t be able to render the version properly.

new webpack.DefinePlugin({
   __VERSION__: JSON.stringify(childProcess.execSync('cat version.txt').toString())
})

This command will invoke the cat command and the output of the command will be set to variable.

If you want a little bit more portable version of the script, then use ShellJS instead of a plain cat.

The code with ShellJS will look like this:

cons shell = require('shelljs');

new webpack.DefinePlugin({
   __VERSION__: JSON.stringify(shell.cat('version.txt').toString())
})

29. June 2013

True/False gotcha Python vs Ruby vs PowerShell vs NodeJS vs PHP

Evaluation of conditions is very important part programming. True is ture, false is false…

Or not? It might surprise you, but not all languages evaluate numbers, empty strings or empty arrays in the same way.

Let’s examine several technologies. Python, Ruby, PowerShell, NodeJS and PHP.

Here is small code written in Python:

def test(value):
    if value:
        print "True"
    else:
        print "False"

test(0)
test(1)
test("")
test([])
test({})

Here is similar code written in Ruby:

def test(value)
    if value
        print "True"
    else
        print "False"
    end
end

test(0)
test(1)
test("")
test([])
test({})

Let’s compare it to PowerShell:

Function Test($value) {
    if ($value) {
        Write-Host "True"
    } else {
        Write-Host "False"
    }
}

Test(0)
Test(1)
Test("")
Test(@())
Test(@{})

Same logic in JavaScript for NodeJS:

function test(value) {
    if (value) {
        console.log("True");
    } else {
        console.log("False");
    }
}

test(0);
test(1);
test("");
test([]);
test({});

Code in PHP:

<?php 
function test($value) {
    if ($value) {
        echo "True";
    } else {
        echo "False";
    }
}

test(0);
test(1);
test("");
test(array());
test(array());
?>

Results are little bit surprising:

 

Python Ruby PowerShell NodeJS PHP
0 False True False  False False
1 True True True True True
“” False True False False False
[] False True True  True False
{} False True True  True False

11. May 2013

Edge – invoke PowerShell from NodeJS

Project Edge allows seamless integration of NodeJS and PowrShell.

Just install packages:

npm install edge
npm install edge-ps

Create NodeJS application which contains PowerShell code:

var edge = require('edge');

var hello = edge.func('ps', function () {/*
"PowerShell welcomes $inputFromJS on $(Get-Date)"
*/});

hello('Node.js', function (error, result) {
 if (error) throw error;
 console.log(result[0]);
});

Start application and you’ll get output

PowerShell welcomes Node.js on 05/11/2013 07:14:38

Project Edge also allows integration of NodeJS with other technologies (e.g. Python)

8. May 2013

Vim mode in Cloud9 IDE

Cloud9 IDE is cloud base IDE for NodeJS, Python, Ruby or PHP projects.

The cool thing about this IDE is that code editor has support for Vim mode (it also supports Emacs) :)

vim-cloud9

Go to View, Keyboard Mode and select Vim.

Voila you can use many Vim features, like indentation by >> or many others.

Here is offical video from Cloud9 Youtube channel:

5. August 2012

Console2 for Windows – semi-transparent NodeJS shell, PowerShell or cmd

Update: I switched from Console2 to ConEmu. ConEmu is far more advanced.

Console2 is great little front-end for Windows. It makes PowerShell even more usable. It’s very flexible and you can configure console window to behave like terminal window on MacOS or Linux. It has also support for transparency. It’s simply great. No need to add any more words. Just try it.

I’d like to add few more hints.

Enable transparancy

  • Go to Settings – Appearance – More…
  • Select Window transparency – Alpha
  • Change alpha level of Active and Inacative window.

Result:

Copy on left mouse button click, paste on middle button click

Default configuration of mouse is not very useful. You have to press Shift and Left Mouse to select and copy text. Make small adjustment:

  • Settings – Hotkeys – Mouse
  • Change: Copy/clear selection to Left + Shift
  • Change: Select text to Left

Use Console2 as front-end for NodeJS

You can use Console2 to invoke also NodeJS shell. Just create Tab definition for NodeJS.

  • Go to Settings – Tabs
  • Add NodeJS and set Shell to: “C:\Program Files (x86)\nodejs\node.exe”

Create new Tab with NodeJS profile:

Awesome :)