Compare commits
No commits in common. "97dab9126bb000b0ff855a966aaa152020f304ea" and "8e7da7fe837ec36f15b30942c82b598140b9a0e7" have entirely different histories.
97dab9126b
...
8e7da7fe83
11 changed files with 2695 additions and 99 deletions
4
.gitignore
vendored
4
.gitignore
vendored
|
|
@ -1,4 +1,2 @@
|
|||
.venv
|
||||
__pycache__
|
||||
node_modules
|
||||
pub
|
||||
.ropeproject
|
||||
|
|
|
|||
3
Makefile
3
Makefile
|
|
@ -1,3 +0,0 @@
|
|||
upload:
|
||||
scp ./pub/* madrse@madr.se:~/exported/src/cv
|
||||
|
||||
|
|
@ -66,9 +66,9 @@ a:active {
|
|||
[href^="mailto"]::before {
|
||||
content: "✉️ ";
|
||||
}
|
||||
[href^="https://codeberg.org"]::before
|
||||
[href^="https://github.com"]::before
|
||||
{
|
||||
content: "⛰️ ";
|
||||
content: "🐙 ";
|
||||
}
|
||||
[href^="https://madr"]::before
|
||||
{
|
||||
|
|
@ -79,7 +79,7 @@ a:active {
|
|||
padding: 0.3em;
|
||||
}
|
||||
[href$="pdf"]::before {
|
||||
content: "⬇️ ";
|
||||
content: "📑 ";
|
||||
}
|
||||
[href$="pdf"]:hover::before,
|
||||
[href$="pdf"]:focus::before {
|
||||
|
|
@ -196,8 +196,7 @@ the upcoming Container queries was a thing.
|
|||
padding: 1em;
|
||||
color: #111;
|
||||
display: flex;
|
||||
gap: 2rem;
|
||||
justify-content: flex-start;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
13
cv.py
13
cv.py
|
|
@ -1,13 +0,0 @@
|
|||
from smed import Smed
|
||||
from smed_layouts import layouts
|
||||
from smed_markdown import markdown
|
||||
|
||||
(
|
||||
Smed()
|
||||
.source("./src")
|
||||
.destination("./pub")
|
||||
.static(["*.css", "*.pdf"])
|
||||
.use(markdown())
|
||||
.use(layouts())
|
||||
.build()
|
||||
)
|
||||
BIN
dist/anders-englof-ytterstrom.pdf
vendored
BIN
dist/anders-englof-ytterstrom.pdf
vendored
Binary file not shown.
51
index.js
Normal file
51
index.js
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
var Metalsmith = require("metalsmith");
|
||||
var htmlMinifier = require("metalsmith-html-minifier");
|
||||
var layouts = require("metalsmith-layouts");
|
||||
var markdown = require("metalsmith-markdown-remarkable");
|
||||
var permalinks = require("@metalsmith/permalinks");
|
||||
var static = require("metalsmith-static");
|
||||
var puppeteer = require("puppeteer");
|
||||
|
||||
var srcHTML = "file:" + __dirname + "/pub/index.html";
|
||||
var destPDF = "./pub/cv-anders-englof-ytterstrom.pdf";
|
||||
|
||||
async function generatePDF() {
|
||||
const browser = await puppeteer.launch();
|
||||
const page = await browser.newPage();
|
||||
await page.goto(srcHTML, {
|
||||
waitUntil: "networkidle2",
|
||||
});
|
||||
await page.pdf({
|
||||
path: destPDF,
|
||||
});
|
||||
await browser.close();
|
||||
}
|
||||
|
||||
Metalsmith(__dirname)
|
||||
.source("./src")
|
||||
.destination("./pub")
|
||||
.use(
|
||||
markdown({
|
||||
html: true,
|
||||
typographer: false,
|
||||
}),
|
||||
)
|
||||
.use(permalinks())
|
||||
.use(
|
||||
layouts({
|
||||
engine: "handlebars",
|
||||
}),
|
||||
)
|
||||
.use(htmlMinifier())
|
||||
.use(
|
||||
static({
|
||||
src: "./assets",
|
||||
dest: "./",
|
||||
}),
|
||||
)
|
||||
.build(function (err, _files) {
|
||||
if (err) {
|
||||
throw err;
|
||||
}
|
||||
generatePDF();
|
||||
});
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
<html lang="en">
|
||||
<!--
|
||||
Welcome to the source code of the resume of Anders Englöf Ytterström!
|
||||
Welcome to the source code of the resume of Anders Ytterström!
|
||||
|
||||
I apologize for the ending slash (/) in the void elements, this
|
||||
is due to an opinion that won't be added as an option to skip in
|
||||
|
|
@ -10,11 +10,11 @@
|
|||
best viewed in a web browser, though. :)
|
||||
|
||||
Colophon:
|
||||
- Smed, the pluggable static site generator.
|
||||
- Metalsmith, the pluggable static site generator.
|
||||
- Prettier, for code formatting.
|
||||
- Jinja2, not my favorite template engine but it does the job.
|
||||
- Handlebars, not my favorite template engine but it does the job.
|
||||
- Markdown.
|
||||
- Plain old CSS.
|
||||
- Plain old CSS, for a change.
|
||||
|
||||
Internet Explorer support was not considered when
|
||||
creating this page. I apologize if this is an issue for you.
|
||||
|
|
@ -48,8 +48,8 @@
|
|||
<dd><a href="tel:+46702169645">+46 70 216 96 45</a></dd>
|
||||
<dt>Email:</dt>
|
||||
<dd><a href="mailto:{{email}}">{{email}}</a></dd>
|
||||
<dt>Codeberg:</dt>
|
||||
<dd><a href="https://codeberg.org/{{codeberg}}" rel="external" title="Codeberg">{{codeberg}}</a></dd>
|
||||
<dt>Github:</dt>
|
||||
<dd><a href="https://github.com/{{github}}" rel="external" title="Github">{{github}}</a></dd>
|
||||
<dt>Website:</dt>
|
||||
<dd><a href="https://{{website}}" rel="external" title="Website">{{website}}</a></dd>
|
||||
</dl>
|
||||
|
|
@ -57,98 +57,98 @@
|
|||
</div>
|
||||
<section class="about">
|
||||
<div>
|
||||
{{content}}
|
||||
{{{contents}}}
|
||||
</div>
|
||||
<span>
|
||||
<a href="./cv-anders-englof-ytterstrom.pdf" download>Download as PDF</a>
|
||||
<a href="./cv-anders-englof-ytterstrom.pdf">Download as PDF</a>
|
||||
</span>
|
||||
</section>
|
||||
<section class="skills">
|
||||
<h2>Skills</h2>
|
||||
<dl class="skillset">
|
||||
{% for area, values in skills.items() %}
|
||||
<dt>{{ area }}</dt>
|
||||
<dd>{{ values }}</dd>
|
||||
{% endfor %}
|
||||
{{#each skills}}
|
||||
<dt>{{@key}}</dt>
|
||||
<dd>{{.}}</dd>
|
||||
{{/each}}
|
||||
</dl>
|
||||
</section>
|
||||
<section class="work">
|
||||
<h2>Experience</h2>
|
||||
<div class="timeline">
|
||||
{% for w in work %}
|
||||
{{#each work}}
|
||||
<article class="event">
|
||||
<h3 class="event__title">{{ w.employer }}, {{ w.type }}</h3>
|
||||
<div class="event__location event__aside">{{ w.location }}</div>
|
||||
<div class="event__position">{{ w.position }}</div>
|
||||
<div class="event__date event__aside">{{ w.date }}</div>
|
||||
<h3 class="event__title">{{employer}}, {{type}}</h3>
|
||||
<div class="event__location event__aside">{{location}}</div>
|
||||
<div class="event__position">{{position}}</div>
|
||||
<div class="event__date event__aside">{{date}}</div>
|
||||
<div class="event__content">
|
||||
<ul>
|
||||
{% for responsibility in w.responsibilies %}
|
||||
<li>{{ responsibility }}</li>
|
||||
{% endfor %}
|
||||
{{#each responsibilies}}
|
||||
<li>{{.}}</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
{% endfor %}
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
<section class="education">
|
||||
<h2>Education</h2>
|
||||
<div class="timeline">
|
||||
{% for e in education %}
|
||||
{{#each education}}
|
||||
<article class="event">
|
||||
<h3 class="event__title">{{ e.institution }}</h3>
|
||||
<div class="event__location event__aside">{{ e.location }}</div>
|
||||
<div class="event__position">{{ e.graduation }}</div>
|
||||
<div class="event__date event__aside">{{ e.date }}</div>
|
||||
<h3 class="event__title">{{institution}}</h3>
|
||||
<div class="event__location event__aside">{{location}}</div>
|
||||
<div class="event__position">{{graduation}}</div>
|
||||
<div class="event__date event__aside">{{date}}</div>
|
||||
<div class="event__content">
|
||||
{{ e.fields }}
|
||||
{{fields}}
|
||||
</div>
|
||||
</article>
|
||||
{% endfor %}
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
<section class="projects">
|
||||
<h2>Projects</h2>
|
||||
<div class="timeline">
|
||||
{% for p in projects %}
|
||||
{{#each projects}}
|
||||
<article class="event">
|
||||
<h3 class="event__title">{{ p.name }}</h3>
|
||||
<h3 class="event__title">{{name}}</h3>
|
||||
<i></i>
|
||||
<div class="event__position">{{ p.context }}</div>
|
||||
<div class="event__aside">{{ p.date }}</div>
|
||||
<div class="event__position">{{context}}</div>
|
||||
<div class="event__aside">{{date}}</div>
|
||||
<div class="event__content">
|
||||
<ul>
|
||||
{% for responsibility in responsibilies %}
|
||||
<li>{{ responsibility }}</li>
|
||||
{% endfor %}
|
||||
{{#each responsibilies}}
|
||||
<li>{{.}}</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</article>
|
||||
{% endfor %}
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
<section class="courses">
|
||||
<h2 class="h-aside">Courses, Conferences & Certifications</h2>
|
||||
<ul>
|
||||
{% for course in courses %}
|
||||
<li>{{ course }}</li>
|
||||
{% endfor %}
|
||||
{{#each courses}}
|
||||
<li>{{.}}</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section class="personal">
|
||||
<h2 class="h-aside">Personal Projects</h2>
|
||||
<div class="timeline">
|
||||
{% for k, v in personal.items() %}
|
||||
{{#each personal}}
|
||||
<article class="event event--aside">
|
||||
<h3 class="event__title">{{ k }}</h3>
|
||||
<h3 class="event__title">{{@key}}</h3>
|
||||
<i></i>
|
||||
<div class="event__content">
|
||||
<p>{{ v }}</p>
|
||||
<p>{{.}}</p>
|
||||
</div>
|
||||
</article>
|
||||
{% endfor %}
|
||||
{{/each}}
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
2562
package-lock.json
generated
Normal file
2562
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
17
package.json
Normal file
17
package.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "madr-se-cv",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "node index.js"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@metalsmith/permalinks": "^2.2.0",
|
||||
"handlebars": "^4.7.7",
|
||||
"metalsmith": "^2.1.0",
|
||||
"metalsmith-html-minifier": "^3.0.3",
|
||||
"metalsmith-layouts": "^1.4.1",
|
||||
"metalsmith-markdown-remarkable": "^1.0.2",
|
||||
"metalsmith-static": "0.0.5",
|
||||
"puppeteer": "^23.6.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
smed @ git+https://codeberg.org/madr/smed@main
|
||||
smed_layouts @ git+https://codeberg.org/madr/smed-layouts@v1.0.1
|
||||
smed_markdown @ git+https://codeberg.org/madr/smed-markdown@v1.0.0
|
||||
46
src/index.md
46
src/index.md
|
|
@ -1,28 +1,18 @@
|
|||
---
|
||||
skip: true
|
||||
title: cv
|
||||
layout: cv.html.j2
|
||||
layout: cv.hbs
|
||||
name: Anders Englöf Ytterström
|
||||
ogdesc: Anders Englöf Ytterström - Linux specialst, Frontend Engineer, Web standardista
|
||||
titles: Linux specialist, Frontend Engineer, Web standardista
|
||||
ogdesc: Anders Englöf Ytterström - Frontend Engineer, Full Stack Developer, Web standardista
|
||||
titles: Frontend Engineer, Full Stack Developer, Web standardista
|
||||
address: Balladvägen 3, 784 43 Borlänge, Sweden
|
||||
email: yttan@fastmail.se
|
||||
codeberg: madr
|
||||
github: madr
|
||||
website: madr.se
|
||||
work:
|
||||
- employer: Swedish Transport Administration (Trafikverket)
|
||||
type: Government agency
|
||||
date: Aug 2025–now
|
||||
location: Borlänge, Sweden
|
||||
position: Systems technician
|
||||
responsibilies:
|
||||
- Linux server administration.
|
||||
- Container orchestration.
|
||||
- Service monitoring and observability.
|
||||
- Shell scripts, Ansible, Grafana, OpenTelemetry, RHEL, Ubuntu Server, OpenShift.
|
||||
|
||||
- employer: PlaymakerAI
|
||||
type: Data analytics SaaS
|
||||
date: Nov 2023–Aug 2025
|
||||
date: Nov 2023–now
|
||||
location: Remote position
|
||||
position: Full Stack Engineer
|
||||
responsibilies:
|
||||
|
|
@ -32,7 +22,7 @@ work:
|
|||
|
||||
- employer: Stratsys
|
||||
type: Process management platform (SaaS)
|
||||
date: Mar 2022–Oct 2023
|
||||
date: Mar 2022–Oct 2023
|
||||
location: Remote position
|
||||
position: Senior Frontend Architect
|
||||
responsibilies:
|
||||
|
|
@ -43,7 +33,7 @@ work:
|
|||
|
||||
- employer: Iteam
|
||||
type: Technical Innovation agency
|
||||
date: Sep 2021–Mar 2022
|
||||
date: Sep 2021–Mar 2022
|
||||
location: Remote position
|
||||
position: Full Stack Developer
|
||||
responsibilies:
|
||||
|
|
@ -114,19 +104,18 @@ education:
|
|||
skills:
|
||||
Programming languages: HTML, CSS (Sass), Python, JavaScript (TypeScript), Elixir, Rust, PHP
|
||||
Development process: CI/CD, Automated testing, Mentoring, Mob programming, Pair programming
|
||||
Web Backend Frameworks: Django, Flask, Bottle, Tornado, Phoenix (LiveView), Express, Remix, Next.js
|
||||
Web Backend Frameworks: Django, Flask, Phoenix (LiveView), Express, Remix, Next.js
|
||||
Web Frontend: React, Redux, Vue, Svelte, Lit, OOCSS, BEM, Living styleguides
|
||||
Data visualization: Vega, Altair, Vega-Lite, Advanced SVG
|
||||
Build systems: Webpack, Parcel, esbuild
|
||||
Content management: Wordpress, Joomla, Directus
|
||||
Web Backend testing: pytest, Jest, Selenium, Playwright, Puppeteer, WebDriverIO, Web Test Runner
|
||||
Web Frontend testing: Lighthouse, Axe, WebAIM, VoiceOver, Voice Assistant, NVDA, Cypress
|
||||
Deployment: AWS, Docker, Podman, Kubernetes, OpenShift, Ansible, Terraform, Azure DevOps, Render
|
||||
Distribution: Nameko, RabbitMQ, Celery
|
||||
Observability: Grafana, OpenTelemetry, Kibana, Prometheus
|
||||
Databases: MySQL, Postgres, Elasticsearch (Opensearch), GraphQL, Influx, Timescale, MSSQL
|
||||
Deployment: AWS, Docker (Podman), Kubernetes, Ansible, Terraform, Azure DevOps, Render
|
||||
"Services & Infrastructure": Nameko, RabbitMQ, Celery, Kibana, Prometheus
|
||||
Databases: MySQL, Postgres, Elasticsearch (Opensearch), GraphQL, Influx, Timescale
|
||||
Version control: Git, Subversion
|
||||
Operating systems: Mac OS, RHEL, SLE, Debian, Ubuntu server, Arch linux, Alpine, OpenSUSE, Windows
|
||||
Operating systems: Mac OS, RHEL, Debian, Ubuntu server, Arch linux, Windows
|
||||
Other skills: Inclusive communication, Accessibility compliance, Technical writing
|
||||
Languages: Swedish (native), English (fluent)
|
||||
|
||||
|
|
@ -217,9 +206,8 @@ personal:
|
|||
Tajm.me: As a consultant, time tracking is a crucial part of every day work, and using bad time tracking software sucks. For 5 years, I scratched my own itch. Django, DRF and Web standards at its core. Several experimental client side solutions built with D3, React, Vue, Android, iOS and GTK+. (Archived, 2012–2017)
|
||||
"Baslyft, bärs & burgare": "My first Progressive Web App, with support to work fully offline once installed on a device. It's a simple app for logging reps, sets and PB's in the gym, with some nice tools built-in: 1RM calculator and KG-LBS converter. Touch-oriented design patterns, React, Redux, localStorage, ServiceWorker and other nifty Web API:s. (On hold, Sep 2019–)"
|
||||
Brütal Legend: A site to track progress of owning vinyl copies os songs licensed in an epic video game. Occasionally used as a real-world example to teach TypeScript, React and Redux concepts to collegues. (On hold)
|
||||
Tolk: Web-based launcher/prompt for all things wanted. Written in Elixir and Phoenix LiveView. (In progress)
|
||||
Smed: "A pluggable static site generator, inspired by Metalsmith. It built this page. (In progress)"
|
||||
|
||||
Utsökt: A simple bookmarking and read list service, with integration to RSS feeds, Pocket and Slack. Inspired by the old, more minimal version of Instapaper. Elixir, Phoenix LiveViews. (In progress)
|
||||
Smed: "A pluggable static site generator, inspired by Metalsmith. The goal is to replace my own sites in Metalsmith, and to learn Rust. (In progress)"
|
||||
courses:
|
||||
- ElixirConf EU, Warshawa (2020, postponed due to the Coronavirus pandemic)
|
||||
- Att leda utan att vara chef, Företagsakademin (2019)
|
||||
|
|
@ -234,8 +222,8 @@ courses:
|
|||
- Certificed Scrum Master Course, Crisp AB (2010)
|
||||
---
|
||||
|
||||
**Anders Englöf Ytterström**, Web Developer and Linux ethusiast with 20 years of passion. I strive to constantly come up with new ways of improving both products and processes for all participants in projects I am part of.
|
||||
**Anders Englöf Ytterström**, Web Developer with 16 years of passion. I strive to constantly come up with new ways of improving both products and processes for all participants in projects I am part of.
|
||||
|
||||
I prefer my coffee black, just like my metal.
|
||||
I prefer my coffee black, just like my metal, and preferably drip brewed by hand.
|
||||
|
||||
I also aim to be a [roadie, not a rockstar](https://www.linkedin.com/pulse/20140816105034-167544180-you-don-t-want-a-rock-star), as well as defending [boring tech](https://mcfunley.com/choose-boring-technology).
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue