Scaling API-first – The story of a global engineering organization
Vertical Slicing
1. practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
Created: March 12, 2011
Updated: May 31, 2013
Vertical Slicing
AGENDA ITEMS
Vertical Slicing
By Ben Clay
Copyright 2013 All Rights Reserved by Ben Clay
2. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
2
Vertical Slicing
• Increased productivity
• Improved quality
• Less complex
• Testable
• Vertically sliced module
reuse (pluggable code reuse)
• Greater business value
• Sooner ROI
• Stub dependent data
if not available
• Decreased time to
market
Vertically Sliced Products
• Electronics (Computer Parts)
• Car Parts
• Modular Homes
• More
Breaking a complex problem into smaller more manageable vertical slices
3. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
3
The layers of Vertical Slicing
UX/UI
Service
Data
Additional Top Layer
Additional Middle Layer
Additional Bottom Layer
Login Slice
4. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
4
Vertical User Stories
LOGIN
Email
Password
remember me
Forgot Password
As an end user I must be able to login to my company portal so that I can perform
the functions of my job.
Acceptance Criteria
• Verify that I can log into
the system
• Verify that my login
credentials will be
remembered
• Verify that I can reset my
own password by
clicking the "Forgot
Password" link
• Verify that I cannot
navigate back to the
landing page without
first logging in
5. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
5
The Layers of Login
As a developer I must think about every layer I will need to touch in order to
vertically develop this user story.
NOTE:
At this point, if you as a developer
need to list out all the functions,
then do so. It will only help. This
way you can see what you need
to create and use it as a checklist
ensuring you don’t forget
anything.
UX/UI
Service
Data
Vertical
6. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
As a developer, you will need to think about every file encapsulated in each layer
that needs to be created and/or extended in order to complete this “Login User”
Story.
6
Dissected by Layer
bootstrap class
session class
UX/UI
Service
Data
index.jsp
CSS
constance class / config file
user bean
database class / ORM
database
function class
template class
login service
login.jsp
landing.jsp
JavaScript
7. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
No
index.jsp
7
Horizontal Flow Chart of
Pluggable Vertical Slices
Registration
bootstrap
session
control
No Yes
JavaScript
Register.jsp
HTML5
DB
No Yes
JavaScript
Login.jsp
HTML5
DBYes
Do Nothing
No
Yes
JavaScript
Landing Page
HTML5
Yes
No
Landing
Page Login
UX/UI
SERVICE
DATA
Registered?
Register
Successful?
Already
Logged in?
Login
Successful?Logout?
Vertical Slice Vertical Slice
8. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
8
Questions?
9. Copyright 2013 All Rights Reserved by Ben Clay
practicalA g i l e S o l u t i o n s T h a t W o r k
Ben Clay
9
Take Notes: