Confessions of an Apprehensive Technical Director

Slide 1

Slide 1 text

Confessions OF AN APPREHENSIVE TECHNICAL DIRECTOR

Slide 2

Slide 2 text

About me

Slide 3

Slide 3 text

3 London

Slide 4

Slide 4 text

4 New Jersey

Slide 5

Slide 5 text

5 Rock ’n’ Roll

Slide 6

Slide 6 text

6 Nashville

Slide 7

Slide 7 text

7 More Rock ’N’ Roll

Slide 8

Slide 8 text

8 Seattle, WA

Slide 9

Slide 9 text

9 Youngsters

Slide 10

Slide 10 text

10 Professor Fordham

Slide 11

Slide 11 text

11 MATT FORDHAM PARTNER & TECHNICAL DIRECTOR WWW.WINTR.US / @MATTFORDHAM

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

The challenges of a team 13 • Quality assurance • Code consistency and duplication • Collective code/project ownership • New hire ramp-up time • Ongoing project maintenance • Professional development • Multiple simultaneous projects • Who’s doing what? • etc, etc Overall team efficiency and happiness

Slide 14

Slide 14 text

✴ Documentation and resources ✴ Workflow ✴ System configuration ✴ Project configuration ✴ People 14

Slide 15

Slide 15 text

Documentation and Resources

Slide 16

Slide 16 text

Master dev process document Write everything down. ! 16

Slide 17

Slide 17 text

Code styleguide • Routinely maintained and version-controlled. • Include all necessary languages. • Include comments and todos. • Create a shared snippet library for your text editor(s). 17

Slide 18

Slide 18 text

Project templates • Routinely maintained and version-controlled. • Begin each project by updating the template. • Include descriptive README. 18

Slide 19

Slide 19 text

Front-end scaffold • For CSS and JS. • Routinely maintained and version-controlled. • For use in projects of all types. • Can be included in Project Templates as sub-module. 19

Slide 20

Slide 20 text

Workflow

Slide 21

Slide 21 text

Agile / backlog • Prioritized user story backlog. • Work on stories of highest value first. 21

Slide 22

Slide 22 text

Agile / backlog • Clearly defined acceptance criteria. • Done is done. Tested. Deployed. 22

Slide 23

Slide 23 text

Agile / meetings • Daily stand-ups. What are you working on? What is blocking you? • Weekly retrospectives. What went well? What could be improved? 23

Slide 24

Slide 24 text

Comment-driven development 24 • Write comments before writing code. • Leads to well-documented and more thoughtful code.

Slide 25

Slide 25 text

Test-driven development 25 • Write tests before writing code. • Leads to maintainable, well- documented and more thoughtful code. • For front-end and back-end. • Consider starting with integration tests for end-to-end testing. • It’s fun… really! ! ! ! ! !

Slide 26

Slide 26 text

Code reviews • Peer and/or director reviews. • User story not done until reviewed • Encourages collaboration. • Ensures code style consistency. • Provides opportunity for professional development. • Promotes greater test and comment coverage. • Promotes shared ownership of code. 26

Slide 27

Slide 27 text

System Configuration

Slide 28

Slide 28 text

Dotfiles • Routinely maintained and version- controlled. • Repo of bash scripts cloned onto new machines to aid in quick setup. ! • Automatically install applications, languages, frameworks, etc (Homebrew, Ruby, Node, PHP, etc). • Setup company-specific shell aliases (repos, IP addresses), create and upload SSH keys, cronjobs, etc. • Install code snippets and text editor configs. ! 28

Slide 29

Slide 29 text

Project Setup

Slide 30

Slide 30 text

Project README • Contains general instructions on getting the project up and running. • Contains list of all dependencies. • Contains list of original developers. • Lives in the project repo • Usually written in Markdown for Github/ Beanstalk readability. ! 30

Slide 31

Slide 31 text

CSS Styleguide • Built before any other pages. • Basic HTML elements are styled first, followed by any repeatable modular blocks. • Ensures CSS classes are premeditated • Keeps duplication to a minimum. • Allows multiple developers to build out pages. 31

Slide 32

Slide 32 text

Project install script • Usually a Shell or Ruby script. • Check system dependencies (Ruby version, Node version, ImageMagick, etc) • Install project dependencies (via Ruby Bundler, NPM, Bower, etc) • Set file permissions • Run migrations or import latest database dump • Create virtual host ! 32

Slide 33

Slide 33 text

Front-end compilation • SASS and Coffeescript (and similar), can greatly improve a team’s workflow. • Cleaner syntax and more modular code. • When working with a team avoid desktop tools, such as CodeKit. • Compile from the command-line. Grunt, Gulp, Guard, etc. • Compilation can also include file concatenation, minification, and c0de-linting. ! ! ! 33

Slide 34

Slide 34 text

Dependency management • All project dependencies should be managed, if possible. • Bundler for managing Ruby Gems • NPM for managing Node Packages • Bower for managing front-end libraries • Using these tools, all dependencies can be install with a single command. 34

Slide 35

Slide 35 text

Automated deployment • Under normal circumstances, all team members have access to deploy to staging, and probably production. • Deploying should should be an easy task, as should be rolling back to a previous version. • Option 1: Deploy via Git push • Option 2: Deploy via Capistrano • Additional automated tasks: • Upload/download images to/from server • Import database from production • Setup automated backups 35

Slide 36

Slide 36 text

People

Slide 37

Slide 37 text

Who to hire? • Developers who love to collaborate, love to code, and love doing “whatever” to bring good ideas to life. • We prefer people who see themselves as “web developers” or “interactive developers”. Not… - “front-end developers” - “back-end developers” - “Rails (or whatever) developers” - etc, etc 37

Slide 38

Slide 38 text

Continuous improvement • Quarterly goal setting and reviews • Weekly team presentations • Weekly project retrospectives • Professional development budget ! ! 38

Slide 39

Slide 39 text

Communication • Flexible and rotating seating • Face-to-face, away from desks • HipChat, Campfire, etc ! 39