Laur IVAN

Initialize a Typescript Interface with JSON

Posted by in Software

TL;DR: You can initialise a typescript interface using JSON objects. On my quest to load and save objects as JSON, I found that you can convert a JSON object to an interface via something called type assertion. Basically, if you have an interface:

you can load a JSON object via JSON.parse(json) straight to an instantiation of the interface. Then, you can use the said instantiation in e.g. a component. Now, all is nice, but what if you want to initialise an instance of the PathInterface interface? That’s simple. You…read more

Angular 2
Refresh Bound Variables from Callback

Posted by in Software

TL;DR: Use ChangeDetectorRef‘s detectChanges() at the end of your callback code. While developing my electron.js app, I’ve had the following workflow: I have an input element and a button The input element is capable of editing a path The button triggers a File Open dialog

The problem I had was the showOpenDialog() accepts a callback and I couldn’t get the input field to update once the user has picked a file. Fortunately, the smart angular developers have thought of this situation too and the solution is quite simple. You…read more

Load FontAwesome Fonts with Webpack 2

Posted by in Software

TL;DR:: Add the (s)css dependency to your main (s)css file and specify where to find the fonts too. Then use the proper loaders in your webpack.config.js file. The past few days I had trouble loading the font-awesome fonts with webpack. I tried quite a few solutions: Using the font-awesome-sass-loader Manual solution webpack + font-awesome test Looking at SO (How to configure font file output directory …) and so on… Nothing seemed to work propoerly. I either had the fonts ignored or got errors of files not found. Finally, I have…read more

Scan Decorated Classes in Typescript

Posted by in Software, Tutorial

TL;DR: Make the decorator set a property in the class and look for it. While trying my hand at writing an ORM, I had a problem of initialising the database through a dummy instantiation of some models, without running an explicit command. In java, I can use code generation to provide a list of objects following a pattern (e.g. implementing an interface). Here, the concepts are somewhat different and I found out I can use decorators. My model looks like this:

where the @table() and @field are decorators. Ideally,…read more

Make Electron Work with Sqlite3

Posted by in Software, Tutorial

The other day I tried to integrate knex with a SQLITE3 back-end. Unfortunately, the instant I’ve tried to instantiate knex, I’ve got a lot of errors. After getting rid of them, I found that I can’t get sqlite3 to work at all, even though I’ve checked the installation and it was OK (got the binary downloaded and even rebuilt it). Uncaught Error: Cannot find module ‘/…/node_modules/sqlite3/lib/binding/node-v51-darwin-x64/node_sqlite3.node’ So, here are the steps that I did to make it work: install electron-rebuild

install sqlite3 using npm

rebuild electron with sqlite3….read more

Make Electron work with Knex.js

Posted by in Software, Tutorial

To make my life easier (and because I hate writing SQL statements), I thought of installing an ORM. After some search, I’ve decided to use knex. Unfortunately, the moment I integrated it into my app, webpack started generating errors like: ERROR in ./~/knex/lib/dialects/maria/index.js Module not found: Error: Can’t resolve ‘mariasql’ in ‘/…/node_modules/knex/lib/dialects/maria’ @ ./~/knex/lib/dialects/maria/index.js 59:11-30 @ ./~/knex/lib/dialects ^\.\/.*\/index\.js$ @ ./~/knex/lib/index.js @ ./~/knex/knex.js @ ./src/main.ts and warnings like: WARNING in ./~/knex/lib/seed/index.js 150:11 Critical dependency: the request of a dependency is an expression Not nice! To get rid of the errors I…read more

Electron App
Send Menu Command to Angular App

Posted by in Software, Tutorial

TL;DR: In the main process use mainWindow.webContents.send(‘cmd’) and in your Angular component (renderer process) bind it to a method with ipcRenderer.on(‘cmd’, this.open.bind(this)) (where open() is a method). I need to make my angular app work when a menu item is clicked (think: I click on “Open” and my angular app needs to perform the actual operation). The problem I’ve encountered is the menu actions happen in the main process while my angular code lives in the renderer process. Thus, I need to make the two communicate :) In my main…read more

List Columns in a ResultSet

Posted by in Software, Tutorial

In order to list all columns in a JDBC ResultSet (e.g. for debug purposes), you need to iterate through its metadata:

Note: Column numbers start from 1, not 0 (hence the md.getColumnName(i + 1) above). I usually wrap this in a if(logger.isTraceEnabled()) so it doesn’t get triggered all the time. HTH, A little experiment: If you find this post and ad below useful, please check the ad out :-)

Electron App
Use SCSS, Luke!

Posted by in Project Management, Software

Traditionally, I’ve been a LESS supporter. The way it does mixins for example seems to me more intuitive. However, I noticed that my go-to framework (bootstrap) is now doing SASS-first and then LESS. So, one adapts… and the option in angular-cli makes things less painful. What was painful was to convert a bunch of LESS code to SCSS :/ Here are some findings relative to using SCSS in my application: Webpack does it nicely via the sass-loader You can use relative, absolute and ~ paths to refer to other resources….read more