diff --git a/main.py b/main.py
index cd9ac48..ff38978 100644
--- a/main.py
+++ b/main.py
@@ -1,5 +1,58 @@
+from jinja2 import Environment, FileSystemLoader
+from itertools import chain
+from pathlib import Path
+import mimetypes
+
+
+MEDIA_FOLDER = "/home/thibaud/Vidéos/Programmation/"
+OUTPUT_DIR = "./out"
+
+
+def find(name: str, path: Path) -> Path:
+    for file in path.glob("*.*"):
+        if name in file.name:
+            return file
+
+
+def generate_index(folder: Path, output: Path, env: Environment):
+    template = env.get_template("main.tpl")
+    file = output.joinpath(f"{folder.stem}.html")
+    with open(file, "w") as outfile:
+        articles = []
+        for file in chain(folder.glob("*.mkv"), folder.glob("*.mp4")):
+            articles.append(
+                env.get_template("video.tpl").render(
+                    staticdir="/static/",
+                    title=file.stem,
+                    src="/" + str(file.relative_to(Path(MEDIA_FOLDER).parent)),
+                    mime=mimetypes.guess_type(file),
+                )
+            )
+
+        outfile.writelines(template.render(content="\n".join(articles)))
+
+
 def main():
-    pass
+    out = Path(OUTPUT_DIR)
+    with open(out.joinpath("index.html"), "w") as outfile:
+        env = Environment(loader=FileSystemLoader("templates"))
+        template = env.get_template("main.tpl")
+
+        articles = []
+        for folder in (x for x in Path(MEDIA_FOLDER).iterdir() if x.is_dir()):
+            # Main index
+            thumbnail = find("thumbnail.png", folder)
+            articles.append(
+                env.get_template("folder.tpl").render(
+                    staticdir="/static/",
+                    title=folder.stem,
+                    src=str(thumbnail),
+                    ref=str(folder) + '.html'
+                )
+            )
+            generate_index(folder, out, env)
+
+        outfile.writelines(template.render(content="\n".join(articles)))
 
 
 if __name__ == "__main__":
diff --git a/templates/folder.tpl b/templates/folder.tpl
new file mode 100644
index 0000000..8cd251d
--- /dev/null
+++ b/templates/folder.tpl
@@ -0,0 +1,6 @@
+<article class="col-4">
+    <h4 class="text-truncate">{{ title }}</h4>
+    <a href="{{ ref }}">
+        <img class="img-thumbnail" src="{{ src }}" height="128" />
+    </a>
+</article>
\ No newline at end of file
diff --git a/templates/footer.tpl b/templates/footer.tpl
new file mode 100644
index 0000000..83703cc
--- /dev/null
+++ b/templates/footer.tpl
@@ -0,0 +1,3 @@
+<footer class="navbar navbar-dark bg-secondary" role="contentinfo">
+    <p>Copyright info goes here</p>
+</footer>
\ No newline at end of file
diff --git a/templates/head.tpl b/templates/head.tpl
new file mode 100644
index 0000000..87de3fe
--- /dev/null
+++ b/templates/head.tpl
@@ -0,0 +1,9 @@
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+<meta name="description" content="">
+<meta name="author" content="Thibaud Gasser">
+<title>My test page</title>
+<link rel="stylesheet" href="{{ staticdir }}/css/bootstrap.min.css">
+<script defer src="{{ staticdir }}/js/jquery-3.3.1.slim.min.js"></script>
+<script defer src="{{ staticdir }}/js/popper.min.js"></script>
+<script defer src="{{ staticdir }}/js/bootstrap.min.js"></script>
\ No newline at end of file
diff --git a/templates/header.tpl b/templates/header.tpl
new file mode 100644
index 0000000..a1f4732
--- /dev/null
+++ b/templates/header.tpl
@@ -0,0 +1,17 @@
+<nav class="navbar navbar-expand-lg navbar-light bg-light" role="navigation">
+    <ul class="navbar-nav mr-auto">
+        <li class="nav-item active">
+            <a class="nav-link" href="#">Home</a>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link" href="#">Info</a>
+        </li>
+        <li class="nav-item">
+            <a class="nav-link" href="#">About</a>
+        </li>
+    </ul>
+    <form class="form-inline my-2 my-lg-0">
+        <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
+        <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
+    </form>
+</nav>
\ No newline at end of file
diff --git a/templates/main.tpl b/templates/main.tpl
new file mode 100644
index 0000000..6cb7ceb
--- /dev/null
+++ b/templates/main.tpl
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    {% include "head.tpl" %}
+  </head>
+  <body>
+    {% include "header.tpl" %}
+    <main role="main">
+      <section class="jumbotron">
+        <h1 class="display-4">Hello there!</h1>
+        <p class="lead">General info about the page goes here</p>
+        <p><a class="btn btn-primary btn-lg" href="#">Learn more</a></p>
+      </section>
+      <section class="container">
+        <div class="row">
+          {{ content }}
+        </div>
+      </section>
+    </main>
+    {% include "footer.tpl" %}
+  </body>
+</html>
\ No newline at end of file
diff --git a/templates/video.tpl b/templates/video.tpl
new file mode 100644
index 0000000..cc93195
--- /dev/null
+++ b/templates/video.tpl
@@ -0,0 +1,9 @@
+<article class="col-4">
+    <h4 class="text-truncate">{{ title }}</h4>
+    <div class="embed-responsive embed-responsive-16by9">
+
+        <video class="embed-responsive-item" controls>
+            <source src="{{ src }}" type="{{ mime }}"/>
+        </video>
+    </div>
+</article>
\ No newline at end of file