Technology

Angular-Material still has Flex-Layout

After having nearly panicked when coming to the realization that there wouldn’t be support for the usual Layout mechanisms from previous versions, fortunately I came across the following library: https://github.com/angular/flex-layout

So now we have all the lovely layout mechanisms we have come to like so much from previous Angular versions still available in the latest version.

Documentation, Uncategorized

Multiple Environments with Loopback 4

When configuring multiple environments for a Loopback 4 Application, it can appear less straight forward than with Loopback 3, so here is a quick fix for how to get over this obstacle as elegantly as possible in 5 minutes.

  1. Import dotenv and create a .env file in the root of the app.
  2. Put your database configuration in this file.
  3. Empty the existing datasource file so it contains an empty JSON (file is required by compiler and the bootstrapping).
  4. Add the code below to the application.ts file in the src directory.
  5. Don’t forget to require the dotenv from the run command.
this.bind('datasources.default').to(new DefaultDataSource());
this.dataSource(new DefaultDataSource());
this.bind('datasources.config.default').to({
  name: 'default',
  connector: 'mongodb',
  hostname: process.env.DB_DEFAULT_HOSTNAME,
  port: process.env.DB_DEFAULT_PORT,
  user: process.env.DB_DEFAULT_USER,
  password: process.env.DB_DEFAULT_PASSWORD,
  database: process.env.DB_DEFAULT_DATABASE,
  useNewUrlParser: process.env.DB_DEFAULT_USENEWURLPARSER,
  authSource: process.env.DB_DEFAULT_AUTHSOURCE
});
this.bind('datasources.default').toClass(DefaultDataSource);

This is a quick fix intended to help move on if in a pickle, I will refine this further so the application will check the process.env.NODE_ENV variable instead and load the corresponding file.

For the original inspiration to this post, head over here: https://medium.com/p/8f085399268/responses/show

 

Documentation

QuickFix how to deploy a Loopback 4 Application to Heroku

When you are prototyping, sometimes you just need something to work, this was my case with a new experiment I’m working using Loopback 4 which I wanted to deploy for to Heroku for some rapid testing.

Generally CLI generated App’s doesn’t like environments like Heroku too much and since I later will deploy to DigitalOcean through some Docker containers, I just needed a QuickFix.

Anyways, let’s get to the point… this is a very opiniated post which takes for granted you are using the exact same development workflow that I have, if not, post a comment and I will do my best to help you out.

  1. Remove the /dist entry from .gitignore so it will be committed to Git, and subsequently caught by the CD routine running on Heroku through the GitHub Webhook.
  2. Remove the prestart script entry from package.json.
  3. Remove the “-r source-map-support/register” from the start script entry in package.json.

Now you are good to deploy it to Heroku via GitHub, however don’t forget to build before you commit.

 

Documentation

CORS with Loopback & Angular Apps

To get the two running nicely together in respect to CORS, don’t forget to disable the origin only default policy of Loopback by setting the origin in the CORS configuration to “*” in the middleware.json file.

{
  ...
  "initial": {
    "compression": {},
    "cors": {
      "params": {
        "origin": "*",
        "credentials": true,
        "maxAge": 86400
      }
    }
    ...
  }
}

 

PostgreSQL

Enable UUID on PostgreSQL

Sometimes we want to have native support for UUID’s in Postgres, fortunately there is already a ready-made extension that makes it easy.

Enter the “uuid-ossp” extension… fortunately furthermore, its very easy to use…

  1. Enable the extension:

    CREATE EXTENSION IF NOT EXISTS “uuid-ossp”

  2. Set default value on the column to “expression” and use the following default value:

    uuid_generate_v4()

Uncategorized

Keyboard Shortcut for Inserting Comment in Word for Mac

If you have come to this post, chances are you like me found yourself tired of adding comments by using the mouse and was surprised that the “Insert Comment” didn’t feature a keyboard shortcut… but dispair not, the solution is here…

Very intuitively (not really), the keyboard shortcut to insert comment is

Command + Alt + A

If you want to see for yourself or set it to something else, you can find the setting here:

Tools > Customize Keyboard > Insert > InsertAnnotation

Now, you can enjoy the thrill of being able to review documents galore without having to let your fingers leave your keyboard… what a production boost, eh !?