Hi 👋!

I'm

Johan Stenehall

A web developer building things, currently for Einride creating their web.

  1. About
  2. Stats
  3. Skills
  4. Work
Johan Stenehall

Who am I?

My first experience with web development was just after christmas 1996. We got internet at home as an x-mas gift and so the story begins.
I convinced my mother to print a few pages of documentation, turned out to be maybe 100 A4s. Since then I've been doing web in some way. Now, 25 years later, I've been working as a professional web developer for about a decade and still love it.

During that period my life have also changed a lot. I've found a partner. We've traveled Japan. We've moved to Stockholm. We've had two kids. And so much more have happened.

During these years I've also climbed a lot, I've been drinking a lot of coffee, sometimes while playing Magic the Gathering or some board game.

Me, summarized in numbers.

  • 1 pair of climbing shoes
  • 2 children
  • 10+years of experience
  • 20years on irc
  • 24years online
  • 1488 github commits
  • 1825+ cups of coffee last year

Skills

Having worked as a full-stack / front-end developer for more than 10 years I've gathered a rather broad skillset. While I prefer front-end work I'm comfortable with back-end work as well.

Front-end

In my current job I code a lot of React and Vue written in modern typescript. But also a fair bit of elm. For styling, SCSS, styled-components, modular css or whatever fits the projects the best. To bake it all nicely Webpack, Babel, PostCSS and other nice tools are used. In the end it all results in HTML5, CSS3 and Javascript. I currently much prefer Jest for front-end testing. I'm comfortable with most ways of talking with a backend, from REST to graphql to gRPC.

Back-end

Lately I've preferred writing small node.js based backends, micro-services if you so will. But I've also worked with Ruby on Rails, PHP and even some Python and Java and lately even some Kotlin.

Servers

If I get to decide I like to ship it all as a docker image. Second best is to push it all to Heroku, Netlify or Vercel. I'm also comfortable setting up a Linux server but try to stay away from Windows.

Databases

I've worked in plenty of projects using both SQL (I know there's other sql dialecs as well but come on, My is the best name) and NoSQL databases. From designing database schemas to using and adopting existing. I've read about BCNF at university but used it to little to remember the exact definition.

Design

While I'm in no way a designer I'm comfortable in several design tools such as Sketch and Photoshop.

Tools

I'm one of those wannabe Vim users, but in all honesty I also use VS Code a lot. For code versioning I prefer Git.

I've worked with more web as well

bootstrap, circleci, codeigniter, coffeescript, drupal, express, firebase, gatsby, github, googlecloud, jQuery, kubernetes, mocha, mongodb, nextjs, nginx, tailwindcss, wordpress nuxtjs storybook

Work - What's Johan been doing?

Here's the last employeers I've had. Ranging from an agency to a small startup to a medium-sized rapidly expanding company. Working both with client and inhouse, from short-term to long-term projects.

Einride

At Einride I'm working on improving our users experiance.
  • Techy words:
  • Protobuf
  • Golang
  • React
  • Vite
  • GraphQL
  • Firebase
  • Cypress
  • Storybook

M

M is creating an entirely new service that gives people personal and dependable access to cars, on their terms. I'm helping create all the web for this, including the back-office and customer facing sites.
  • Techy words:
  • VueES
  • Node.js
  • Javascript
  • CSS/SCSS/LESS
  • Jest
  • GraphQL
  • Firebase
  • Kotlin
  • Elm

Daughter is born!

Second child born, it's a girl.

iZettle

–
For many years iZettle have been pionering payments for small buisnesses. Working as a web developer I get to code on iZettle Portal as well as our front end for our new Invoice service and of course our main site.
  • Techy words:
  • Ruby/Rails
  • ES6
  • Node.js
  • Javascript
  • CSS/SCSS/LESS
  • React
  • Redux
  • Mobx
  • Jest

Son is born!

First child born, it's a boy.

Narrative

–
This Linköping based startup were once the biggest thing on Kickstarter. Working as the lead (and in the end only) front-end developer. I was part of creating all web content. From the Narrative web app, to the main site, to the blog and support pages and much more.
  • Techy words:
  • PHP
  • Wordpress
  • Zendesk
  • Shopify
  • Javascript
  • ES6
  • React
  • AngularJS
  • jQuery
  • CSS/SCSS/LESS
  • Redux
  • Mocha
  • Node.js

Stockholm

Moving to Stockholm from Linköping

NOC

–
This Linköping based web agency have helped big and small companies for the past 10 years to realize their visions. I worked for them for 4 years and during that time I learnt lots. As a web developer I worked on project for big and small companies getting a deep understanding of the different challanges and perspective they face. Working mainly with PHP as a backend language, using Wordpress, Drupal, Kohana, Codeigniter and others. But also coding the front ends, html, javascript and css and all the normal frameworks for that.
  • Techy words:
  • PHP
  • Wordpress
  • Drupal
  • WooCommerce
  • Kohana
  • Codeigniter
  • Javascript
  • CSS/SCSS/LESS
  • jQuery
  • Ruby/Rails

What about the site then?

The dots in the background

If you're equally (or more?) nerdy in terms of html/css as I am, you might find it interesting to try and figure out how the dots for the `Who am I?` section is made. It might not be the way you first thought they were done.

And how was the rainbow effect done?

Do you know without looking how the rainbow effect on my name was done? It's not a super weird solution but a very nice css feature.

During these years I've also climbed a lot, I've been drinking a lot of coffee, sometimes while playing Magic the Gathering or some board game.

And the navigation?

You might also enjoy looking at how the animation for the navigation was done. It was actually a bit tricky to get it just right.

Did the logo change color?

And you did notice that the logo changed color based on what it has behind it?