Grab the input provided by HackerRank from STDIN with:

input = IO.read(:stdio, :all)
  |> String.split("\n", trim: true)

If the input provided are numbers you might want to chain the above with:

input = IO.read(:stdio, :all)
  |> String.split("\n", trim: true)
  |> Enum.map(&String.to_integer/1)

In recent versions of Elixir (v1.13.0 or above) you might want to use IO.read(:stdio, :eof) instead.

But HackerRank is running Elixir 1.8.2 which don’t support the :eof option yet (LeetCode uses 1.15.7 by the way…).

You can look at the Elixir version from within the REPL with: System.version.

While working on a problem, suddenly I had the need to get a hold of all the permutations of the elements in a list.

Thus, I did what any good engineer would do: I browsed the internet for a little bit and found a solution.

It makes use of for comprehensions and recursion.
It’s very concise and elegant, judge yourself:

defmodule Util do
  def permutations([]), do: [[]]

  def permutations(list) do
    for(item <- list, rest <- permutations(list -- [item]), do: [item | rest])
  end
end

Directly comparing dates with >, <, <=, etc. won’t throw an error, but can give the wrong result.

The right way to go about it, is to use Date.compare/2.
E.g.:

today = Date.utc_today()
tomorrow = Date.add(today, 1)
yesterday = Date.add(today, -1)

Date.compare(today, tomorrow)
# :lt

Date.compare(today, today)
# :eq

Date.compare(today, yesterday)
# :gt

Sometimes you try to use certain strings to create regular expressions.

The problem is these string might contain characters that have special meaning inside a RegExp. For example:

const myString = '[Hello?](World)!!!'

To escape it for safe use as a regex pattern, lodash provides escapeRegExp.

const myString = '[Hello?](World)!!!'
// "\\[Hello\\?\\]\\(World\\)!!!"

Just set the tabindex attribute, then you’ll be able to listen to keydown — or keyup, keypress — events like this:

<div tabindex="1" @keydown.esc="doSomething()">
  I can emit keydown events now!
</div>

Just add this CSS code to your app:

@media print {
  @page {
    margin: 0;
  }
}

Print preview:

Default margins	No margins

Lately, I’ve been realizing that co-located tests are better.

It’s easier to see which components are tested or not, or quickly open a component’s tests right there! — as opposed to going to a different folder to crawl a hierarchy of test files.

mount vs shallowMount

mount will render the whole component and all of its child components.
shallowMount will stub all the child component.

I think it’s preferably to use mount and only stub the things that you need.

Stubs

This is how you can stub sub components:

import { mount } from '@vue/test-utils'
import App from './App.vue'

test('mount component', () => {
  expect(App).toBeTruthy()

  const wrapper = mount(App, {
    global: {
      stubs: {
        MiniMap: true
      }
    }
  })

  expect(wrapper.text()).toContain('MiniMap')
  expect(wrapper.html()).toContain('<mini-map-stub')

  expect(wrapper.html()).toMatchSnapshot()
})

Prerequisites

For this, you’ll need a Vue 3 + TypeScript (+ Tailwind CSS) project.

You can set up one following the instructions here:
Build a Vue 3 + TypeScript dev environment with Vite

Basic types, Records

• If you want a type meaning “any value”, you probably want unknown instead.
• If you want a type meaning “any object”, you probably want Record<string, unknown> instead.
• If you want a type meaning “empty object”, you probably want Record<string, never> instead.

Adding properties to the window object

Add a src/index.d.ts file with this content:

export {}

declare global {
  interface Window {
    someVariable: string
    otherThing: number
    // any other variables you need here...
  }
}

Using QPDF

QPDF is a command-line program for Linux that converts from one PDF file to another equivalent PDF file while preserving the content of the file. The tool allows you to encrypt and decrypt, web-optimize, and split and merge PDF files.

If you are using Manjaro, QPDF should be already installed. In case it is not, try with:

sudo pacman -S qpdf

To convert a secured file into an open one, use this command:

qpdf --password=mysecretpassword --decrypt the-secured.pdf new-unsecured.pdf

Introduction

This is an opinionated guide on how to set up a new Vue 3 project with the aforementioned tech stack plus some extras that can really help in the DX (Developer Experience) department.

Stuff like:

• Prettier
• Husky
• ESLint + styleLint + commitlint
• Maybe Tailwind CSS ;)

And more…

Here are a couple of cheat sheets I wrote for Vue 3 + TypeScript:

• Vue 3 with TypeScript cheat sheet
• Vue 3 testing cheat sheet

Prerequisites

• Install Node.js

Let’s get started

Generate a new project:

pnpm create vite

Then input:

• Project name
• Pick Vue
• Pick TypeScript

Let’s set up our project with pnpm.
Enter the project directory, then:

pnpm install
pnpm up --latest

One code editor to rule them all…
Visual Studio Code is fast, nimble, and beautiful.

cd ~/tmp
git clone https://aur.archlinux.org/visual-studio-code-bin.git
cd visual-studio-code-bin/
makepkg -si

Execute with:

code &

inotify watchers

We need to increase the amount of inotify watchers.
This is needed so Visual Studio Code can manage projects with a lot of files:

echo fs.inotify.max_user_watches=524288 | sudo tee \
/etc/sysctl.d/40-max-user-watches.conf && sudo sysctl --system

If you still don’t know what i3 is, please have a look at this.

Prerequisites

Create a live USB for Manjaro Linux —instructions here.
Then install it.

Offline set up

Things to do before connecting to the network.

Create common directories:

mkdir -p ~/bin ~/encrypted ~/tmp

Make some ~/.bashrc additions:

alias ll="ls -lhF"
alias la="ls -lahF"

export HISTCONTROL=ignoredups:ignorespace
export PATH=~/bin:$PATH

export PS1="\[\e[37;1m\]\t . \[\033[01;32m\][\u@\h\[\033[01;37m\] \W\[\033[01;32m\]]\$\[\033[00m\] "