index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Constantijn Bicker Caarten</title>
  <meta name="description" content="Personal website of Constantijn Bicker Caarten.">
  <link rel="canonical" href="https://bickercaarten.com/">

  <meta property="og:type" content="website">
  <meta property="og:url" content="https://bickercaarten.com/">
  <meta property="og:title" content="Constantijn Bicker Caarten">
  <meta property="og:description" content="Personal website of Constantijn Bicker Caarten.">
  <meta property="og:image" content="https://bickercaarten.com/og-image.png">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
  <meta property="og:image:alt" content="Constantijn Bicker Caarten">

  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="Constantijn Bicker Caarten">
  <meta name="twitter:description" content="Personal website of Constantijn Bicker Caarten">
  <meta name="twitter:image" content="https://bickercaarten.com/og-image.png">
  <meta name="twitter:image:alt" content="Constantijn Bicker Caarten">

  <link rel="icon" href="favicon.svg" type="image/svg+xml">
  <link rel="alternate icon" href="favicon.ico">
  <link rel="apple-touch-icon" href="apple-touch-icon.png">

  <link rel="preload" href="fonts/m6x11.woff2" as="font" type="font/woff2" crossorigin>
  <link rel="stylesheet" href="css/style.css" type="text/css">
</head>

<body>
  <nav id="header">
    <a class="nav-home" href="#" aria-label="back to top">&gt;_</a>
    <a href="#about">about</a>
    <a href="#projects">projects</a>
    <a href="#files">files</a>
    <a href="#contact">contact</a>
    <a href="#credits">credits</a>
    <a class="nav-action" target="_blank" rel="noopener noreferrer" href="/files/cv.constantijn-bicker-caarten.pdf">resume<span class="arrow" aria-hidden="true"></span><span class="visually-hidden"> (opens in new tab)</span></a>
    <a class="nav-action" href="mailto:hello@bickercaarten.com">email<span class="arrow" aria-hidden="true"></span><span class="visually-hidden"> (opens email app)</span></a>
    <a class="nav-action" target="_blank" rel="noopener noreferrer" href="https://signal.me/#eu/tD9nyfXpOdrbrCYh-T1BJ8ctPb-8CZ6mWCzzxXCGj0bafnFI5NFCc73yXR05oG50">signal<span class="arrow" aria-hidden="true"></span><span class="visually-hidden"> (opens in new tab)</span></a>
    <input type="checkbox" id="theme-toggle" class="visually-hidden" aria-label="switch between dark and light theme">
    <label class="nav-toggle theme-toggle" for="theme-toggle"></label>
  </nav>

  <div class="title" style="--s1: 0; --n1: 6">
    <code><span aria-hidden="true">&gt;</span> <span class="typed" aria-hidden="true"><span>w</span><span>h</span><span>o</span><span>a</span><span>m</span><span>i</span></span><span class="visually-hidden">whoami</span></code>
    <h1>Constantijn Bicker Caarten</h1>
  </div>

  <main class="grid-container">
    <div class="zz-col zz-left">
      <details id="about" class="grid-item" style="--n1: 13; --s1: 1" open>
        <summary class="grid-item-header">
          <span class="window-title" data-cmd="cat about.txt">constantijn@netsphere</span>
          <span class="close"></span>
        </summary>
        <div class="grid-item-content">
          <code class="command" data-took="2ms">
            <span aria-hidden="true">&gt;</span> <span class="typed" aria-hidden="true"><span>c</span><span>a</span><span>t</span><span class="sp"> </span><span>a</span><span>b</span><span>o</span><span>u</span><span>t</span><span>.</span><span>t</span><span>x</span><span>t</span></span><span class="visually-hidden">cat about.txt</span>
          </code>
          <br>
          <code class="command-result">
            I am Constantijn and this is my <span class="glitch" data-text="cyberhome">cyberhome</span>.
            At the moment there is not much here, but hopefully that will change in the future.
  	        In my free time I'm mostly watching movies or tinkering on my computer.
            Currently I work as a software engineer at <a href="https://123tcs.com">123TCS</a>.
            </code>
        </div>
      </details>

      <details id="files" class="grid-item" style="--n1: 15; --s1: 2" open>
        <summary class="grid-item-header">
          <span class="window-title" data-cmd="ls -lh ~/files/">constantijn@netsphere</span>
          <span class="close"></span>
        </summary>
        <div class="grid-item-content">
          <code class="command" data-took="3ms">
            <span aria-hidden="true">&gt;</span> <span class="typed" aria-hidden="true"><span>l</span><span>s</span><span class="sp"> </span><span>-</span><span>l</span><span>h</span><span class="sp"> </span><span>~</span><span>/</span><span>f</span><span>i</span><span>l</span><span>e</span><span>s</span><span>/</span></span><span class="visually-hidden">ls -lh ~/files/</span>
          </code>
          <br>
          <code class="ls-total" aria-hidden="true">total 860K</code>
          <table class="listing">
            <tr><td aria-hidden="true">-rw-r--r--</td><td aria-hidden="true">736K</td><td aria-hidden="true">Jun  9  2017</td><td><a target="_blank" rel="noopener noreferrer" href="/files/bachelor-thesis.constantijn-bicker-caarten.pdf">bachelor-thesis.pdf<span class="visually-hidden"> (opens in new tab)</span></a></td></tr>
            <tr><td aria-hidden="true">-rw-r--r--</td><td aria-hidden="true">122K</td><td aria-hidden="true">Sep 15 10:56</td><td><a target="_blank" rel="noopener noreferrer" href="/files/cv.constantijn-bicker-caarten.pdf">cv.pdf<span class="visually-hidden"> (opens in new tab)</span></a></td></tr>
          </table>
        </div>
      </details>

      <details id="credits" class="grid-item" style="--n1: 16; --s1: 1; --x1: var(--typo-cost)" open>
        <summary class="grid-item-header">
          <span class="window-title" data-cmd="cat credits.txt">constantijn@netsphere</span>
          <span class="close"></span>
        </summary>
        <div class="grid-item-content">
          <code class="command" data-took="2ms">
            <span aria-hidden="true">&gt;</span> <span class="typed" aria-hidden="true"><span>c</span><span class="typo">t</span><span>a</span><span>t</span><span class="sp"> </span><span>c</span><span>r</span><span>e</span><span>d</span><span>i</span><span>t</span><span>s</span><span>.</span><span>t</span><span>x</span><span>t</span></span><span class="visually-hidden">cat credits.txt</span>
          </code>
          <br>
          <code class="command-result">
            <a target="_blank" rel="noopener noreferrer" href="https://managore.itch.io/m6x11">m6x11<span class="visually-hidden"> (opens in new tab)</span></a> font by Daniel Linssen.
          </code>
        </div>
      </details>
    </div>

    <div class="zz-col zz-right">
      <details id="projects" class="grid-item" style="--n1: 18; --s1: 2; --x1: var(--tab-pause)" open>
        <summary class="grid-item-header">
          <span class="window-title" data-cmd="ls -lh ~/projects/">constantijn@netsphere</span>
          <span class="close"></span>
        </summary>
        <div class="grid-item-content">
          <code class="command" data-took="4ms">
            <span aria-hidden="true">&gt;</span> <span class="typed" aria-hidden="true" style="--tab-i: 12"><span>l</span><span>s</span><span class="sp"> </span><span>-</span><span>l</span><span>h</span><span class="sp"> </span><span>~</span><span>/</span><span>p</span><span>r</span><span>o</span><span class="tab">j</span><span class="tab">e</span><span class="tab">c</span><span class="tab">t</span><span class="tab">s</span><span class="tab">/</span></span><span class="visually-hidden">ls -lh ~/projects/</span>
          </code>
          <br>
          <code class="ls-total" aria-hidden="true">total 12K</code>
          <table class="listing">
            <tr><td aria-hidden="true">drwxr-xr-x</td><td aria-hidden="true">4.0K</td><td aria-hidden="true">Mar 14  2016</td><td><a target="_blank" rel="noopener noreferrer" href="https://git.bickercaarten.com/pyquest">pyquest/<span class="visually-hidden"> (opens in new tab)</span></a></td></tr>
            <tr><td aria-hidden="true">drwxr-xr-x</td><td aria-hidden="true">4.0K</td><td aria-hidden="true">Jun  2  2017</td><td><a target="_blank" rel="noopener noreferrer" href="https://git.bickercaarten.com/tld-analytics">tld-analytics/<span class="visually-hidden"> (opens in new tab)</span></a></td></tr>
            <tr><td aria-hidden="true">drwx------</td><td aria-hidden="true" class="ice">ice</td><td aria-hidden="true"><span class="redacted">xxx xx xx:xx</span></td><td><span class="redacted" aria-hidden="true">xxxxxxxxxx</span><span class="visually-hidden">redacted project</span></td></tr>
          </table>
        </div>
      </details>

      <details id="contact" class="grid-item" style="--n1: 15; --s1: 1; --x1: var(--tab-pause)" open>
        <summary class="grid-item-header">
          <span class="window-title" data-cmd="cat contact.txt">constantijn@netsphere</span>
          <span class="close"></span>
        </summary>
        <div class="grid-item-content">
          <code class="command" data-took="1ms">
            <span aria-hidden="true">&gt;</span> <span class="typed" aria-hidden="true" style="--tab-i: 7"><span>c</span><span>a</span><span>t</span><span class="sp"> </span><span>c</span><span>o</span><span>n</span><span class="tab">t</span><span class="tab">a</span><span class="tab">c</span><span class="tab">t</span><span class="tab">.</span><span class="tab">t</span><span class="tab">x</span><span class="tab">t</span></span><span class="visually-hidden">cat contact.txt</span>
          </code>
          <br>
          <table class="contact-list">
            <tr><td>email</td><td><a href="mailto:hello@bickercaarten.com">hello@bickercaarten.com</a></td></tr>
            <tr><td>signal</td><td><a target="_blank" rel="noopener noreferrer" href="https://signal.me/#eu/tD9nyfXpOdrbrCYh-T1BJ8ctPb-8CZ6mWCzzxXCGj0bafnFI5NFCc73yXR05oG50">open chat<span class="visually-hidden"> (opens in new tab)</span></a></td></tr>
          </table>
        </div>
      </details>
    </div>
  </main>

  <p class="secret">Hello friend :)</p>

  <footer>
    <span class="status-left" aria-hidden="true">[constantijn] 0:zsh* 1:nvim 2:htop-</span>
    <span class="status-message">This website is a public service to intelligence agencies as I don't use any social media platforms.</span>
    <span class="status-right" aria-hidden="true">Last login: Sun Sep 27 04:51:00 2026 on tty1</span>
  </footer>
</body>

</html>