Upgrade to Pro — share decks privately, control downloads, hide ads and more …

API First (ZendCon 2013)

API First (ZendCon 2013)

A recent theme among web creators is the notion of mobile first. It's the idea that we should design first for the mobile experience. Throw in the concepts of progressive enhancement and responsive design, and we have some excellent approaches to interface design and development. But where does that leave the overall software design? How do we get all the data to the interface and manipulate it without building a lot of back-end scripts to drive the various front-end incarnations? A centralized API will solve these problems, but we're often scrambling to implement the "mobile first" strategy on top of existing code. For good web software design, it's time to start thinking in terms of API first. In this talk, Ben Ramsey pulls from his experience making APIs to discuss how you can begin projects with an API-centric mindset and use this to your advantage to deliver software quickly, more efficiently, and with higher quality. If you already have projects that began life without APIs, then have no fear. Ben will also share how to use the same principles to convert existing web applications to API-backed software with some elbow grease, of course.

Ben Ramsey

October 10, 2013
Tweet

More Decks by Ben Ramsey

Other Decks in Programming

Transcript

  1. API First
    Ben Ramsey

    View full-size slide

  2. 6 billion mobile subscriptions globally

    View full-size slide

  3. 6 BILLION!!!

    View full-size slide

  4. Website
    MVC Templates
    Static Assets
    Database

    View full-size slide

  5. 6 BILLION!!!

    View full-size slide

  6. Website & Mobile
    MVC
    Templates
    Static Assets
    Database
    Mobile
    Templates
    Separate Mobile
    MVC Templates
    Static Assets
    Database
    Website & Mobile
    MVC Templates
    Static Assets
    Database
    Mobile
    Templates
    Mobi
    MVC

    View full-size slide

  7. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database

    View full-size slide

  8. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  9. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  10. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  11. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  12. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  13. “A big ball of mud is haphazardly structured, sprawling,
    sloppy, duct-tape and bailing wire, spaghetti code jungle.
    We’ve all seen them. These systems show unmistakable
    signs of unregulated growth, and repeated, expedient
    repair. Information is shared promiscuously among
    distant elements of the system, often to the point where
    nearly all the important information becomes global or
    duplicated. The overall structure of the system may never
    have been well defined. If it was, it may have eroded
    beyond recognition.”
    — Brian Foote and Joseph Yoder, laputan.org/mud

    View full-size slide

  14. Start with the API first

    View full-size slide

  15. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  16. Start with the API first

    View full-size slide

  17. 1. Separation of concerns

    View full-size slide

  18. API Layer
    UI 1 UI 2 UI 3

    View full-size slide

  19. 2c. Business

    View full-size slide

  20. 2d. Technology

    View full-size slide

  21. API Layer
    UI 1 UI 2 UI 3
    Users Assets Products Trx

    View full-size slide

  22. 3. Extensible

    View full-size slide

  23. 5. Evolvable

    View full-size slide

  24. 1. Single responsibility

    View full-size slide

  25. 2. Open/closed

    View full-size slide

  26. 3. Liskov substitution

    View full-size slide

  27. Client Service 1 Service 2
    Service 3

    View full-size slide

  28. Client Service 1 Service 2
    Service 3

    View full-size slide

  29. 4. Interface segregation

    View full-size slide

  30. 5. Dependency inversion

    View full-size slide

  31. Client Service 1 Service 2
    Service 3

    View full-size slide

  32. Service-oriented architecture

    View full-size slide

  33. Representational State
    Transfer (REST)

    View full-size slide

  34. 1. Client-server
    2. Stateless
    3. Cacheable
    4. Layered system
    5. Code on demand
    6. Uniform interface

    View full-size slide

  35. API Layer
    Native
    App Website Mobile
    Users Assets Products Trx
    Database

    View full-size slide

  36. What about “legacy” code?

    View full-size slide

  37. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    Native App API
    Native App

    View full-size slide

  38. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    API Layer
    Native App

    View full-size slide

  39. Mobile
    MVC Templates
    Static Assets
    Website
    MVC Templates
    Static Assets
    Database
    API Layer
    Native App

    View full-size slide

  40. But how do we “sell” it within
    our company?

    View full-size slide

  41. 1. Show how it adds value, increases
    throughput, and decreases time to
    implement change requests and new
    features
    2. Demo a working prototype
    3. Do this with a presentation
    4. Tell a convincing story
    5. Create a roadmap
    6. Get help from a co-worker, boss, or
    mentor

    View full-size slide

  42. Ben Ramsey
    benramsey.com
    @ramsey
    joind.in/9094
    Thank you

    View full-size slide

  43. API First
    Copyright © Ben Ramsey. Some rights reserved.
    This work is licensed under a Creative Commons Attribution-NonCommercial-
    NoDerivs 3.0 Unported.
    For uses not covered under this license, please contact the author.
    Ramsey, Ben. “API First.” ZendCon. Santa Clara Convention Center, Santa Clara, CA.
    10 Oct. 2013. Conference Presentation.

    View full-size slide

  44. Photo Credits
    1. “Samsung to Launch Smart Feature Phone ‘REX Series’ in Emerging Markets” by Samsung Tomorrow,
    flickr.com/photos/samsungtomorrow/8475665954
    2. “Danger D'Avalanche” by Peter Dutton, flickr.com/photos/joeshlabotnik/375149668
    3. “Favela da Rocinha” by Scott Hadfield, flickr.com/photos/hadsie/3289716114
    4. “Wrapping paper and bow” by Jonathan, flickr.com/photos/metabrilliant/4805163439

    View full-size slide