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

Stuck in the Middle with You: Exploring the Con...

Avatar for Justin Weiss Justin Weiss
September 10, 2016
Programming
0
180

Stuck in the Middle with You: Exploring the Connections Between Your App and the Web

Our apps are becoming more complicated and more distributed. We’re extracting APIs and handling callbacks and pings from the services we depend on. We’re using our data and services from different clients, like rich JavaScript applications and mobile apps. And as we fling our logic into more places, it’s harder to see what’s actually going on between them. If you’re working in applications that have become a forest of APIs and services, or you’ve ever said, “I really wish I could just see what kind of data this server thinks I’m handing it, and what I’m getting back,” this talk is for you. With a few tools and some simple techniques, you’ll watch the data go from your apps to your APIs and see your responses, callbacks, and pings come back.
Avatar for Justin Weiss

Justin Weiss

September 10, 2016
Tweet

More Decks by Justin Weiss

See All by Justin Weiss
Building a Collaborative Text Editor
Avatar for Justin Weiss justinweiss
1
1.2k
A Deep Dive into Sessions
Avatar for Justin Weiss justinweiss
2
1.2k
Metaprogramming? Not good enough!
Avatar for Justin Weiss justinweiss
1
540

Other Decks in Programming

See All in Programming
The Missing Link in Angular’s Signal Story: Resource API and httpResource
Avatar for Manfred Steyer manfredsteyer
PRO
0
140
REALITY コマンド作成チュートリアル
Avatar for にしうり らく nishiuriraku
0
120
AIコーディングの理想と現実
Avatar for Tomohisa Takaoka tomohisa
37
39k
Designing Your Organization's Test Pyramid ( #scrumniigata )
Avatar for teyamagu teyamagu
PRO
5
1.3k
設計の本質：コード、システム、そして組織へ / The Essence of Design: To Code, Systems, and Organizations
Avatar for nrs nrslib
10
3.8k
Rubyの!メソッドをちゃんと理解する
Avatar for Yuto Urushima alstrocrack
1
280
Boost Your Performance and Developer Productivity with Jakarta EE 11
Avatar for ivargrimstad ivargrimstad
0
850
Serving TUIs over SSH with Go
Avatar for Carlos Alexandro Becker caarlos0
0
650
Optimizing JRuby 10
Avatar for headius headius
0
590
In geheimer Mission: AI Agents entwickeln
Avatar for Jörg Neumann joergneumann
0
110
Road to Ruby for A Linguistics Nerd
Avatar for Hayato Ishida hayat01sh1da
PRO
0
180
Global Azure 2025 @ Kansai / Hyperlight
Avatar for kosmosebi kosmosebi
0
140

Featured

See All Featured
Navigating Team Friction
Avatar for Lara Hogan lara
185
15k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
6
540
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.3k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
85
4.7k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
133
9.3k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
71
10k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
523
40k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
26k
It's Worth the Effort
Avatar for 3n 3n
184
28k
Side Projects
Avatar for Sacha Greif sachag
453
42k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.1k

Transcript

  1. Stuck in the Middle with You Exploring the Connections Between

    Your App and the Web Justin Weiss @justinweiss

  2. @justinweiss

  3. justinweiss.com Practicing Rails @justinweiss

  4. Our apps are more connected @justinweiss

  5. Phone + API backend @justinweiss

  6. @justinweiss

  7. Callbacks @justinweiss

  8. @justinweiss

  9. @justinweiss

  10. This is fine ...right? @justinweiss

  11. Nope. @justinweiss

  12. Feedback? Errors? @justinweiss

  13. JSON::ParserError: 784: unexpected token at '<!DOCTYPE html> @justinweiss

  14. What are the options? @justinweiss

  15. Logging! @justinweiss

  16. Talk over. @justinweiss

  17. It gets everywhere @justinweiss

  18. It needs to go away @justinweiss

  19. The one thing you didn't log is the thing you

    needed to see @justinweiss

  20. Take a step back @justinweiss

  21. It's just debugging @justinweiss

  22. What do you need to debug effectively? @justinweiss

  23. What is actually true? @justinweiss

  24. You need Visibility @justinweiss

  25. 1. That can't happen. 2. That doesn't happen on my

    machine. 3. That shouldn't happen. 4. Why does that happen? 5. Oh, I see. 6. How did that ever work? 1 1 http://web.archive.org/web/20051027173148/http://www.68k.org/~jrc/old-blog/ archives/000198.html @justinweiss

  26. What else? @justinweiss

  27. How do you separate? @justinweiss

  28. You need Isolation @justinweiss

  29. Visibility and Isolation @justinweiss

  30. Visibility: Requests and Responses @justinweiss

  31. Isolation: Use parts independently @justinweiss

  32. What's the dream? @justinweiss

  33. Monitoring of all requests without additional code @justinweiss

  34. Can fake out any part of the system I own

    @justinweiss

  35. Three things → Send requests → Monitor requests and responses

    → Receive requests @justinweiss

  36. That's what this is about @justinweiss

  37. Better debugging -> Incremental development @justinweiss

  38. @justinweiss

  39. Sending Requests @justinweiss

  40. curl @justinweiss

  41. $ curl https://api.github.com/users/justinweiss { "login": "justinweiss", "id": 1020, "avatar_url": "https://avatars.githubusercontent...",

    ... } @justinweiss

  42. $ curl -d "{\"text\": \"hello, _world_\"}" \ https://api.github.com/markdown <p>hello, <em>world</em></p>

    @justinweiss

  43. It's everywhere! @justinweiss

  44. @justinweiss

  45. Postman2 2 https://www.getpostman.com @justinweiss

  46. @justinweiss

  47. Paw3 3 https://paw.cloud @justinweiss

  48. Intercept everything! @justinweiss

  49. mitmproxy @justinweiss

  50. What does mitmproxy4 do? 4 https://mitmproxy.org @justinweiss

  51. brew install mitmproxy pip install mitmproxy @justinweiss

  52. @justinweiss

  53. What about SSL? @justinweiss

  54. @justinweiss

  55. @justinweiss

  56. /etc/hosts on mobile @justinweiss

  57. @justinweiss

  58. Don't forget to disconnect! @justinweiss

  59. (Except for the three times it happened while creating this

    talk) @justinweiss

  60. Alternatives? @justinweiss

  61. Fiddler5 Charles Proxy6 6 https://www.charlesproxy.com 5 http://www.telerik.com/fiddler @justinweiss

  62. Where are we now? → Send requests @justinweiss

  63. Where are we now? → Send requests → Watch requests

    & responses @justinweiss

  64. Wait for feedback @justinweiss

  65. Bidirectional communication @justinweiss

  66. Don't call us, we'll call you @justinweiss

  67. Don't call us, we'll call you @justinweiss

  68. requestb.in @justinweiss

  69. @justinweiss

  70. webmock.io @justinweiss

  71. @justinweiss

  72. webmock.io @justinweiss

  73. What about local development? @justinweiss

  74. ngrok7 7 https://ngrok.com @justinweiss

  75. @justinweiss

  76. Where are we now? → Send requests → Monitor requests

    and responses → Receive requests @justinweiss

  77. What's next? @justinweiss

  78. Example: OAuth2 @justinweiss

  79. What do we need? The client must be capable of

    interacting with the resource owner's user-agent (typically a web browser) and capable of receiving incoming requests (via redirection) from the authorization server. — OAuth2 RFC8 8 https://tools.ietf.org/html/rfc6749#section-4.1 @justinweiss

  80. @justinweiss

  81. → client id → client secret → redirect uri @justinweiss

  82. @justinweiss

  83. @justinweiss

  84. @justinweiss

  85. Example: Making an authenticated request to GitHub @justinweiss

  86. @justinweiss

  87. @justinweiss

  88. @justinweiss

  89. @justinweiss

  90. @justinweiss

  91. It's complicated @justinweiss

  92. It's complicated @justinweiss

  93. It's complicated @justinweiss

  94. Visibility @justinweiss

  95. Isolation @justinweiss

  96. Visibility and Isolation @justinweiss

  97. → Send requests: curl, Postman, Paw @justinweiss

  98. → Send requests: curl, Postman, Paw → Monitor: mitmproxy, Fiddler,

    Charles Proxy @justinweiss

  99. → Send requests: curl, Postman, Paw → Monitor: mitmproxy, Fiddler,

    Charles Proxy → Receive requests: requestb.in, webmock.io, ngrok @justinweiss

  100. → Send requests: curl, Postman, Paw → Monitor: mitmproxy, Fiddler,

    Charles Proxy → Receive requests: requestb.in, webmock.io, ngrok @justinweiss

  101. Justin Weiss Avvo [email protected] twitter: @justinweiss @justinweiss

  102. Questions? @justinweiss

  103. Justin Weiss Avvo [email protected] twitter: @justinweiss @justinweiss