SlideShare a Scribd company logo
SINGLE PAGE APP
DESIGN WITH
ANGULERJS
THE WORLD AIN’T WHAT IT USED TO BE…
Copyright © 2015, Stacey Vetzal
Copyright © 2015, Stacey Vetzal
STACEY VETZAL
• Founder of Mojility Inc.
• First computer, age 10
• hardware and software hacker for 35 years
• Frustrated and embarrassed with the state of software
development in the industry
• I am platform, language, and technology agnostic
• I have strong opinions, but they are loosely held
Copyright © 2015, Stacey Vetzal
HACKER
IETF RFC 1392
hacker (n):
A person who delights in having an intimate
understanding of the internal workings of a system,
computers and computer networks in particular.
The term is often misused in a pejorative context,
where "cracker" would be the correct term.
Copyright © 2015, Stacey Vetzal
CRAFTSMAN
I owe much of who I am to my father.
When I was a child, I would go to my
father with simple projects, and I would
watch him build them, usually of wood,
but sometimes other materials. He is an
incredible craftsman, brings beauty out of
the mundane and gives it a purpose. I
strive to honour that in my own craft,
which is software development. It is a long
road, but I believe worthwhile, as where
wood used to touch every aspect of our
lives in eras past, now there is software.
Copyright © 2015, Stacey Vetzal
TODAY
Today we are better than yesterday, but not as
good as we will be tomorrow.
Today our tools are better than they were
yesterday, but not as good as they will be
tomorrow.
We build software today.
Copyright © 2015, Stacey Vetzal
http://chimera.labs.oreilly.com/books/1234000001813/index.html
Copyright © 2015, Stacey Vetzal
THE WHITE BELT
• … You are walking comfortably on a plateau of
competence. Your colleagues recognize your
abilities and call on you to help them solve
problems in your area of expertise. You have pride
in your skills.
• … it seems somehow harder than it was before to
acquire new skills… You fear that your personal
development may have stalled.
Copyright © 2015, Stacey Vetzal
- Yoda, The Empire Strikes Back
“You must unlearn what
you have learned.”
THE WHITE BELT
Copyright © 2015, Stacey Vetzal
var i=require(“information”);
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN
• Tests pass
• Express Intent
• Don’t Repeat Yourself
• Small
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
TESTS PASS
“Code without tests is bad
code. It doesn’t matter how
well written it is; it doesn’t
matter how pretty or object-
oriented or well-encapsulated
it is. With tests, we can change
the behaviour of our code
quickly and verifiably.”
- Michael C. Feathers, Working
Effectively with Legacy Code
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
TESTS PASS
• What kinds of tests do you do?
• Exploratory?
• Story or script driven?
• Automated?
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
EXPRESSES INTENT
The Principle of Least Astonishment
“The result of performing
some operation should be
obvious, consistent, and
predictable, based upon the
name of the operation and
other clues.”
-Ward Cunningham, from c2
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
EXPRESSES INTENT
• There are two hard things in computer science
• Cache invalidation
• Naming things
• Off-by-one errors
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
DON’T REPEAT YOURSELF
“…every piece of system
knowledge should have one
authoritative, unambiguous
representation… A system’s
knowledge is far broader than just
its code… database schemas, test
plans, the build system, even
documentation.”
- Dave Thomas, co-author of The
Pragmatic Programmer on
Orthogonality and the DRY
Principle.
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
DON’T REPEAT YOURSELF
The Single Responsibility Principle
“A class should only have one
reason to change.”
“Responsibilities have profound
long-term effects on the
maintainability and flexibility of
software.”
- Robert C. Martin, author Clean
Code, Principles of Object
Oriented Design
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
SMALL
- Mark Twain
“I didn’t have
time to write a
short letter, so I
wrote a long
one instead.”
Copyright © 2015, Stacey Vetzal
4 RULES OF SIMPLE DESIGN:
SMALL
• What does SMALL mean?
• Lines of code?
• Classes?
• Functions?
• # of function call arguments?
• How do you MEASURE it?
Copyright © 2015, Stacey Vetzal
using MoreInformation;
COHESION AND COUPLING
Copyright © 2015, Stacey Vetzal
COHESION AND COUPLING
Copyright © 2015, Stacey Vetzal
COHESION AND COUPLING
Copyright © 2015, Stacey Vetzal
COHESION AND COUPLING
Copyright © 2015, Stacey Vetzal
COHESION AND COUPLING
Copyright © 2015, Stacey Vetzal
COHESION AND COUPLING
Copyright © 2015, Stacey Vetzal
Copyright © 2015, Stacey Vetzal
require(“all-please.php”);
Copyright © 2015, Stacey Vetzal
THE BIRTH AND DEATH OF
JAVASCRIPT
• Gary Bernhardt, Destroy
All Software
• https://
www.destroyallsoftware.com/
talks/the-birth-and-death-of-
javascript
• If you have any concerns
about the legitimacy of
JavaScript as a
programming language
Copyright © 2015, Stacey Vetzal
THE BIRTH AND DEATH OF
JAVASCRIPT
• JavaScript: The Good Parts by Douglas Crockford, 2008
• Generally considered the book that kicked off the JS
legitimacy movement
• Node.JS, 2009
• Today a very strong foundation of intelligence and
maturity working in communities using JavaScript
• JavaScript Jabber, DevChat.tv, excellent weekly podcast,
currently at episode 154
Copyright © 2015, Stacey Vetzal
(defun load-information ()
(load “information.cl”))
Copyright © 2015, Stacey Vetzal
BREAKING APART WEB
APPLICATIONS
• MVC? WTF?
• Most of what you’ve been told are MVC
frameworks are considered Model2 frameworks
• Still stemming from classic JSP, ASP and PHP
architectures
• MVC is really not that informative about good app
architecture.
Copyright © 2015, Stacey Vetzal
WHY ANGULARJS?
• Why not?
• Tons of attention, and a tiny little backer called
Google
• Provides good flexibility on how you assemble the
browser-side of your apps
• Promotes modular design, and supports good
testing practices
Copyright © 2015, Stacey Vetzal
TRY IT YOURSELF
• The free Google sponsored course on CodeSchool
is a bit slow and corny for experienced
developers, but gives you an effective and concise
introduction to the core of the framework.
• http://campus.codeschool.com/courses/shaping-
up-with-angular-js/intro
Copyright © 2015, Stacey Vetzal
LET’S CODE!

More Related Content

PDF
Long-term Impact of Log4J
PDF
Application Security Testing for a DevOps Mindset
PPTX
Embracing OSS in the enterprise
PDF
Intro to Yo
PPTX
Beyond the 5 minute install
PDF
Continuous delivery a happier, safer alternative to release trains
PDF
SDLC & DevSecOps
PDF
Microservices Workshop - Craft Conference
Long-term Impact of Log4J
Application Security Testing for a DevOps Mindset
Embracing OSS in the enterprise
Intro to Yo
Beyond the 5 minute install
Continuous delivery a happier, safer alternative to release trains
SDLC & DevSecOps
Microservices Workshop - Craft Conference

What's hot (11)

PDF
How Spotify Builds Products (Organization. Architecture, Autonomy, Accountabi...
PPT
How to engage students in real open source projects
PDF
Making operations visible - devopsdays tokyo 2013
PPTX
Don't get blamed for your choices - Techorama 2019
PDF
From dev to ops and beyond - getting it done
PDF
[HCMC STC Jan 2015] Developing an Offshore Context-Driven Testing Team
PDF
What schools should be teaching IT students
PDF
Continuous Delivery: Rapid and Reliable Releases with DevOps Practices
PPTX
Hacking101 delhi 2013
PDF
No more excuses left - let's build great things - Christian Heilmann - Codemo...
PDF
Better Software Through User Research
How Spotify Builds Products (Organization. Architecture, Autonomy, Accountabi...
How to engage students in real open source projects
Making operations visible - devopsdays tokyo 2013
Don't get blamed for your choices - Techorama 2019
From dev to ops and beyond - getting it done
[HCMC STC Jan 2015] Developing an Offshore Context-Driven Testing Team
What schools should be teaching IT students
Continuous Delivery: Rapid and Reliable Releases with DevOps Practices
Hacking101 delhi 2013
No more excuses left - let's build great things - Christian Heilmann - Codemo...
Better Software Through User Research
Ad

Similar to VS Single Page App Design with AngularJS (20)

PDF
Clean Code V2
PDF
Programming for Non-Programmers - SXSW Vegas 2014
PDF
Programming for Non-programmers PFNP @ Razorfish
PPTX
Design principles in a nutshell
PPTX
Design principles in a nutshell
PPT
Best practices for agile design
PDF
Old Code, New Tricks
PPT
Thoughtful Software Design
PDF
The Art Of Design
PDF
Excavating the knowledge of our ancestors
PDF
Cracking the Interview Skills (Coding, Soft Skills, Product Management) Handouts
PPT
Arch factory - Agile Design: Best Practices
PDF
The Open Closed Principle - Part 1 - The Original Version
PDF
The Developers World
PDF
Clean Code
PDF
Most valuable software design principles
PDF
Clean Code
PPT
Coding Standards
PDF
How To Win At Software - Advice for New Engineers - by Gabe Johnson
PPTX
Three Developer Abilities They Dont Teach In College
Clean Code V2
Programming for Non-Programmers - SXSW Vegas 2014
Programming for Non-programmers PFNP @ Razorfish
Design principles in a nutshell
Design principles in a nutshell
Best practices for agile design
Old Code, New Tricks
Thoughtful Software Design
The Art Of Design
Excavating the knowledge of our ancestors
Cracking the Interview Skills (Coding, Soft Skills, Product Management) Handouts
Arch factory - Agile Design: Best Practices
The Open Closed Principle - Part 1 - The Original Version
The Developers World
Clean Code
Most valuable software design principles
Clean Code
Coding Standards
How To Win At Software - Advice for New Engineers - by Gabe Johnson
Three Developer Abilities They Dont Teach In College
Ad

Recently uploaded (20)

PDF
Nekopoi APK 2025 free lastest update
PPTX
ISO 45001 Occupational Health and Safety Management System
PDF
Upgrade and Innovation Strategies for SAP ERP Customers
PDF
2025 Textile ERP Trends: SAP, Odoo & Oracle
PDF
Which alternative to Crystal Reports is best for small or large businesses.pdf
PPTX
ManageIQ - Sprint 268 Review - Slide Deck
PDF
How to Choose the Right IT Partner for Your Business in Malaysia
PDF
System and Network Administration Chapter 2
PDF
Internet Downloader Manager (IDM) Crack 6.42 Build 41
PDF
Odoo Companies in India – Driving Business Transformation.pdf
PDF
Adobe Illustrator 28.6 Crack My Vision of Vector Design
PDF
Softaken Excel to vCard Converter Software.pdf
PPTX
Agentic AI Use Case- Contract Lifecycle Management (CLM).pptx
PDF
T3DD25 TYPO3 Content Blocks - Deep Dive by André Kraus
PDF
medical staffing services at VALiNTRY
PDF
Why TechBuilder is the Future of Pickup and Delivery App Development (1).pdf
PDF
Claude Code: Everyone is a 10x Developer - A Comprehensive AI-Powered CLI Tool
PDF
Flood Susceptibility Mapping Using Image-Based 2D-CNN Deep Learnin. Overview ...
PPTX
CHAPTER 2 - PM Management and IT Context
PPTX
Lecture 3: Operating Systems Introduction to Computer Hardware Systems
Nekopoi APK 2025 free lastest update
ISO 45001 Occupational Health and Safety Management System
Upgrade and Innovation Strategies for SAP ERP Customers
2025 Textile ERP Trends: SAP, Odoo & Oracle
Which alternative to Crystal Reports is best for small or large businesses.pdf
ManageIQ - Sprint 268 Review - Slide Deck
How to Choose the Right IT Partner for Your Business in Malaysia
System and Network Administration Chapter 2
Internet Downloader Manager (IDM) Crack 6.42 Build 41
Odoo Companies in India – Driving Business Transformation.pdf
Adobe Illustrator 28.6 Crack My Vision of Vector Design
Softaken Excel to vCard Converter Software.pdf
Agentic AI Use Case- Contract Lifecycle Management (CLM).pptx
T3DD25 TYPO3 Content Blocks - Deep Dive by André Kraus
medical staffing services at VALiNTRY
Why TechBuilder is the Future of Pickup and Delivery App Development (1).pdf
Claude Code: Everyone is a 10x Developer - A Comprehensive AI-Powered CLI Tool
Flood Susceptibility Mapping Using Image-Based 2D-CNN Deep Learnin. Overview ...
CHAPTER 2 - PM Management and IT Context
Lecture 3: Operating Systems Introduction to Computer Hardware Systems

VS Single Page App Design with AngularJS

  • 1. SINGLE PAGE APP DESIGN WITH ANGULERJS THE WORLD AIN’T WHAT IT USED TO BE… Copyright © 2015, Stacey Vetzal
  • 2. Copyright © 2015, Stacey Vetzal STACEY VETZAL • Founder of Mojility Inc. • First computer, age 10 • hardware and software hacker for 35 years • Frustrated and embarrassed with the state of software development in the industry • I am platform, language, and technology agnostic • I have strong opinions, but they are loosely held
  • 3. Copyright © 2015, Stacey Vetzal HACKER IETF RFC 1392 hacker (n): A person who delights in having an intimate understanding of the internal workings of a system, computers and computer networks in particular. The term is often misused in a pejorative context, where "cracker" would be the correct term.
  • 4. Copyright © 2015, Stacey Vetzal CRAFTSMAN I owe much of who I am to my father. When I was a child, I would go to my father with simple projects, and I would watch him build them, usually of wood, but sometimes other materials. He is an incredible craftsman, brings beauty out of the mundane and gives it a purpose. I strive to honour that in my own craft, which is software development. It is a long road, but I believe worthwhile, as where wood used to touch every aspect of our lives in eras past, now there is software.
  • 5. Copyright © 2015, Stacey Vetzal TODAY Today we are better than yesterday, but not as good as we will be tomorrow. Today our tools are better than they were yesterday, but not as good as they will be tomorrow. We build software today.
  • 6. Copyright © 2015, Stacey Vetzal http://chimera.labs.oreilly.com/books/1234000001813/index.html
  • 7. Copyright © 2015, Stacey Vetzal THE WHITE BELT • … You are walking comfortably on a plateau of competence. Your colleagues recognize your abilities and call on you to help them solve problems in your area of expertise. You have pride in your skills. • … it seems somehow harder than it was before to acquire new skills… You fear that your personal development may have stalled.
  • 8. Copyright © 2015, Stacey Vetzal - Yoda, The Empire Strikes Back “You must unlearn what you have learned.” THE WHITE BELT
  • 9. Copyright © 2015, Stacey Vetzal var i=require(“information”);
  • 10. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN • Tests pass • Express Intent • Don’t Repeat Yourself • Small
  • 11. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: TESTS PASS “Code without tests is bad code. It doesn’t matter how well written it is; it doesn’t matter how pretty or object- oriented or well-encapsulated it is. With tests, we can change the behaviour of our code quickly and verifiably.” - Michael C. Feathers, Working Effectively with Legacy Code
  • 12. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: TESTS PASS • What kinds of tests do you do? • Exploratory? • Story or script driven? • Automated?
  • 13. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: EXPRESSES INTENT The Principle of Least Astonishment “The result of performing some operation should be obvious, consistent, and predictable, based upon the name of the operation and other clues.” -Ward Cunningham, from c2
  • 14. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: EXPRESSES INTENT • There are two hard things in computer science • Cache invalidation • Naming things • Off-by-one errors
  • 15. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: DON’T REPEAT YOURSELF “…every piece of system knowledge should have one authoritative, unambiguous representation… A system’s knowledge is far broader than just its code… database schemas, test plans, the build system, even documentation.” - Dave Thomas, co-author of The Pragmatic Programmer on Orthogonality and the DRY Principle.
  • 16. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: DON’T REPEAT YOURSELF The Single Responsibility Principle “A class should only have one reason to change.” “Responsibilities have profound long-term effects on the maintainability and flexibility of software.” - Robert C. Martin, author Clean Code, Principles of Object Oriented Design
  • 17. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: SMALL - Mark Twain “I didn’t have time to write a short letter, so I wrote a long one instead.”
  • 18. Copyright © 2015, Stacey Vetzal 4 RULES OF SIMPLE DESIGN: SMALL • What does SMALL mean? • Lines of code? • Classes? • Functions? • # of function call arguments? • How do you MEASURE it?
  • 19. Copyright © 2015, Stacey Vetzal using MoreInformation;
  • 20. COHESION AND COUPLING Copyright © 2015, Stacey Vetzal
  • 21. COHESION AND COUPLING Copyright © 2015, Stacey Vetzal
  • 22. COHESION AND COUPLING Copyright © 2015, Stacey Vetzal
  • 23. COHESION AND COUPLING Copyright © 2015, Stacey Vetzal
  • 24. COHESION AND COUPLING Copyright © 2015, Stacey Vetzal
  • 25. COHESION AND COUPLING Copyright © 2015, Stacey Vetzal
  • 26. Copyright © 2015, Stacey Vetzal require(“all-please.php”);
  • 27. Copyright © 2015, Stacey Vetzal THE BIRTH AND DEATH OF JAVASCRIPT • Gary Bernhardt, Destroy All Software • https:// www.destroyallsoftware.com/ talks/the-birth-and-death-of- javascript • If you have any concerns about the legitimacy of JavaScript as a programming language
  • 28. Copyright © 2015, Stacey Vetzal THE BIRTH AND DEATH OF JAVASCRIPT • JavaScript: The Good Parts by Douglas Crockford, 2008 • Generally considered the book that kicked off the JS legitimacy movement • Node.JS, 2009 • Today a very strong foundation of intelligence and maturity working in communities using JavaScript • JavaScript Jabber, DevChat.tv, excellent weekly podcast, currently at episode 154
  • 29. Copyright © 2015, Stacey Vetzal (defun load-information () (load “information.cl”))
  • 30. Copyright © 2015, Stacey Vetzal BREAKING APART WEB APPLICATIONS • MVC? WTF? • Most of what you’ve been told are MVC frameworks are considered Model2 frameworks • Still stemming from classic JSP, ASP and PHP architectures • MVC is really not that informative about good app architecture.
  • 31. Copyright © 2015, Stacey Vetzal WHY ANGULARJS? • Why not? • Tons of attention, and a tiny little backer called Google • Provides good flexibility on how you assemble the browser-side of your apps • Promotes modular design, and supports good testing practices
  • 32. Copyright © 2015, Stacey Vetzal TRY IT YOURSELF • The free Google sponsored course on CodeSchool is a bit slow and corny for experienced developers, but gives you an effective and concise introduction to the core of the framework. • http://campus.codeschool.com/courses/shaping- up-with-angular-js/intro
  • 33. Copyright © 2015, Stacey Vetzal LET’S CODE!