Tag Archives: code

Scrollycoding – A New Way to Write Code Walkthroughs

The past few months Rodrigo Pombo has been working on Code Hike, a new way to write code walkthroughs for blogs or docs. Recently he shared this preview of the step scroller (“scrollycoding”) component.

Looks great!

Scrollycoding Demo →

Authenticate with sudo using Touch ID

Turns out it’s possible to authenticate with sudo using Touch ID, as per this (old) tweet by Cabel:

Note that this will work against when SSH’ing into your machine, and then trying to run sudo:

If you set this up, do realize that anyone who can access your account using their finger (*) can now also do wrong things.

~

(*) It’s possible to add more than one fingerprint to Touch ID.

In addition to my 2 index fingers, my wife can also access my computer using Touch ID.

Does code need to be perfect?

Andreas Creten, founder of Made With Love, on different needs in code quality depending on what type of product (POC, MVP, …) you are making.

Until your MVP really gets traction you can run on shitty code or even do things manually to prove you have a product/market fit. Only once you nail it and the customers start flowing in, you should start caring about code, but up until then, you’re almost writing one-off code too.

I especially like this part too:

Every week I talk with people with great ideas, but a tiny budget to execute them. When they ask me what it would cost to build their idea, I answer between 10k and a couple of billion, basically bouncing the question back and asking what they want to spend on it.

To me this quote relates to this chart on value over time:

done-is-better-than-perfect

One can spend a truckload of cash on a certain idea or feature, but let’s face it: the actual value is added in the first few iterations. There’s this point in time where it longer pays off to extensively put work into something. The end result might not be as polished, but it gets things done.

Does code need to be perfect? →

Spectacle CodeSlide: Present code with style

spectacle-code-slide

Present code with style using spectacle.

Awesome way to present code, and putting the focus of the reader where it needs to be. It also lets you jump to specific lines even if they’ve already been displayed before (because code tends to jump).

import React from 'react';
import { Spectacle, Deck } from 'spectacle';
import CodeSlide from 'spectacle-code-slide';
import shiaLabeoufMagicGif from "./shiaLabeoufMagic.gif"
import preloader from "spectacle/lib/utils/preloader";

preloader({
  shiaLabeoufMagicGif
});

export default class Presentation extends React.Component {
  render() {
    return (
      <Spectacle theme={theme}>
        <Deck transition={[]} transitionDuration={0} progress="bar">
          // ...
          <CodeSlide
            transition={[]}
            lang="js"
            code={require("raw!../assets/code.example")}
            ranges={[
              { loc: [0, 270], title: "Walking through some code" },
              { loc: [0, 1], title: "The Beginning" },
              { loc: [1, 2] },
              { loc: [1, 2], note: "Heres a note!" },
              { loc: [2, 3] },
              { loc: [4, 7], image: shiaLabeoufMagicGif },
              { loc: [8, 10] },
              // ...
            ]}/>
          // ...
        </Deck>
      </Spectacle>
    );
  }
}

Spectacle CodeSlide (GitHub) →
Spectacle CodeSlide Demo →

In the past – when I was still working in education – I worked with snippets that fade in when advancing, or code that is executed inline. Spectacle CodeSlide would’ve been a great addition to these two techniques, and could’ve formed a replacement for the laser pointer.