Readers/Web/Team/Dev sessions

On Jan 29, 2015, the mobile web team met to share development workflows, tools we use, extensions, and in general how we work, in order to learn more about different ways of working with the code, patch sets, bug triaging, etc.

We plan on having this meeting monthly, and to re-cap here what we talk about so that there is a searchable log of the goodies we share and benefit community developers by having this information public.

Tools and workflows

Working with Gerrit

Gerrit from the command line: GerritCommandLine
- Filter by projects, your patches, by score (Example config for .bashrc)
- Choose a patch by number, it will download the patch, switch to it, and show the gerrit website link to it.
- Getting the script:
  - Run make remotes on extensions/MobileFrontend to get the script into dev-scripts/remotes/gerrit.py
  - Set GERRIT_USERNAME (export GERRIT_USERNAME=JohnDoe)
  - Run it with make gerrit, make mygerrit, or directly from ./dev-scripts/remotes/gerrit.py
Chrome Gerrit website extension: gerrit-be-nice-to-me
- Colorizes -1/-2 rows on the patches list in red
- Auto expands patchsets when on a patch page (useful for seeing where comments are, and immediately having access to the patchsets)
- Auto expands comments when on a patch page
Gerrit emails
- Watch the projects you care (Settings -> Watched projects)
  - Tag gerrit emails, useful if you want to know if somebody replied to your patches
  - User filters to subtag "your patches", "merged", "abandoned". Easier to skim through all those emails.
Gerrit website
- When looking at a patch list, bold means that there are new changes on the patch (that you haven't seen).

Working with Phabricator

Make phabricator styles your own with a custom stylesheet
- Stylish for firefox
- Stylish / Stylebot for chrome
- Example stylish css: https://gist.github.com/joakin/ab62dd6e3e90712a14bd
Workflow
- Email driven
  - Tag phabricator emails, drive most of the interaction via email (can reply to comments, make actions, etc). No workboard stuff sadly.

Command line tools

Git
- Show info on bash prompt about the current repo
  - Show branch and state with colors (.profile)
  - Branch, state, and current operation (rebase, cherry-pick, etc) (.bash_prompt)
- tig: Command line git UI Screenshots
- Clean messy gerrit branches and already merged
- Search for the commit that broke something: git bisect
Ag (silver searcher): Fast code search
- ag regex Search with regex
- ag -Q "not<regex>" Search literally
- ag "ion parse" --js Search for the function parse in javascript files
- ag --list-file-types See supported file types for the --type flag
Bash config (See dotfiles below)

Populating wiki with test data
- Populate a list of categories on MobileFrontend - run this in your console
Tmux
- Terminal multiplexer, can keep multiple long lived terminal sessions, splits, tabs
- Beautiful status line: Tmux line
fasd
- Adds commands for easy access to files/folders

Dealing with email

Subscribe to multiple email lists (mobile-l, wiktech-l, ...), gerrit, phab, etc
Aggressively use filters and labels/tags to categorize email and read it when you want.
subject:Welcome list:"<wmfall.lists.wikimedia.org>" -> Mark as read
Use Gmail's "Mute" feature to silence useless threads (sometimes threads come back from the dead? time for a filter)

Dotfiles

Joaquin dotfiles repo
- MediaWiki related environment variables and aliases
- Git aliases
  - Copy what interests you into your ~/.gitconfig
    - Colors in git
    - Using vim as git's diff/editor
    - Aliases (git ls, git dc, git pp, etc)
- .vim config

Editors

PhpStorm
- Complete php and web IDE with refactoring tools and good completion
- Open source license available for employees and probably contributors
- Plugins
  - IdeaVim: Vim bindings
  - Puppet plugin
- Add the whole vagrant folder as a project to get settings and whole project completion
Vim
- Vundle for managing plugins
- Neocomplete or YouCompleteMe for auto completion (or ctrl_x+ctrl_o)
- Syntastic syntax checking on the editor
  - Install with npm globally jshint and jscs or add ./node_modules/.bin to path to get good syntax checking
- Ag.vim for code searching on the project
- Less syntax files: groenewege/vim-less
- Better php syntax and completion: StanAngeloff/php.vim
- Tern.vim for javascript completion
- luochen1990/rainbow for rainbow parens
- scrooloose nerdcommenter for \cc \uc to comment/uncomment most file types
- tpope/vim-surround to add/modify surrounding brackets, quotes, etc.

MediaWiki

Populate dev instance with data
- MobileFrontend specific
  - Populate a list of categories on MobileFrontend - run this in your console
Log files in vagrant server
- vagrant ssh and then ls /vagrant/logs/
Testing that event logging works properly on the server
- tail -f /vagrant/logs/eventlogging.log
- cd mediawiki/extensions/EventLogging && python setup.py install

Personal tools

Todos/GTD/lists
- Trello
- Wunderlist
- Google tasks
- Email
- tiddlywiki.com
Dev diary
- Basic repo with markdown files to keep a diary. Example: https://github.com/phuedx/DEVLOG
- Personal wiki tiddlywiki.com
Streaming / recording video
- OBS (free capturing software)
- Sites
  - Twitch
  - Youtube

Learning & documentation

Learning to use extensions
- Usually end up reading code to find what to use.
- Dev documentation is scarce and sometimes bad.
  - Bring attention to the technical writer (S Page).
  - Edit and DIY
    - Improve it and raise patch, it's our responsability.
  - -1 patches that lack documentation.