SlideShare a Scribd company logo
From cruft to CRAFT
@nickdenardis #psuweb
@nickdenardis #psuweb
Nick DeNardis
Minimalist. UX crafter. Speaker. Realist. 

Computer scientist. Library scientist.
Wayne State University

Director of Digital Communications
TEDxDetroit, HighEdWeb MI, 

Laravel Detroit & Refresh Detroit

Organizer
Amateur hardwood floor refinisher
@nickdenardis #psuweb
Housekeeping
Slides online

speakerdeck.com/nickdenardis
Music online

8tracks.com/nickdenardis/psuweb-woodwork
Extra resources are available on the slides
This is being streamed/recorded
Show of hands…
@nickdenardis #psuweb
How did we produce all this
cruft in the first place?
@nickdenardis #psuweb
Simple
☐ Creating software is hard

☐ Lots of unknowns

☐ Client changes over time

☐ Changing technology

☐ Growing expectations

☐ Time constraints

☐ Money constraints

☐ Turnover/student workers

☐ Team moral

☐ Development environment

☐ Training
Developer
A developer executes. Their
talents often focused to a single
area. Without need for the “big
picture”.
Engineer
An engineer designs and plans.
Always aware of the “big
picture”. With talents in many
areas. An engineer can assume
the developer role. But an
engineer’s core focus lies with
architecture.
@nickdenardis #psuweb
Project management
contributed to this cruft…
What is quality code? From cruft to craft
@nickdenardis #psuweb
Resources
• https://www.getharvest.com/
@nickdenardis #psuweb
Turnover
produced all this cruft…
@nickdenardis #psuweb
Documentation
What is quality code? From cruft to craft
@nickdenardis #psuweb
Team knowledge
created all this cruft..
What is quality code? From cruft to craft
@nickdenardis #psuweb
Reading code
levels up everyone on the team
@nickdenardis #psuweb
Code reading 101
Pick a function/library/file < 50 lines of code. Set aside 2-3 minutes per line
Try to build and run it.
Don't focus on the details early.
Make sure you understand all the constructs.
Now that you've got a good idea about most of the constructs, it is time to
do a couple of random deep-dives.
There were undoubtedly things in the previous step you were confused
about, so this is the perfect time to go and read some tests.
No tests you say, sounds like the perfect time to write some.
@nickdenardis #psuweb
Our turn
@nickdenardis #psuweb
Resources
• http://devchat.tv/ruby-rogues/031-rr-code-reading
• http://www.codenewbie.org/podcast/ep-2-coding-like-a-boss-w-brian-douglas
• Reading code talk - https://www.youtube.com/watch?v=mW_xKGUKLpk
• http://bloggytoons.com/code-club
• http://www.slideshare.net/saronyitbarek/reading-code-good
• http://www.codewars.com/
• http://www.skorks.com/2010/05/why-i-love-reading-other-peoples-code-and-
you-should-too/
• http://www.readingcodegood.com/
@nickdenardis #psuweb
Code reviews
facilitate discussion around solutions
@nickdenardis #psuweb
Code Review
1. Knowledge transfer
2. Increased team awareness
3. Finding alternative solutions to problems
@nickdenardis #psuweb
What to review in a PR?
• Everyone brings something to the table
• Single responsibility principle
• Naming
• Tests should cover QA, it’s not a reviewer’s
responsibility
• “Leave a place better than you found it” ~ Girl Scouts
@nickdenardis #psuweb
Authoring a pull request
• Small atomic changes
• Should take at least 10 minutes
• Provide two paragraphs of context
• Only link to `Fixes #1337` as a command
What is quality code? From cruft to craft
What is quality code? From cruft to craft
@nickdenardis #psuweb
Reviewing a pull request
• Ask, don’t tell
• Negativity bias in written communication
• Foster a technical discussion
• Never use the word “just”
• Be positive
@nickdenardis #psuweb
Resources
• http://research.microsoft.com/pubs/180283/ICSE
%202013-codereview.pdf
• http://blog.codeclimate.com/blog/2013/10/09/
unexpected-outcomes-of-code-reviews/
• Does it need a +1? 

http://harvesthq.github.io/fias/
• Harvest code reviews

https://techtime.getharvest.com/blog/code-reviews-at-
harvest
@nickdenardis #psuweb
Refactoring
@nickdenardis #psuweb
SOLID Principles
Single Responsibility

a class should have only a single responsibility
Open/closed principle

should be open for extension, but closed for modification
Liskov substitution principle

objects in a program should be replaceable with instances of their subtypes
Interface segregation principle

many client-specific interfaces are better than one general-purpose interface.
Dependency inversion principle

Depend upon Abstractions. Do not depend upon concretions.
@nickdenardis #psuweb
One pass at a time
What is quality code? From cruft to craft
What is quality code? From cruft to craft
@nickdenardis #psuweb
Sandi Metz
• Your class can be no longer than 100 lines of code.
• Your methods can be no longer than five lines of code.
• You can pass no more than four parameters and you
can’t just make it one big hash.
• When a call comes into your (Rails) controller, you can
only instantiate one object to do whatever it is that
needs to be done. And your view can only know about
one instance variable.
@nickdenardis #psuweb
Resources
• Sandi Metz - Refactoring

https://www.youtube.com/watch?v=8bZh5LMaSmE
• Eye tracking original

https://www.youtube.com/watch?v=VtuO9un2Vyg
• Eye tracking refactor

https://www.youtube.com/watch?v=Jc8M9-LoEuo
• How big should a function be?

http://cleancoders.com/episode/clean-code-episode-3/show
• Rules for good software development - http://gist.io/4567190
@nickdenardis #psuweb
Style guides
because you don’t have to think about a default
What is quality code? From cruft to craft
What is quality code? From cruft to craft
What is quality code? From cruft to craft
@nickdenardis #psuweb
PSR-2 Standards Highlights
• Code MUST use 4 spaces for indenting, not tabs.
• Opening braces for classes MUST go on the next line, and
closing braces MUST go on the next line after the body.
• Opening braces for methods MUST go on the next line,
and closing braces MUST go on the next line after the
body.
• Opening parentheses for control structures MUST NOT
have a space after them, and closing parentheses for
control structures MUST NOT have a space before.
@nickdenardis #psuweb
Resources
• http://www.php-fig.org/psr/psr-2/
• https://en.wiktionary.org/wiki/bikeshedding
• http://www.nngroup.com/articles/the-power-of-defaults/
• http://blog.codinghorror.com/the-power-of-defaults/
• https://github.com/waynestate/web-guides
• https://github.com/bbatsov/ruby-style-guide
• https://www.drupal.org/coding-standards
• http://isobar-idev.github.io/code-standards/
@nickdenardis #psuweb
Your process
created all this cruft…
What is quality code? From cruft to craft
@nickdenardis #psuweb
Resources
• http://danielkummer.github.io/git-flow-cheatsheet/
• https://github.com/blog/2019-how-to-undo-almost-
anything-with-git
@nickdenardis #psuweb
Retrospectives
allow you to improve each week
What is quality code? From cruft to craft
What is quality code? From cruft to craft
What is quality code? From cruft to craft
@nickdenardis #psuweb
Weekly maintenance
is everyone’s job
What is quality code? From cruft to craft
@nickdenardis #psuweb
Automation
because ain’t no body got time to do it by hand
What is quality code? From cruft to craft
@nickdenardis #psuweb
Generators
What is quality code? From cruft to craft
@nickdenardis #psuweb
Resources
• http://vagrantup.com
• http://yeoman.io
• http://gulpjs.com
@nickdenardis #psuweb
Code formatting
@nickdenardis #psuweb
Editorconfig
# http://editorconfig.org
root = true
[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
[makefile]
indent_style = tab
composer global require fabpot/php-cs-fixer @stable
php-cs-fixer fix src/ --level="psr2" --dry-run -v --diff
PHP CS Fixer
Run it against your code
@nickdenardis #psuweb
Resources
• https://houndci.com/
• http://editorconfig.org/
• https://codeclimate.com/
• https://github.com/FriendsOfPHP/PHP-CS-Fixer
@nickdenardis #psuweb
GIT hooks
# pre-commit.sh
git stash -q --keep-index
./run_tests.sh
RESULT=$?
git stash pop -q
[ $RESULT -ne 0 ] && exit 1
exit 0
ln -s ../../pre-commit.sh .git/hooks/pre-commit
Symlink in your hooks
Stash before running
# ~/.bash_aliases
alias gc='git commit'
alias gcv='git commit --no-verify'
How to skip the hook
@nickdenardis #psuweb
Resources
• https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks
• http://githooks.com/
• https://www.digitalocean.com/community/tutorials/how-to-
use-git-hooks-to-automate-development-and-deployment-
tasks
• http://codeinthehole.com/writing/tips-for-using-a-git-pre-
commit-hook/
• https://github.com/codegram/pelusa
@nickdenardis #psuweb
Measuring results
in the real world
@nickdenardis #psuweb
Before…
@nickdenardis #psuweb
Growing pains.
@nickdenardis #psuweb
Now that’s about right
@nickdenardis #psuweb
Tiny habits
will bring your cruft to craft
@nickdenardis #psuweb
Kaizen
• Good processes bring good results
• Go see for yourself to grasp the current situation
• Speak with data, manage by facts
• Take action to contain and correct root causes of
problems
• Work as a team
• Kaizen is everybody’s business
@nickdenardis #psuweb
Resources
• http://www.kaizen.com/about-us/definition-of-
kaizen.html
@nickdenardis #psuweb
Thank you
@nickdenardis

More Related Content

PDF
Golden Rule for the Web - #eduGuruSummit
PDF
Producing a mobile presence. Timeline: Yesterday...
KEY
LeanStartup:Research is cheaper than development
PDF
Sharing is Caring - Web Development Resources
PDF
Iterative Website Redesign: Micro Goals in Action - CASEV 2011
PDF
Twitter Bootstrap, or why being a PHP Developer is a bad idea
PDF
Do The Work
KEY
Wwcode2
Golden Rule for the Web - #eduGuruSummit
Producing a mobile presence. Timeline: Yesterday...
LeanStartup:Research is cheaper than development
Sharing is Caring - Web Development Resources
Iterative Website Redesign: Micro Goals in Action - CASEV 2011
Twitter Bootstrap, or why being a PHP Developer is a bad idea
Do The Work
Wwcode2

Similar to What is quality code? From cruft to craft (20)

PDF
Achieving Technical Excellence in Your Software Teams - from Devternity
PDF
Technical Excellence Doesn't Just Happen--Igniting a Craftsmanship Culture
PPTX
Devops kc meetup_5_20_2013
PPTX
DevOps Columbus Meetup Kickoff - Infrastructure as Code
PPTX
Rapid and Responsive - UX to Prototype with Bootstrap
PDF
Rails in the Large - Neal Ford
PDF
Qcon beijing 2010
PDF
Magento 2 Performance: Every Second Counts
PPTX
Untangling spring week1
PPTX
Simple Ruby DSL Techniques: Big Project Impact!
PDF
So…What Do I Make? (Dan Mall)
PDF
ES3-2020-P2 Bowling Game Kata
PPTX
Best Practices for WordPress in Enterprise
PDF
Best practices-wordpress-enterprise
PDF
Monkeytalk Fall 2012 - Responsive Web Design
PPTX
Front end Tips Tricks & Tools
PPT
Let's unRiddle jsFiddle
PDF
Introduction to Contribution
PDF
The Seven Wastes of Software Development
PDF
Rowdy Rabouw - Unleash your web skills on native
Achieving Technical Excellence in Your Software Teams - from Devternity
Technical Excellence Doesn't Just Happen--Igniting a Craftsmanship Culture
Devops kc meetup_5_20_2013
DevOps Columbus Meetup Kickoff - Infrastructure as Code
Rapid and Responsive - UX to Prototype with Bootstrap
Rails in the Large - Neal Ford
Qcon beijing 2010
Magento 2 Performance: Every Second Counts
Untangling spring week1
Simple Ruby DSL Techniques: Big Project Impact!
So…What Do I Make? (Dan Mall)
ES3-2020-P2 Bowling Game Kata
Best Practices for WordPress in Enterprise
Best practices-wordpress-enterprise
Monkeytalk Fall 2012 - Responsive Web Design
Front end Tips Tricks & Tools
Let's unRiddle jsFiddle
Introduction to Contribution
The Seven Wastes of Software Development
Rowdy Rabouw - Unleash your web skills on native
Ad

More from Nick DeNardis (20)

PDF
How to be better at getting things done in 2022
PDF
Why #littlebigdetails Matter and What You Should Do About Them
PDF
CASE IV - Making that first impression online
PDF
Personal and Professional Social Media
PDF
Designing for next steps: A forward moving Web experience
PDF
Designing for next steps - A forward moving Web experience
PDF
API Reliability Guide
PDF
Creating an Effective Mobile API
PDF
Iterative Website Redesign - Micro Goals in Action
PDF
Give Your Content Legs and Run With It - PSUWEB11
KEY
Social Media Tools for Startups
PDF
LIS7470 - Information Architecture
PDF
Flexible Web Branding, the Case Against Single Web Templates - CASEV 2010
PDF
Better Design Through Analytics - #eduiconf 2010
PDF
Web Metrics: An Overview - #eduiconf 2010
PDF
Analyzing Real-time User Visitor Searches
PDF
Realigning your Web Redesign Process
PPT
State of the Wayne State Web Site
PDF
Starting a Web Office From Scratch: Trials and Tales
KEY
MIUPA - Focus on Your Users
How to be better at getting things done in 2022
Why #littlebigdetails Matter and What You Should Do About Them
CASE IV - Making that first impression online
Personal and Professional Social Media
Designing for next steps: A forward moving Web experience
Designing for next steps - A forward moving Web experience
API Reliability Guide
Creating an Effective Mobile API
Iterative Website Redesign - Micro Goals in Action
Give Your Content Legs and Run With It - PSUWEB11
Social Media Tools for Startups
LIS7470 - Information Architecture
Flexible Web Branding, the Case Against Single Web Templates - CASEV 2010
Better Design Through Analytics - #eduiconf 2010
Web Metrics: An Overview - #eduiconf 2010
Analyzing Real-time User Visitor Searches
Realigning your Web Redesign Process
State of the Wayne State Web Site
Starting a Web Office From Scratch: Trials and Tales
MIUPA - Focus on Your Users
Ad

Recently uploaded (20)

PDF
BÀI TẬP BỔ TRỢ 4 KỸ NĂNG TIẾNG ANH 9 GLOBAL SUCCESS - CẢ NĂM - BÁM SÁT FORM Đ...
PDF
2.FourierTransform-ShortQuestionswithAnswers.pdf
PPTX
master seminar digital applications in india
PDF
FourierSeries-QuestionsWithAnswers(Part-A).pdf
PDF
O5-L3 Freight Transport Ops (International) V1.pdf
PDF
VCE English Exam - Section C Student Revision Booklet
PDF
grade 11-chemistry_fetena_net_5883.pdf teacher guide for all student
PPTX
Introduction_to_Human_Anatomy_and_Physiology_for_B.Pharm.pptx
PDF
Abdominal Access Techniques with Prof. Dr. R K Mishra
PDF
Classroom Observation Tools for Teachers
PDF
102 student loan defaulters named and shamed – Is someone you know on the list?
PPTX
Microbial diseases, their pathogenesis and prophylaxis
PPTX
Pharmacology of Heart Failure /Pharmacotherapy of CHF
PDF
Saundersa Comprehensive Review for the NCLEX-RN Examination.pdf
PDF
Physiotherapy_for_Respiratory_and_Cardiac_Problems WEBBER.pdf
PDF
TR - Agricultural Crops Production NC III.pdf
PDF
Insiders guide to clinical Medicine.pdf
PDF
Anesthesia in Laparoscopic Surgery in India
PDF
STATICS OF THE RIGID BODIES Hibbelers.pdf
PDF
Microbial disease of the cardiovascular and lymphatic systems
BÀI TẬP BỔ TRỢ 4 KỸ NĂNG TIẾNG ANH 9 GLOBAL SUCCESS - CẢ NĂM - BÁM SÁT FORM Đ...
2.FourierTransform-ShortQuestionswithAnswers.pdf
master seminar digital applications in india
FourierSeries-QuestionsWithAnswers(Part-A).pdf
O5-L3 Freight Transport Ops (International) V1.pdf
VCE English Exam - Section C Student Revision Booklet
grade 11-chemistry_fetena_net_5883.pdf teacher guide for all student
Introduction_to_Human_Anatomy_and_Physiology_for_B.Pharm.pptx
Abdominal Access Techniques with Prof. Dr. R K Mishra
Classroom Observation Tools for Teachers
102 student loan defaulters named and shamed – Is someone you know on the list?
Microbial diseases, their pathogenesis and prophylaxis
Pharmacology of Heart Failure /Pharmacotherapy of CHF
Saundersa Comprehensive Review for the NCLEX-RN Examination.pdf
Physiotherapy_for_Respiratory_and_Cardiac_Problems WEBBER.pdf
TR - Agricultural Crops Production NC III.pdf
Insiders guide to clinical Medicine.pdf
Anesthesia in Laparoscopic Surgery in India
STATICS OF THE RIGID BODIES Hibbelers.pdf
Microbial disease of the cardiovascular and lymphatic systems

What is quality code? From cruft to craft