A brief overview of the design, code, test and deploy model we use at LinkedIn in the mobile group to build and support multiplatform development.

1. LinkedIn Mobile
How we do we do it?

2. Build
Design
Code
Testing
Deploy

3. Build Platform
Design iOS
Code Android
Testing Browser
Deploy Other

4. Design

5. Interaction vs Visual
• Designing a house’s floorplan
• Focus on Rooms, Doors and Hallways
• Stay away from Paint, Furniture and Carpet
• Has & Does for each screen
• Black & White then add color

6. Search, Compose, Room Navigation
Stream You Inbox Following
Notifications
Breadth < 4
Depth < 3

7. Adjust for App Platform
• On Screen Back vs Hardware Back
• Up vs Back / Stacks vs Pages
• Pull To Refresh vs Button Refresh
• Settings
• Visual Design

8. Mobile Web
Enter the house
SEO
Email
Organic

9. Code

10. Other
iOS Android Mobile Web
Wrap
JS/HTML + Native Native JS/HTML
JS/HTML
Screen based REST API
Mobile Server (node.js + MongoDB)
Domain REST API
LinkedIn Platform

11. Other
iOS Android Mobile Web
Wrap
JS/HTML + Native Native JS/HTML
JS/HTML
Screen based REST API
Mobile Server (node.js + MongoDB)
Domain REST API
LinkedIn Platform

12. Why Node.JS:
Evented & JS
• I/O Bound for most interaction
• Aggregation and Manipulation of Strings
• Lots of persistent socket connections
• Client developers are doing server
development

13. Mobile Server
• Stateless Load Balancer
Nginx Nginx
• Platform Transport:
JSON In / JSON Out Node JS Node JS
Server Server
• Nginx as Web Server
Mongo Logging Tracking
• CDN for Static Content
DB Server Server
• Log / Track Everything LinkedIn Platform

14. Screen Based JSON
• Single Request per {
ttype: nut1,
screen
time: 298349823,
header: “Wow, that is pretty cool”,
• JSON is template .......
......
based
footer: “shared by Kiran Prasad”,
id: 1298398127,
• Updatable on }
server

15. Other
iOS Android Mobile Web
Wrap
JS/HTML + Native Native JS/HTML
JS/HTML
Screen based REST API
Mobile Server (node.js + MongoDB)
Domain REST API
LinkedIn Platform

16. iOS
• Native for all infinite lists
• Native for Window
Manager
• JS/HTML for all screens
that are detail views
• Per screen choice for
the stuff in the middle
• Async JS/iOS Bridge

17. Other
iOS Android Mobile Web
Wrap
JS/HTML + Native Native JS/HTML
JS/HTML
Screen based REST API
Mobile Server (node.js + MongoDB)
Domain REST API
LinkedIn Platform

18. Android
• Native for all the
screens
• WebView for browsing
the web
• Moving towards more
HTML5
• Contacts locally stored
but rest only in memory
cache

19. Other
iOS Android Mobile Web
Wrap
JS/HTML + Native Native JS/HTML
JS/HTML
Screen based REST API
Mobile Server (node.js + MongoDB)
Domain REST API
LinkedIn Platform

20. Mobile Web
• Backbone for MVC
• LocalStorage for personal
Cache
• Underscore for utils
• Zapto for DOM • SASS for CSS
Manipulation
• Closure for compiling
• Modified iScroll for
• Hash based Loader
Scrolling

21. Test

22. Test
• Automation:
Vows, Robotium, Selenium, FoneMonkey,
GHUnit
• Hudson for build management
• Internal Tool for Layout Testing
• PhantomJS based Tool for Performance
• Bug Bash + 2 Week Demos

23. Deploy

24. Deploy / Monitor
• Enterprise Build available • Keynote for
to employees Performance and
Availability monitoring
• Ship everything 2 times a
week • DeviceAnywhere for
compatibility testing
• Apps and Server Deploy
independently • Internal monitoring for
QPS, Uptime, etc
• 2 Week Bake for Big
Stuff • Client Crash Log
Metrics tracked daily

25. Thanks! & Questions?