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

API First (PHP Tek 2013)

API First (PHP Tek 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
PRO

May 17, 2013
Tweet

More Decks by Ben Ramsey

Other Decks in Technology

Transcript

  1. API First
    Ben Ramsey

    View Slide

  2. View Slide

  3. I write

    View Slide

  4. I blog

    View Slide

  5. I tweet
    @ramsey

    View Slide

  6. View Slide

  7. I work

    View Slide

  8. I user
    group

    View Slide

  9. I play

    View Slide

  10. View Slide

  11. View Slide

  12. 6 billion mobile subscriptions globally

    View Slide

  13. 6 BILLION!!!

    View Slide

  14. View Slide

  15. View Slide

  16. View Slide

  17. Website
    MVC Templates
    Static Assets
    Database

    View Slide

  18. 6 BILLION!!!

    View Slide

  19. 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 Slide

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

    View Slide

  21. View Slide

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

    View Slide

  23. View Slide

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

    View Slide

  25. View Slide

  26. “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 Slide

  27. Start with the API first

    View Slide

  28. 1. Separation of concerns

    View Slide

  29. API Layer
    UI 1 UI 2 UI 3

    View Slide

  30. 2. Scalable

    View Slide

  31. 2a. Team

    View Slide

  32. 2b. Product

    View Slide

  33. 2c. Business

    View Slide

  34. 2d. Technology

    View Slide

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

    View Slide

  36. 3. Extensible

    View Slide

  37. 4. Seamless

    View Slide

  38. 5. Evolvable

    View Slide

  39. SOLID

    View Slide

  40. 1. Single responsibility

    View Slide

  41. 2. Open/closed

    View Slide

  42. 3. Liskov substitution

    View Slide

  43. Client Service 1 Service 2
    Service 3

    View Slide

  44. Client Service 1 Service 2
    Service 3

    View Slide

  45. 4. Interface segregation

    View Slide

  46. 5. Dependency inversion

    View Slide

  47. Client Service 1 Service 2
    Service 3

    View Slide

  48. Service-oriented
    architecture

    View Slide

  49. Representational State
    Transfer (REST)

    View Slide

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

    View Slide

  51. View Slide

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

    View Slide

  53. What about “legacy”
    code?

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

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

    View Slide

  58. 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 Slide

  59. Thank you

    View Slide

  60. View Slide

  61. Ben Ramsey
    benramsey.com
    @ramsey
    joind.in/8148
    Thank you

    View Slide

  62. 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.” PHP Tek. Sheraton Chicago O’Hare
    Airport Hotel, Rosemont, IL. 17 May 2013. Conference
    Presentation.

    View Slide

  63. Photo Credits
    1. http://www.flickr.com/photos/sebastian_bergmann/286847543/
    2. http://www.flickr.com/photos/samsungtomorrow/8475665954/
    3. http://www.flickr.com/photos/statefarm/8203770426/
    4. http://www.flickr.com/photos/supersum/4949860764/

    View Slide