Aishikaty's blog

Portable dot files

When you spend a lot of time in command line as I do, you have your bash config full of aliases and you pimped up your prompt to pure awesomeness. The trouble comes when you need to ssh to other machine you have never been before and all the comfort you are used to is now gone. Afraid not, I found a solution!

It's a simple function that you can put inside your .bash_aliases:

sshome(){ ssh -t "$@" "bash --rcfile <(
    echo TMUX=$TMUX # you don't need this if you don't use tmux
    echo . /etc/bash.bashrc 2> /dev/null # this will load the default config
    echo $(base64 -w0 "$HOME/.bash_aliases") | base64 -d
  )"
}

To use it just write sshome instead of ssh command, it's that simple!

But wait, what about my precious .vimrc? I cannot live without it!

You can use this neat trick to include it inside the .bash_aliases file as well. Look!

vim(){ env vim -u <(cat <<EOF
" content of your .vimrc goes here...
EOF
) "$@";}

World's smallest reactive view library

In a couple of last weeks I've been wondering how reactive view libraries work under the hood. Beacause it's easier to learn from simple examples I found a few really tiny ones.

As I was going through all the code I started to see patterns and things that could be simplified. I soon wrote dozens of snippets and several versions of proof-of-concept libraries.

And I found out when you write a library and you're trying hard to make it as simple as possible, you have to choose between functionality/usefulness and small amount of lines.

It made me wonder: How small the library really could be to make a sense? And after some code-golfing it seems to me like it can be really really tiny. In fact it can be so tiny that you can fit it in a tweet!

Here's the code I came up with:

const render = () => document.querySelectorAll('[onload]').forEach(el => el.onload())

I know what you are thinking: That's a joke. How this could be useful at all?

Let me show you on a simple binding demo from Vue.js website:

<div id="app">
  <input v-model="message">
  <span>{{ message }}</span>
</div>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: 'Hello world!'
    }
  })
</script>

With our tweet-size library, we can do the same thing, look:

<input
  oninput="message = this.value, render()"
  onload="this.value = message"
>
<span onload="this.textContent = message"></span>
<script>
  let message = 'Hello world!' 
  render()
</script>