Matita Thoughts and experiments

Head of Frontend Development

The time has come.
That dreadful time that marked the end of coding in my career.
I am now the the Head of Frontend Development.

What does it mean?

I still have to figure it out completely, for sure it means much more things to do, most of them not code related.

Mostly dealing with people, making sure they are motivated and focused on the right things, and ensuring the quality of the products is always high.

Am I ready?

Yes.
If I wasn’t my employers wouldn’t have promoted me.
Furthermore, it’s quite some months that I’m doing kinda the same job, only the name of the position is changed.

Ok, but am I actually ready?

Weeeeell…
The impostor sindrome is behind the corner and I’m definitely out of my comfort zone.
I thought it was just a change of name, but the duties were kinda the same. And probably it’s true, but the label itself put a lot of pressure on me, even unconsciously.
For sure there are still a lot of things that I have to learn, but I’m taking it as a new challenge, probably the biggest challenge since a while.

I know for a fact that I’m still making mistakes, but I need to understand what are my weaknesses and how to address them.

  • Prioritize tasks: as said there are a lot of things to do, also I have a bunch of old tasks that have been piled because of urgencies and those have to be dequeued too. I surely need to understand how many things I have to do and be able to pick the right thing to do at the right time.
  • Delegate: from now on (actually it’s been like this for quite some time) I won’t be able to code as much as I’d like, this means that I’ll have to tell other people what to do and how, also about topics that have been my sole responsibility so far, like deployment scripts.
  • Mind my own business: when someone asks anything I’ve always tried to be the one that answers, even when it’s a question with no direct addressee. I have to learn to wait for others to answer, mostly if I have other things to do (which always happens). Unless I’m the one mentioned, but even then it’s better to redirect the question to someone else that might be able to answer: more time for me, more responsibility (with a possible side effect of more motivation) to others, two birds with one stone.
  • Study, a lot: this is almost a new field to me, at least with this perspective and scale, for sure my next readings won’t be about code anymore, at least not only about code, but about team management and leadership.
  • Accept criticisms: luckily I’m already prepared on this, I’m rarely offended and always willing to improve myself, but I have to be ready to hear a lot more criticisms because I’ll surely do a lot of mistakes. The key is not giving up, understand which was the mistake and how to avoid it next time, and not feeling like a complete failure.
  • Be listening but firm: I have to learn to be more authoritative, but without letting people down.
  • Be in my place: I still need to find my place, but for sure there are things that are totally outside of my scope. Being the Head of Development doesn’t mean that I can do whatever I want, I still have duties, tasks and directions that are not decided by me. If I have ideas I have to find the right time and way to tell them.

Conclusions

This is already a lot to work on, I hope to be able to master all of them as soon as possible, even though for sure there will be many more points to add in the list of things to improve.

Link to create events on Google Calendar

This is something I periodically search for, so I decided to finally write it down somewhere.

Is there a way to construct a link that opens a prefilled Google Calendar form to create an event?
Yes, there is.

And that’s it:

https://www.google.com/calendar/render?
  action=TEMPLATE&
  text=Your+Event+Name&
  dates=20140127T224000Z/20140320T221500Z&
  details=For+details,+link+here:+http://www.example.com&
  location=Waldorf+Astoria,+301+Park+Ave+,+New+York,+NY+10022&
  sf=true&
  output=xml

Try it!

As per 2018/11/21 this URL is redirected to:

https://calendar.google.com/calendar/r/eventedit?
  text=Your+Event+Name&
  dates=20140127T224000Z/20140320T221500Z&
  details=For+details,+link+here:+http://www.example.com
  &location=Waldorf+Astoria,+301+Park+Ave+,+New+York,+NY+10022&
  sf=true&
  output=xml

Try it!

Instructions obviously found on Stack Overflow

Jekyll errors for GitHub Pages update to Jekyll 3.0

Quite recently GitHub Pages updated to Jekyll 3.0. As every migration it could bring to some issues, so here are my findings for a project that I’m working on.

Since it is not a basic blog but a bit more complex project, I suspect I will find some more issues. I’m writing those as soon as I’ll find them.

I started to acknowledge it before the announcement since some warning about the compatibility with Jekyll 3.0 of relative_permalinks configuration in _config.yml.

This was easy: I just removed the relative_permalinks clause in the config file and the problem disappeared.

2. Missing dependency: kramdown

But, after the announcement, I couldn’t build anymore the site for a project I am working on, so I git pulled, updated my local project dependencies with gem update github-pages and tried to jekyll serve.

It gave me an error of missing dependency: kramdown, so I asked Google how should I resolve this and it told me to gem install kramdown or add gem 'kramdown' to the Gemfile. This didn’t work for me.

After some other searches I found the solution in this post from Tom Elliot. Basically now I just have a Gemfile made like this:

source 'https://rubygems.org'
gem 'github-pages'

and running

bundle clean --force
bundle install

resolved my issue.

3. Stack level too deep exception

I thought it was all good! But I was wrong…

When I ran jekyll serve it gave me a stack level too deep exception in _layout/post.html.

Again Google gave me some hint by pointing me at an issue on Jekyll GitHub repository.

I searched for all the occurences of jsonify in my templates and I found I was using var post = {{ page | jsonify }};.

I tried to replace it with var post = {{ page }}; and so I could jekyll serve without errors.

Unfortunately this would not work for me since the output of {{ page }} is obviously not a valid json, so I had to replace that row in my template with this:

var post = {
	title   : {{ page.title | jsonify }},
    path    : {{ page.path | jsonify }},
    content : {{ page.content | jsonify }}
};

I don’t like this solution very much, but it works for now since currently I only need these properties for the rendered post. If I’ll come up with a better solution I’ll write about this.

4. Jekyll-paginate plugin

Another error that popped up was:

Deprecation: You appear to have pagination turned on, but you haven't included the `jekyll-paginate` gem. Ensure you have `gems: [jekyll-paginate]` in your configuration file.

I just had to add to _config.yml these lines:

gems:
  - jekyll-paginate

Install Jekyll for GitHub Pages on Windows

Recently I needed to install Jekyll on my Windows computer, mostly for a project I’m working on using GitHub Pages.
It was not necessary, but testing the development locally is always better and faster than editing some file, git add-git commit-git push and wait for GitHub Pages to render the website.

It seems like installing Jekyll on Windows is not that easy, but following Nathan Totten’s instructions it turned out to be very simple.

I needed it specifically to be compatible with GitHub Pages and my first try at following the instructions were not (currently the latest version of Jekyll is 3.0.1 and GitHub Pages Jekyll is 2.4.0, as seen in GitHub Pages dependencies page).

So here are the few steps I made:

1. Install Ruby

Go to Ruby downloads page, download the desired installer under “Rubyinstallers” section (mine was Ruby 2.2.3 x64) and execute it, remembering to check the options:

  • Install Tcl/Tk support
  • Add Ruby executables to your PATH
  • Associate .rb and .rbw files with this Ruby installation

2. Install the Development Kit

In the same Ruby downloads page download the right Development Kit under the section “Other Useful Downloads / Development Kit” (mine was For use with Ruby 2.0 and above (x64 - 64bits only)), execute it and extract it in a folder (for me C:\DevKit).

Open a command line in C:\DevKit (or where you extracted the Development Kit) and execute the commands:

ruby dk.rb init
ruby dk.rb install

The first time I executed the install command it gave me the error Invalid configuration or no Rubies listed. Please fix 'config.yml' and rerun 'ruby dk.rb install', so I edited C:\DevKit\config.yml by putting the folder where I had installed Ruby, so the file is now like this (excluding the comments):

---
- C:/Ruby22-x64

and reran ruby dk.rb install.

3. Install Jekyll for GitHub Pages

As I said earlier the Jekyll version has to be compatible with GitHub Pages’ Jekyll, and GitHub made a proper Ruby gem with all the dependencies needed, like they say in their page about Using Jekyll with Pages.

I first tried the Bundler approach but it gave me some error, so I created a file named Gemfile in the root directory of the repository I needed with this content:

source 'https://rubygems.org'
gem 'github-pages'

Then run gem install github-pages in the command line and the correct Jekyll version with all its dependencies is installed.

4. Ignore unnecessary files in .gitignore

To avoid unnecessary file exchange when pushing or pulling from git, edit the .gitignore file in the root directory of your repository by appending these lines:

Gemfile
_site

The _site folder is where Jekyll outputs the rendered files, it is unnecessary (maybe dangerous?) to have git sync that folder with GitHub since GitHub Pages renders the site itself.

5. You’re ready to go!

Just open a command line in the root folder of your repository and run jekyll serve: Jekyll will build the website and will serve it on a light web server at http://localhost:4000/name-of-repository/. It will also watch for any change in your files and rebuild it without the need of stop/rerun the jekyll serve command.

Go to JIRA bookmarklet

Premise: I love bookmarklets. They allow to execute a piece of code even without a browser plugin installed. You as a user have complete control on when to execute the code, not like the browser plugins that could execute code for every single page you visit. You don’t have to install them, just drag’n’drop to the bookmarks bar, or delete them whenever you want.

This to say that every time I need a feature for the browser that’s not built-in, I always try to make a bookmarklet and see what I can do to make my daily work better.

This time I had this problem: in the company where I work we use JIRA as a bug tracker. Actually we use more than one on different servers/domains/locations since we have partners that use their own JIRA installation. It’s not unusual to send or receive emails with the ID of the JIRA issue (e.g. PROJ-662) but without a link, and it’s always a pain to remember which JIRA server the projects relates to, point the browser to that page, then search the issue number (I know it’s not that difficult, but I’m a developer: I’m lazy).

What I really wanted was to select the issue ID and click something that redirected me directly to the correct URL. Guess what? Yeah, I made a bookmarklet to do exactly this.

You can find it here.

Just fill the form with the projects short names (the first part of an issue ID) and the URL of where the related JIRA installation is, then drag the the bookmarklet on your bookmarks bar and you’re done!

Don’t worry, it’s everything client side and I won’t track your super secret JIRA locations. If you don’t trust me you can see it by yourself in the source code on GitHub.

When you select an issue ID and click on the bookmarklet you’re automagically redirected to the correct JIRA page.

If you click the bookmarklet with nothing selected you are prompted to insert the issue ID you want to view.

The first project defined is also the default one, i.e. the implicit project if you just put the digits of the ID (e.g. 662 instead of PROJ-662).

Pro tip: when you add the projects in the customization form the current URL auto-updates, so you can share your configuration with your colleagues by directing them to the same URL.