aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--.gitignore2
-rw-r--r--base.ejs20
-rw-r--r--blog.template.html20
-rw-r--r--blog/git_server.html156
-rw-r--r--blog/git_server.md (renamed from blog_src/git_server.md)0
-rwxr-xr-xgenerate42
-rwxr-xr-xgenerate-blog36
-rw-r--r--index.ejs30
-rw-r--r--index.html43
-rw-r--r--index.template.html37
-rw-r--r--school.ejs93
-rw-r--r--school.html107
-rw-r--r--utils/fractal_tree/index.ejs16
-rw-r--r--utils/fractal_tree/index.html43
-rw-r--r--utils/fractal_tree/style.css14
-rw-r--r--utils/langton_ant/index.ejs4
-rw-r--r--utils/langton_ant/index.html16
-rw-r--r--utils/minesweeper/index.ejs31
-rw-r--r--utils/minesweeper/index.html49
-rw-r--r--utils/rot13/index.ejs14
-rw-r--r--utils/rot13/index.html35
-rw-r--r--utils/rot13/style.css7
-rw-r--r--utils/sierpinski_triangle/index.ejs10
-rw-r--r--utils/sierpinski_triangle/index.html37
-rw-r--r--utils/sierpinski_triangle/style.css14
25 files changed, 297 insertions, 579 deletions
diff --git a/.gitignore b/.gitignore
index 751553b..2e0badf 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,3 @@
*.bak
+node_modules
+build
diff --git a/base.ejs b/base.ejs
new file mode 100644
index 0000000..4ddd460
--- /dev/null
+++ b/base.ejs
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>cacharle</title>
+ <meta charset="utf-8"/>
+ <meta name="description" content="Charles Cabergs's website"/>
+ <meta name="keywords" content="Programming"/>
+ <meta name="author" content="Charles Cabergs"/>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+
+ <link rel="stylesheet" type="text/css" href="style.css"/>
+ <link rel="icon" type="image/png" href="favicon.png" />
+ </head>
+
+ <body>
+ <div id="page-wrapper">
+ <%- include(pageFilename, {}) %>
+ </div>
+ </body>
+</html>
diff --git a/blog.template.html b/blog.template.html
deleted file mode 100644
index 7d47893..0000000
--- a/blog.template.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle</title>
- <link rel="stylesheet" type="text/css" href="../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../favicon.png" />
- </head>
-
- <body>
- <div id="page-wrapper">
- <!--BLOG-->
- </div>
-
- <footer>
- <!--TODO-->
- <footer>
- </body>
-</html>
diff --git a/blog/git_server.html b/blog/git_server.html
deleted file mode 100644
index 5a9423c..0000000
--- a/blog/git_server.html
+++ /dev/null
@@ -1,156 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle</title>
- <link rel="stylesheet" type="text/css" href="../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../favicon.png" />
- </head>
-
- <body>
- <div id="page-wrapper">
- <!--BLOG-->
-<h1 id="how-to-make-your-own-git-serverwebsite">How to make your own git server/website</h1>
-<h2 id="basic-ssh-server">Basic ssh server</h2>
-<p>Every repository on the server will be owned by a git user.</p>
-<div class="sourceCode" id="cb1"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb1-1"><a href="#cb1-1" aria-hidden="true" tabindex="-1"></a><span class="ex">useradd</span> -m git</span></code></pre></div>
-<p>Create a new directory to store the repositories owned by the git user.</p>
-<div class="sourceCode" id="cb2"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb2-1"><a href="#cb2-1" aria-hidden="true" tabindex="-1"></a><span class="fu">mkdir</span> /srv/git</span>
-<span id="cb2-2"><a href="#cb2-2" aria-hidden="true" tabindex="-1"></a><span class="fu">chown</span> git:git /srv/git</span></code></pre></div>
-<p>Login as the git user so the new repositories will be owned by him.</p>
-<div class="sourceCode" id="cb3"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb3-1"><a href="#cb3-1" aria-hidden="true" tabindex="-1"></a><span class="fu">su</span> git</span>
-<span id="cb3-2"><a href="#cb3-2" aria-hidden="true" tabindex="-1"></a><span class="bu">cd</span> /srv/git</span></code></pre></div>
-<h3 id="creating-a-repository">Creating a repository</h3>
-<p>They will be stored as bare, meaning we will only store the <code>.git</code> folder not the actual files (called the <em>workspace</em>) to save space.<br />
-It’s a convention to to suffix a bare repository with the <code>.git</code> extension.</p>
-<div class="sourceCode" id="cb4"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb4-1"><a href="#cb4-1" aria-hidden="true" tabindex="-1"></a><span class="fu">mkdir</span> repo.git</span>
-<span id="cb4-2"><a href="#cb4-2" aria-hidden="true" tabindex="-1"></a><span class="bu">cd</span> repo.git</span>
-<span id="cb4-3"><a href="#cb4-3" aria-hidden="true" tabindex="-1"></a><span class="fu">git</span> init --bare</span></code></pre></div>
-<p>Or clone a distant one:</p>
-<div class="sourceCode" id="cb5"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb5-1"><a href="#cb5-1" aria-hidden="true" tabindex="-1"></a><span class="fu">git</span> clone --bare <span class="op">&lt;</span>location<span class="op">&gt;</span></span></code></pre></div>
-<blockquote>
-<p>Look at the content of a bare repository and the <code>.git</code> directory in a regular one to convince yourself that they’re the same.</p>
-</blockquote>
-<h3 id="ssh-authentication">SSH Authentication</h3>
-<p>You could add a password for the git user but it’s ultimately safer to user a key pair.</p>
-<p>If you don’t know what that is you generate it with <code>ssh-keygen</code>.<br />
-Follow the steps and it will create <code>id_rsa</code> (private key) and <code>id_rsa.pub</code> (public key) in <code>~/.ssh</code>.<br />
-On your server you append your <strong>public</strong> key to <code>/home/git/.ssh/authorized_keys</code></p>
-<p>At this point you should be able to login as the git user via ssh</p>
-<div class="sourceCode" id="cb6"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb6-1"><a href="#cb6-1" aria-hidden="true" tabindex="-1"></a><span class="fu">ssh</span> git@<span class="op">&lt;</span>host<span class="op">&gt;</span></span></code></pre></div>
-<p>You can clone from your server.</p>
-<div class="sourceCode" id="cb7"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb7-1"><a href="#cb7-1" aria-hidden="true" tabindex="-1"></a><span class="fu">git</span> clone git@<span class="op">&lt;</span>hostname<span class="op">&gt;</span>:/srv/git/<span class="op">&lt;</span>reponame<span class="op">&gt;</span>.git</span></code></pre></div>
-<h2 id="better-server-interaction-with-git-shell">Better server interaction with git-shell</h2>
-<p>Permitting the git user to have a regular shell can be too permissive, we would like to restrict him to a few repository actions, like creation/deletion, importing (clone), listing.</p>
-<div class="sourceCode" id="cb8"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb8-1"><a href="#cb8-1" aria-hidden="true" tabindex="-1"></a><span class="bu">echo</span> <span class="va">$(</span><span class="fu">which</span> git-shell<span class="va">)</span> <span class="op">&gt;&gt;</span> /etc/shells<span class="kw">`</span> # <span class="ex">Register</span> the git-shell as a valid shell</span>
-<span id="cb8-2"><a href="#cb8-2" aria-hidden="true" tabindex="-1"></a><span class="fu">chsh</span> -s <span class="va">$(</span><span class="fu">which</span> git-shell<span class="va">)</span> git # Change the shell of the git user</span></code></pre></div>
-<p>If you try to ssh as the git user, you will be greeted with something along the line of:</p>
-<pre><code>fatal: Interactive git shell is not enabled.
-hint: ~/git-shell-commands should exist and have read and execute access.
-Connection to &lt;host&gt; closed.</code></pre>
-<p>As suggested by the hint we have to create the directory <code>/home/git/git-shell-commands</code> and put the commands (executable) available to the git user.</p>
-<div class="sourceCode" id="cb10"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb10-1"><a href="#cb10-1" aria-hidden="true" tabindex="-1"></a><span class="co">#!/bin/sh</span></span>
-<span id="cb10-2"><a href="#cb10-2" aria-hidden="true" tabindex="-1"></a><span class="bu">[</span> <span class="va">$#</span> <span class="ot">-ne</span> 1<span class="bu"> ]</span> <span class="kw">&amp;&amp;</span></span>
-<span id="cb10-3"><a href="#cb10-3" aria-hidden="true" tabindex="-1"></a> <span class="bu">echo</span> <span class="st">&quot;Usage: </span><span class="va">$0</span><span class="st"> repository&quot;</span> <span class="kw">&amp;&amp;</span> <span class="bu">exit</span> 1</span>
-<span id="cb10-4"><a href="#cb10-4" aria-hidden="true" tabindex="-1"></a><span class="va">repo_path=</span><span class="st">&quot;/srv/git/</span><span class="va">$1</span><span class="st">.git&quot;</span></span>
-<span id="cb10-5"><a href="#cb10-5" aria-hidden="true" tabindex="-1"></a><span class="bu">[</span> <span class="ot">-d</span> <span class="st">&quot;</span><span class="va">$repo_path</span><span class="st">&quot;</span><span class="bu"> ]</span> <span class="kw">&amp;&amp;</span></span>
-<span id="cb10-6"><a href="#cb10-6" aria-hidden="true" tabindex="-1"></a> <span class="bu">echo</span> <span class="st">&quot;</span><span class="va">$0</span><span class="st">: Error: </span><span class="va">$repo_path</span><span class="st"> already exist&quot;</span> <span class="kw">&amp;&amp;</span> <span class="bu">exit</span> 2</span>
-<span id="cb10-7"><a href="#cb10-7" aria-hidden="true" tabindex="-1"></a><span class="fu">mkdir</span> <span class="st">&quot;</span><span class="va">$repo_path</span><span class="st">&quot;</span></span>
-<span id="cb10-8"><a href="#cb10-8" aria-hidden="true" tabindex="-1"></a><span class="fu">git</span> -C <span class="st">&quot;</span><span class="va">$repo_path</span><span class="st">&quot;</span> init --bare</span></code></pre></div>
-<p>This script create a new repository in <code>/srv/git</code>.<br />
-Put it under <code>git-shell-commands/create</code> and make it executable then try to ssh as the git user once again.<br />
-You will be prompted with <code>git&gt;</code>, you can only execute the <code>create &lt;repository&gt;</code> and <code>exit</code> command.</p>
-<blockquote>
-<p>You can probably create the <code>delete</code>, <code>import</code> and <code>list</code> scripts yourself.<br />
-If you add a <code>help</code> script, it will be ran at the beginning of the connection. It can be used to add a greeting message.</p>
-</blockquote>
-<h2 id="allow-anyone-to-clone-with-git-daemon">Allow anyone to clone with git-daemon</h2>
-<p>Cloning with ssh is fine but only the people with ssh access can do it, we would like anyone to clone.<br />
-git-daemon does precisely that, after running it you will be able to run <code>git clone git://&lt;host&gt;/&lt;repository&gt;</code></p>
-<div class="sourceCode" id="cb11"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb11-1"><a href="#cb11-1" aria-hidden="true" tabindex="-1"></a><span class="fu">git</span> daemon --reuseaddr --base-path=/srv/git/ /srv/git/</span></code></pre></div>
-<p>Follow the instruction of <a href="https://git-scm.com/book/en/v2/Git-on-the-Server-Git-Daemon">this</a> tutorial if you want to know how to make it a service</p>
-<h3 id="publicprivate-repository">Public/private repository</h3>
-<p>You may want to introduce a public/private distinction for your repositories.<br />
-A simple way to do this is by creating a <code>public</code> directory in <code>/srv/git</code> which will contain symbolic link to the repository in <code>/srv/git</code>.</p>
-<pre><code>/srv/git/
- |- foo.git/
- |- bar.git/
- |- qux.git/
- |- public/
- |- foo.git -&gt; /srv/git/foo.git
- |- bar.git -&gt; /srv/git/bar.git</code></pre>
-<blockquote>
-<p>Change the git daemon to only serve the public repositories <code>git daemon --reuseaddr --base-path=/srv/git/public /srv/git/public</code>.</p>
-</blockquote>
-<blockquote>
-<p>Add a <code>publish</code> and <code>unpublish</code> script in <code>git-shell-commands/</code>.</p>
-</blockquote>
-<h2 id="generate-a-static-website">Generate a static website</h2>
-<p>Here we will create a site that look’s like <a href="https://git.suckless.org">this</a> with <a href="https://nginx.org">nginx</a>, <a href="https://git.codemadness.org/stagit/">stagit</a> and a few scripts.<br />
-If you don’t like the minimalist appearance of the site, <a href="https://git.wiki.kernel.org/index.php/Interfaces,_frontends,_and_tools#Web_Interfaces">here</a> is a list of alternatives.</p>
-<h3 id="nginx">nginx</h3>
-<pre><code>server {
- root /var/www/git; # where our website&#39;s files will be located
- index index.html;
- # It&#39;s a convention to put it in a git. subdomain.
- server_name git.&lt;hostname&gt; www.git.&lt;hostname&gt;;
- location / {
- try_files $uri $uri/ =404;
- }
-}</code></pre>
-<p>Put this configuration file in <code>/etc/nginx/sites-available</code>.<br />
-Enable the site <code>ln -s /etc/nginx/sites-available /etc/nginx/sites-enable</code></p>
-<h3 id="stagit">stagit</h3>
-<p>Stagit is pretty small tool so it won’t take long to install it from sources.</p>
-<pre><code>git clone git://git.codemadness.org/stagit
-cd stagit
-make
-make install</code></pre>
-<ul>
-<li><code>stagit /path/to/repository</code>. - generate a static pages for a repository in the current directory.</li>
-<li><code>stagit-index repo1 repo2 repo3 &gt; index.html</code> - generate an index for multiple repositories.</li>
-</ul>
-<blockquote>
-<p>Read the man page of both of these commands for more information</p>
-</blockquote>
-<h4 id="git-hooks">git hooks</h4>
-<p>Git hooks are scripts located in <code>&lt;repository&gt;/.git/hooks</code> that will be run on a certain action.<br />
-The hook we’re interested in is <code>post-receive</code>, it will be ran after someone pushes to the repository.<br />
-We can use it to regenerate the repository’s pages and the website’s index.</p>
-<div class="sourceCode" id="cb15"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb15-1"><a href="#cb15-1" aria-hidden="true" tabindex="-1"></a><span class="co">#!/bin/sh</span></span>
-<span id="cb15-2"><a href="#cb15-2" aria-hidden="true" tabindex="-1"></a></span>
-<span id="cb15-3"><a href="#cb15-3" aria-hidden="true" tabindex="-1"></a><span class="co"># Insert repo_name variable here</span></span>
-<span id="cb15-4"><a href="#cb15-4" aria-hidden="true" tabindex="-1"></a><span class="co"># &lt;REPO_NAME&gt; -- replace with repo_name=name</span></span>
-<span id="cb15-5"><a href="#cb15-5" aria-hidden="true" tabindex="-1"></a></span>
-<span id="cb15-6"><a href="#cb15-6" aria-hidden="true" tabindex="-1"></a><span class="bu">[</span> <span class="ot">-z</span> <span class="st">&quot;</span><span class="va">$repo_name</span><span class="st">&quot;</span><span class="bu"> ]</span> <span class="kw">&amp;&amp;</span> <span class="bu">exit</span> 1</span>
-<span id="cb15-7"><a href="#cb15-7" aria-hidden="true" tabindex="-1"></a><span class="bu">[</span> <span class="ot">!</span> <span class="ot">-d</span> <span class="st">&quot;/srv/git/public/</span><span class="va">$repo_name</span><span class="st">.git&quot;</span><span class="bu"> ]</span> <span class="kw">&amp;&amp;</span> <span class="bu">exit</span></span>
-<span id="cb15-8"><a href="#cb15-8" aria-hidden="true" tabindex="-1"></a></span>
-<span id="cb15-9"><a href="#cb15-9" aria-hidden="true" tabindex="-1"></a><span class="va">repo_web_path=</span><span class="st">&quot;/var/www/git/</span><span class="va">$repo_name</span><span class="st">&quot;</span></span>
-<span id="cb15-10"><a href="#cb15-10" aria-hidden="true" tabindex="-1"></a><span class="fu">mkdir</span> -p <span class="st">&quot;</span><span class="va">$repo_web_path</span><span class="st">&quot;</span></span>
-<span id="cb15-11"><a href="#cb15-11" aria-hidden="true" tabindex="-1"></a><span class="bu">cd</span> <span class="st">&quot;</span><span class="va">$repo_web_path</span><span class="st">&quot;</span> <span class="kw">||</span> <span class="bu">exit</span> 1</span>
-<span id="cb15-12"><a href="#cb15-12" aria-hidden="true" tabindex="-1"></a><span class="ex">stagit</span> <span class="st">&quot;/srv/git/</span><span class="va">$repo_name</span><span class="st">.git&quot;</span></span>
-<span id="cb15-13"><a href="#cb15-13" aria-hidden="true" tabindex="-1"></a><span class="ex">stagit-index</span> /srv/git/public/* <span class="op">&gt;</span> /var/www/git/index.html</span></code></pre></div>
-<p>This is a template for the <code>post-receive</code> hook. Every time you publish a repository you can change his <code>post-receive</code> hook.</p>
-<div class="sourceCode" id="cb16"><pre class="sourceCode sh"><code class="sourceCode bash"><span id="cb16-1"><a href="#cb16-1" aria-hidden="true" tabindex="-1"></a><span class="va">post_receive_path=</span><span class="st">&quot;&lt;repository&gt;/hooks/post-receive&quot;</span></span>
-<span id="cb16-2"><a href="#cb16-2" aria-hidden="true" tabindex="-1"></a><span class="fu">sed</span> <span class="st">&#39;/REPO_NAME/ c repo_name=&#39;&quot;</span><span class="va">$repo</span><span class="st">&quot;</span> <span class="op">&lt;</span> post-receive.template <span class="op">&gt;</span> <span class="st">&quot;</span><span class="va">$post_receive_path</span><span class="st">&quot;</span></span>
-<span id="cb16-3"><a href="#cb16-3" aria-hidden="true" tabindex="-1"></a><span class="fu">chmod</span> +x <span class="st">&quot;</span><span class="va">$post_receive_path</span><span class="st">&quot;</span></span>
-<span id="cb16-4"><a href="#cb16-4" aria-hidden="true" tabindex="-1"></a><span class="st">&quot;</span><span class="va">$post_receive_path</span><span class="st">&quot;</span></span></code></pre></div>
-<blockquote>
-<p>Add this code to your <code>publish</code> script</p>
-</blockquote>
-<h2 id="sources">Sources</h2>
-<ul>
-<li><a href="https://www.youtube.com/watch?v=ju9loeXNVW0">Setting up *Your Own* Git Server</a></li>
-<li><a href="https://git-scm.com/book/en/v2/Git-on-the-Server-Setting-Up-the-Server">Git book - setting up the server</a></li>
-<li><a href="https://git-scm.com/book/en/v2/Git-on-the-Server-Git-Daemon">Git book - git daemon</a></li>
-<li><a href="https://git.codemadness.org/stagit/file/README.html">stagit README</a></li>
-<li><a href="https://git-scm.com/docs/git-shell.html">git-shell man</a></li>
-</ul>
- </div>
-
- <footer>
- <!--TODO-->
- <footer>
- </body>
-</html>
diff --git a/blog_src/git_server.md b/blog/git_server.md
index 67191c6..67191c6 100644
--- a/blog_src/git_server.md
+++ b/blog/git_server.md
diff --git a/generate b/generate
new file mode 100755
index 0000000..725d38e
--- /dev/null
+++ b/generate
@@ -0,0 +1,42 @@
+#!/bin/sh
+
+# Put your posts in a blog_src directory
+# Depends on pandoc for markdown to html convertion
+
+blog_dir=blog
+
+[ ! -d "$blog_dir" ] || [ -z "$(ls $blog_dir)" ] && exit 1
+mkdir -p "$blog_dir"
+
+for post_path in "$blog_dir"/*.md
+do
+ post_dst_path=$(echo "$post_path" | sed 's/\.md/.build.html/')
+
+ # Convert markdown post to html
+ tmp_file=$(mktemp)
+ pandoc -f markdown -t html < "$post_path" > "$tmp_file"
+
+ ejs base.ejs -i "{\"pageFilename\": \"$post_path\" }" > "$post_dst_path"
+
+ # Put the blog content in a wrapper template
+ # sed "/<!--BLOG-->/ r $tmp_file" < blog.template.html > "$post_dst_path"
+
+ # Add blog artcle link to the index.html
+ title=$(grep '^# .*$' -m 1 "$post_path" | cut -c 2-)
+ [ -z "$title" ] && echo "post $post_path doesn't have a title" && title=$post_path
+
+ sed -i'' "/<!--BLOGINDEX-->/ a\
+ <li><a href=\"$post_dst_path\">$title</a></li>" index.html
+
+ echo "Generated post at $post_dst_path"
+done
+
+for util_path in utils/*
+do
+ title=$(basename "$util_path" | tr '_' ' ')
+
+ ejs base.ejs -i "{\"pageFilename\": \"$post_path\" }" > "$post_dst_path"
+
+ sed -i'' "/<!--UTILSINDEX-->/ a\
+ <li><a href=\"$util_path\">$title</a></li>" index.html
+done
diff --git a/generate-blog b/generate-blog
deleted file mode 100755
index 668bad8..0000000
--- a/generate-blog
+++ /dev/null
@@ -1,36 +0,0 @@
-#!/bin/sh
-
-# Put your articles in a blog_src directory
-# Depends on pandoc for markdown to html convertion
-
-cp -vf index.template.html index.html
-rm -vf blog/*
-
-[ ! -d blog_src ] || [ -z "$(ls blog_src)" ] && exit 1
-mkdir -p blog
-
-for article_path in blog_src/*.md
-do
- article_dst_path=$(echo "$article_path" | sed 's/blog_src/blog/' | sed 's/\.md/.html/')
-
- # Convert markdown article to html
- tmp_file=$(mktemp)
- pandoc -f markdown -t html < "$article_path" > "$tmp_file"
- # Put the blog content in a wrapper template
- sed "/<!--BLOG-->/ r $tmp_file" < blog.template.html > "$article_dst_path"
-
- # Add blog artcle link to the index.html
- title=$(grep '^# .*$' -m 1 "$article_path" | cut -c 2-)
- [ -z "$title" ] && echo "Article $article_path doesn't have a title" && title=$article_path
- sed -i'' "/<!--BLOGINDEX-->/ a\
- <li><a href=\"$article_dst_path\">$title</a></li>" index.html
-
- echo "Generated article at $article_dst_path"
-done
-
-for util_path in utils/*
-do
- title=$(basename "$util_path" | tr '_' ' ')
- sed -i'' "/<!--UTILSINDEX-->/ a\
- <li><a href=\"$util_path\">$title</a></li>" index.html
-done
diff --git a/index.ejs b/index.ejs
new file mode 100644
index 0000000..a1afa91
--- /dev/null
+++ b/index.ejs
@@ -0,0 +1,30 @@
+<h1>Charles's website</h1>
+
+<h2>About me</h2>
+<p>I'm a computer science student currently at <a href="https://www.s19.be/">s19</a>, a summary of my progress can be found <a href="school.html">here</a></p>
+<p>This site is an experiment to host some of the services I use every day like a mail server and a <a href="https://git.cacharle.xyz">git server</a> and becoming more independant in general.</p>
+<p>Inspired by a serie of <a href="https://www.youtube.com/watch?v=bdKZVIGRAKQ&list=PL-p5XmQHB_JRRnoQyjOfioJdDmu87DIJc">videos</a> posted by <a href="https://lukesmith.xyz">Luke Smith</a>.</p>
+
+<h2>Blog articles</h2>
+<ul>
+ <% posts.forEach(post => { %>
+ <li><a href="<%= post.url %>">post.title</a></li>
+ <% }) %>
+</ul>
+
+<h2>Utils</h2>
+<ul>
+ <li><a href="https://chat.cacharle.xyz">chat</a></li>
+ <% utils.forEach(util => { %>
+ <li><a href="<%= util.url %>">util.title</a></li>
+ <% }) %>
+</ul>
+
+<h2>Links</h2>
+<ul>
+ <li><a href="https://github.com/cacharle">github</a></li>
+ <li><a href="https://git.cacharle.xyz">git server</a></li>
+ <li><a href="charlescabergspublic.gpg">GPG public key</a></li>
+</ul>
+
+<p>The style sheet used for this site can be found <a href="https://github.com/markdowncss/retro">here</a>.</p>
diff --git a/index.html b/index.html
deleted file mode 100644
index 504dc8f..0000000
--- a/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle</title>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="favicon.png" />
- </head>
-
- <body><div id="page-wrapper">
- <h1>Charles's website</h1>
-
- <h2>About me</h2>
- <p>I'm a computer science student currently at <a href="https://www.s19.be/">s19</a>, a summary of my progress can be found <a href="school.html">here</a></p>
- <p>This site is an experiment to host some of the services I use every day like a mail server and a <a href="https://git.cacharle.xyz">git server</a> and becoming more independant in general.</p>
- <p>Inspired by a serie of <a href="https://www.youtube.com/watch?v=bdKZVIGRAKQ&list=PL-p5XmQHB_JRRnoQyjOfioJdDmu87DIJc">videos</a> posted by <a href="https://lukesmith.xyz">Luke Smith</a>.</p>
-
- <h2>Blog articles</h2>
- <ul>
- <!--BLOGINDEX-->
-<li><a href="blog/git_server.html"> How to make your own git server/website </a></li>
- </ul>
-
- <h2>Utils</h2>
- <ul>
- <li><a href="https://chat.cacharle.xyz">chat</a></li>
- <!--UTILSINDEX-->
-<li><a href="utils/sierpinski_triangle">sierpinski triangle</a></li>
-<li><a href="utils/rot13">rot13</a></li>
-<li><a href="utils/minesweeper">minesweeper</a></li>
-<li><a href="utils/langton_ant">langton ant</a></li>
-<li><a href="utils/fractal_tree">fractal tree</a></li>
- </ul>
-
- <h2>Links</h2>
- <li><a href="https://github.com/cacharle">github</a></li>
- <li><a href="https://git.cacharle.xyz">git server</a></li>
- <li><a href="charlescabergspublic.gpg">GPG public key</a></li>
-
- <p>The style sheet used for this site can be found <a href="https://github.com/markdowncss/retro">here</a></p>
- </div></body>
-</html>
diff --git a/index.template.html b/index.template.html
deleted file mode 100644
index 3ece5b7..0000000
--- a/index.template.html
+++ /dev/null
@@ -1,37 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle</title>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="favicon.png" />
- </head>
-
- <body><div id="page-wrapper">
- <h1>Charles's website</h1>
-
- <h2>About me</h2>
- <p>I'm a computer science student currently at <a href="https://www.s19.be/">s19</a>, a summary of my progress can be found <a href="school.html">here</a></p>
- <p>This site is an experiment to host some of the services I use every day like a mail server and a <a href="https://git.cacharle.xyz">git server</a> and becoming more independant in general.</p>
- <p>Inspired by a serie of <a href="https://www.youtube.com/watch?v=bdKZVIGRAKQ&list=PL-p5XmQHB_JRRnoQyjOfioJdDmu87DIJc">videos</a> posted by <a href="https://lukesmith.xyz">Luke Smith</a>.</p>
-
- <h2>Blog articles</h2>
- <ul>
- <!--BLOGINDEX-->
- </ul>
-
- <h2>Utils</h2>
- <ul>
- <li><a href="https://chat.cacharle.xyz">chat</a></li>
- <!--UTILSINDEX-->
- </ul>
-
- <h2>Links</h2>
- <li><a href="https://github.com/cacharle">github</a></li>
- <li><a href="https://git.cacharle.xyz">git server</a></li>
- <li><a href="charlescabergspublic.gpg">GPG public key</a></li>
-
- <p>The style sheet used for this site can be found <a href="https://github.com/markdowncss/retro">here</a></p>
- </div></body>
-</html>
diff --git a/school.ejs b/school.ejs
new file mode 100644
index 0000000..ca2375d
--- /dev/null
+++ b/school.ejs
@@ -0,0 +1,93 @@
+<h1>School projects</h1>
+
+<p>Most of these are in C and respect the coding style of the school called the <a href="norm.pdf">norm</a>, the guidelines of each project are detailed in the <b>subject.pdf</b> file of each repository.<p/>
+
+<h2>Validated</h2>
+<table>
+ <tr>
+ <th>Name</th>
+ <th>Description</th>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/libft">libft</a></td>
+ <td>Rewrite some of libc's functions, this project will be used and improved throughout the other project since we're
+ generally not allowed 3rd party functions that aren't syscall</td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/get_next_line">get_next_line</a></td>
+ <td>A function which read's the next line of a file descriptor each time it is called, will later be integrated to the libft</td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/ft_printf">ft_printf</a></td>
+ <td>Rewrite the <code>printf</code> function</td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/ft_server">ft_server</a></td>
+ <td>Introduction to Docker, An nginx server running Wordpress, phpmyamdin with a MySQL database</td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/cub3d">cub3d</a></td>
+ <td>Raycasting with textures and a map generated from a formated file</td>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/libasm">libasm</a></td>
+ <td>Indroduction to x86_64 assembly, rewritting some basic libc function</td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/minishell">minishell</a></td>
+ <td>Minimalistic shell based on bash</td>
+ </tr>
+</table>
+
+<h2>Pending</h2>
+<table>
+ <tr><td><a href="https://git.cacharle.xyz/ft_services">ft_services</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/philosophers">philosophers</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/ft_containers">ft_containers</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/computorv1">computorv1</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/computorv2">computorv2</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/push_swap">push_swap</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/fractol">fractol</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/scop">scop</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/42run">42run</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/ft_ls">ft_ls</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/ft_select">ft_select</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/ft_ping">ft_ping</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/piscine_cpp">piscine_cpp</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/ft_ssl">ft_ssl</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/rubik">rubik</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/ft_linear_regression">ft_linear_regression</a></td></tr>
+ <tr><td><a href="https://git.cacharle.xyz/dslr">dslr</a></td></tr>
+</table>
+
+<h2>Test</h2>
+<p>I've made tests for some project's</p>
+<table>
+ <tr>
+ <td>Test</td>
+ <td>Tested</td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/ft_printf_test">ft_printf_test</a></td>
+ <td><a href="https://git.cacharle.xyz/ft_printf">ft_printf</a></td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/libasm_test">libasm_test</a></td>
+ <td><a href="https://git.cacharle.xyz/libasm">libasm</a></td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/minishell_test">minishell_test</a></td>
+ <td><a href="https://git.cacharle.xyz/minishell">minishell</a></td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/philosophers_test">philosophers_test</a></td>
+ <td><a href="https://git.cacharle.xyz/philosophers">philosophers</a></td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/ft_containers_test">ft_containers_test</a></td>
+ <td><a href="https://git.cacharle.xyz/ft_containers">ft_containers</a></td>
+ </tr>
+ <tr>
+ <td><a href="https://git.cacharle.xyz/ft_ls_test">ft_ls_test</a></td>
+ <td><a href="https://git.cacharle.xyz/ft_ls">ft_ls</a></td>
+ </tr>
+</table>
diff --git a/school.html b/school.html
deleted file mode 100644
index 8b91ede..0000000
--- a/school.html
+++ /dev/null
@@ -1,107 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle</title>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="favicon.png" />
- </head>
-
- <body><div id="page-wrapper">
- <h1>School projects</h1>
-
- <p>Most of these are in C and respect the coding style of the school called the <a href="norm.pdf">norm</a>, the guidelines of each project are detailed in the <b>subject.pdf</b> file of each repository.<p/>
-
- <h2>Validated</h2>
- <table>
- <tr>
- <th>Name</th>
- <th>Description</th>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/libft">libft</a></td>
- <td>Rewrite some of libc's functions, this project will be used and improved throughout the other project since we're
- generally not allowed 3rd party functions that aren't syscall</td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/get_next_line">get_next_line</a></td>
- <td>A function which read's the next line of a file descriptor each time it is called, will later be integrated to the libft</td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/ft_printf">ft_printf</a></td>
- <td>Rewrite the <code>printf</code> function</td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/ft_server">ft_server</a></td>
- <td>Introduction to Docker, An nginx server running Wordpress, phpmyamdin with a MySQL database</td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/cub3d">cub3d</a></td>
- <td>Raycasting with textures and a map generated from a formated file</td>
- <tr>
- <td><a href="https://git.cacharle.xyz/libasm">libasm</a></td>
- <td>Indroduction to x86_64 assembly, rewritting some basic libc function</td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/minishell">minishell</a></td>
- <td>Minimalistic shell based on bash</td>
- </tr>
- </table>
-
- <h2>Pending</h2>
- <table>
- <tr><td><a href="https://git.cacharle.xyz/ft_services">ft_services</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/philosophers">philosophers</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/ft_containers">ft_containers</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/computorv1">computorv1</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/computorv2">computorv2</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/push_swap">push_swap</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/fractol">fractol</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/scop">scop</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/42run">42run</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/ft_ls">ft_ls</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/ft_select">ft_select</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/ft_ping">ft_ping</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/piscine_cpp">piscine_cpp</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/ft_ssl">ft_ssl</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/rubik">rubik</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/ft_linear_regression">ft_linear_regression</a></td></tr>
- <tr><td><a href="https://git.cacharle.xyz/dslr">dslr</a></td></tr>
- </table>
-
- <h2>Test</h2>
- <p>I've made tests for some project's</p>
- <table>
- <tr>
- <td>Test</td>
- <td>Tested</td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/ft_printf_test">ft_printf_test</a></td>
- <td><a href="https://git.cacharle.xyz/ft_printf">ft_printf</a></td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/libasm_test">libasm_test</a></td>
- <td><a href="https://git.cacharle.xyz/libasm">libasm</a></td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/minishell_test">minishell_test</a></td>
- <td><a href="https://git.cacharle.xyz/minishell">minishell</a></td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/philosophers_test">philosophers_test</a></td>
- <td><a href="https://git.cacharle.xyz/philosophers">philosophers</a></td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/ft_containers_test">ft_containers_test</a></td>
- <td><a href="https://git.cacharle.xyz/ft_containers">ft_containers</a></td>
- </tr>
- <tr>
- <td><a href="https://git.cacharle.xyz/ft_ls_test">ft_ls_test</a></td>
- <td><a href="https://git.cacharle.xyz/ft_ls">ft_ls</a></td>
- </tr>
- </table>
-
- </div></body>
-</html>
diff --git a/utils/fractal_tree/index.ejs b/utils/fractal_tree/index.ejs
new file mode 100644
index 0000000..088dd83
--- /dev/null
+++ b/utils/fractal_tree/index.ejs
@@ -0,0 +1,16 @@
+<h1>fractal tree</h1>
+
+<canvas width="500" height="500" id="tree-canvas"></canvas>
+
+<div class="settings">
+ <div class="settings-item">
+ <label>depth</label>
+ <input id="depth" min="1" max="11" value="9" type="range"/>
+ </div>
+ <div class="settings-item">
+ <label>angle</label>
+ <input id="angle" min="1" max="180" value="45" type="range"/>
+ </div>
+</div>
+
+<script src="script.js" type="text/javascript"></script>
diff --git a/utils/fractal_tree/index.html b/utils/fractal_tree/index.html
deleted file mode 100644
index 5c4adf2..0000000
--- a/utils/fractal_tree/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - fractal tree</title>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <style>
- .settings-item {
- margin-top: 10px;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- }
- .settings-item label {
- margin-right: 5px;
- }
- .settings-item input {
- min-width: 200px;
- }
- </style>
- </head>
-
- <body><div id="page-wrapper">
- <h1>fractal tree</h1>
-
- <canvas width="500" height="500" id="tree-canvas"></canvas>
-
- <div class="settings">
- <div class="settings-item">
- <label>depth</label>
- <input id="depth" min="1" max="11" value="9" type="range"/>
- </div>
- <div class="settings-item">
- <label>angle</label>
- <input id="angle" min="1" max="180" value="45" type="range"/>
- </div>
- </div>
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/fractal_tree/style.css b/utils/fractal_tree/style.css
new file mode 100644
index 0000000..788de38
--- /dev/null
+++ b/utils/fractal_tree/style.css
@@ -0,0 +1,14 @@
+.settings-item {
+ margin-top: 10px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.settings-item label {
+ margin-right: 5px;
+}
+
+.settings-item input {
+ min-width: 200px;
+}
diff --git a/utils/langton_ant/index.ejs b/utils/langton_ant/index.ejs
new file mode 100644
index 0000000..5930ebe
--- /dev/null
+++ b/utils/langton_ant/index.ejs
@@ -0,0 +1,4 @@
+<h1>langton ant</h1>
+<table id="table"></table>
+<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+<script type="text/javascript" src="script.js"></script>
diff --git a/utils/langton_ant/index.html b/utils/langton_ant/index.html
deleted file mode 100644
index ad8ef22..0000000
--- a/utils/langton_ant/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html>
- <head>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta charset="utf-8"/>
- <title>cacharle - langton ant</title>
- </head>
- <body>
- <h1>langton ant</h1>
- <table id="table">
- </table>
- <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
- <script type="text/javascript" src="script.js"></script>
- </body>
-</html>
diff --git a/utils/minesweeper/index.ejs b/utils/minesweeper/index.ejs
new file mode 100644
index 0000000..fdbb5be
--- /dev/null
+++ b/utils/minesweeper/index.ejs
@@ -0,0 +1,31 @@
+<h1>minesweeper</h1>
+
+<div id="flash-message" hidden>You lost in asdf seconds</div>
+
+<div class="info-bar">
+ <div id="minesweeper-game-info" hidden>
+ <div>
+ <div id="minesweeper-timer">1:30</div>
+ <button id="minesweeper-stop" class="game-state">stop</button>
+ </div>
+ </div>
+
+ <div id="minesweeper-settings">
+ <div>
+ <label for="width">width</label>
+ <input id="minesweeper-width" name="width" type="range" min="3" max="20" value="10"/>
+ </div>
+ <div>
+ <label for="height">height</label>
+ <input id="minesweeper-height" name="height" type="range" min="3" max="20" value="10"/>
+ </div>
+ <div>
+ <label for="mine-rate">mine rate</label>
+ <input id="minesweeper-mine-rate" name="mine-rate" type="range" min="0" max="100" value="20"/>
+ </div>
+ </div>
+</div>
+
+<table id="minesweeper-table"></table>
+
+<script src="script.js" type="text/javascript"></script>
diff --git a/utils/minesweeper/index.html b/utils/minesweeper/index.html
deleted file mode 100644
index 8945dbd..0000000
--- a/utils/minesweeper/index.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - minesweeper</title>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <link rel="stylesheet" type="text/css" href="style.css"/>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- </head>
-
- <body><div id="page-wrapper">
- <h1>minesweeper</h1>
-
- <div id="flash-message" hidden>You lost in asdf seconds</div>
-
- <div class="info-bar">
- <div id="minesweeper-game-info" hidden>
- <div>
- <div id="minesweeper-timer">1:30</div>
- <button id="minesweeper-stop" class="game-state">stop</button>
- </div>
- </div>
-
- <div id="minesweeper-settings">
- <div>
- <label for="width">width</label>
- <input id="minesweeper-width" name="width" type="range" min="3" max="20" value="10"/>
- </div>
- <div>
- <label for="height">height</label>
- <input id="minesweeper-height" name="height" type="range" min="3" max="20" value="10"/>
- </div>
- <div>
- <label for="mine-rate">mine rate</label>
- <input id="minesweeper-mine-rate" name="mine-rate" type="range" min="0" max="100" value="20"/>
- </div>
- </div>
- </div>
-
- <table id="minesweeper-table">
- </table>
-
-
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/rot13/index.ejs b/utils/rot13/index.ejs
new file mode 100644
index 0000000..27b3a20
--- /dev/null
+++ b/utils/rot13/index.ejs
@@ -0,0 +1,14 @@
+<h1>rot13</h1>
+
+<p>Implementation of the <a href="https://en.wikipedia.org/wiki/ROT13">rot13</a> encryption</p>
+
+<div>Shift size: <span id="rot13-shift-output"></span></div>
+<input type="range" min=0 max=26 value=13 id="rot13-shift"/>
+
+<h3>Input</h3>
+<textarea cols=120 rows=10 id="rot13-input">rotate me!</textarea>
+
+<h3>Output</h3>
+<textarea cols=120 rows=10 id="rot13-output"></textarea>
+
+<script src="script.js" type="text/javascript"></script>
diff --git a/utils/rot13/index.html b/utils/rot13/index.html
deleted file mode 100644
index 525e14f..0000000
--- a/utils/rot13/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - rot13</title>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <style>
- textarea {
- resize: none;
- }
- input {
- width: 50%;
- }
- </style>
- </head>
-
- <body><div id="page-wrapper">
- <h1>rot13</h1>
-
- <p>Implementation of the <a href="https://en.wikipedia.org/wiki/ROT13">rot13</a> encryption</p>
-
- <div>Shift size: <span id="rot13-shift-output"></span></div>
- <input type="range" min=0 max=26 value=13 id="rot13-shift"/>
-
- <h3>Input</h3>
- <textarea cols=120 rows=10 id="rot13-input">rotate me!</textarea>
-
- <h3>Output</h3>
- <textarea cols=120 rows=10 id="rot13-output"></textarea>
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/rot13/style.css b/utils/rot13/style.css
new file mode 100644
index 0000000..c8046b9
--- /dev/null
+++ b/utils/rot13/style.css
@@ -0,0 +1,7 @@
+textarea {
+ resize: none;
+}
+
+input {
+ width: 50%;
+}
diff --git a/utils/sierpinski_triangle/index.ejs b/utils/sierpinski_triangle/index.ejs
new file mode 100644
index 0000000..c9b0247
--- /dev/null
+++ b/utils/sierpinski_triangle/index.ejs
@@ -0,0 +1,10 @@
+<h1>sierpinski triangle</h1>
+
+<canvas width="500" height="500" id="sierpinski-triangle"></canvas>
+
+<div class="settings">
+ <label>depth</label>
+ <input id="depth" min="1" max="9" value="7" type="range"/>
+</div>
+
+<script src="script.js" type="text/javascript"></script>
diff --git a/utils/sierpinski_triangle/index.html b/utils/sierpinski_triangle/index.html
deleted file mode 100644
index 036e8ac..0000000
--- a/utils/sierpinski_triangle/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
-<!DOCTYPE html>
-
-<html>
- <head>
- <title>cacharle - sierpinski triangle</title>
- <link rel="stylesheet" type="text/css" href="../../style.css"/>
- <meta charset="utf-8"/>
- <link rel="icon" type="image/png" href="../../favicon.png" />
- <style>
- .settings {
- margin-top: 10px;
- display: flex;
- justify-content: flex-start;
- align-items: center;
- }
- .settings label {
- margin-right: 5px;
- }
- .settings input {
- min-width: 200px;
- }
- </style>
- </head>
-
- <body><div id="page-wrapper">
- <h1>sierpinski triangle</h1>
-
- <canvas width="500" height="500" id="sierpinski-triangle"></canvas>
-
- <div class="settings">
- <label>depth</label>
- <input id="depth" min="1" max="9" value="7" type="range"/>
- </div>
-
- </div></body>
- <script src="script.js" type="text/javascript"></script>
-</html>
diff --git a/utils/sierpinski_triangle/style.css b/utils/sierpinski_triangle/style.css
new file mode 100644
index 0000000..b62fd44
--- /dev/null
+++ b/utils/sierpinski_triangle/style.css
@@ -0,0 +1,14 @@
+.settings {
+ margin-top: 10px;
+ display: flex;
+ justify-content: flex-start;
+ align-items: center;
+}
+
+.settings label {
+ margin-right: 5px;
+}
+
+.settings input {
+ min-width: 200px;
+}