Save 37% off PRO during our Black Friday Sale! »

Debugging JavaScript, Ruby, Elixir

Cb09696b034cce3cc79cab80a4bba4a3?s=47 exAspArk
November 21, 2018

Debugging JavaScript, Ruby, Elixir

# JavaScript
* alert
* console.log
* console.time
* console.trace
* console.table
* Pretty print
* debugger
* Interactive breakpoints
* iframes
* React, Apollo, Redux, BrowserStack extensions
* Debuggin iOS, Android
# Ruby
* I am a puts debugger
* caller
* source_location
* freeze
* backtrace
* Logger
* REPL
* pry: cd, ls, whereami, wtf?, show-source
* Dotfiles
* Mute output
* Reload rails console
* Override in runtime
* Bundler open, show gem
* Gem pristine
* Checkups: Sentry, Slack, email
* sshrc
* ps, top, strace
* rbtrace, rbspy, stackprof
# Elixir
* IEx: i, h
* Connect nodes
* Distillery remote_console
* IO.inspect and pipe operator
* IEx.pry
* Debugger
* Observer

Cb09696b034cce3cc79cab80a4bba4a3?s=128

exAspArk

November 21, 2018
Tweet

Transcript

  1. Debugging JavaScript, Ruby, Elixir

  2. Debugging JavaScript

  3. alert

  4. console.log

  5. Store as global variable

  6. console.time ⏱

  7. console.trace

  8. console everything

  9. Unminify with pretty print

  10. debugger

  11. Interactive breakpoints in any code Source maps

  12. Switch JavaScript context for iframes

  13. React extension Select a React element https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en

  14. Open iframes directly to make React extension work

  15. Apollo extension https://chrome.google.com/webstore/detail/apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm

  16. Redux extension https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=en

  17. BrowserStack local extension https://www.browserstack.com/local-testing

  18. Debugging iOS

  19. Debugging Android https://developers.google.com/web/tools/chrome-devtools/remote-debugging/

  20. Learn DevTools (Chromium) • Shortcuts • Network tab • Event

    listeners • Storage • Performance • Service Workers • etc.
  21. Debugging Ruby

  22. I am a puts debugger https://tenderlovemaking.com/2016/02/05/i-am-a-puts-debuggerer.html

  23. Stacktrace

  24. Where a method is defined?

  25. Who mutates my variable?

  26. Inspect and backtrace

  27. Set up logger

  28. REPL https://en.wikipedia.org/wiki/Read%E2%80%93eval%E2%80%93print_loop Read-Eval-Print-Loop is a simple, interactive computer programming environment

    that takes single user inputs, evaluates them, and returns the result to the user. REPL involves the programmer more frequently than the classic edit- compile-run-debug cycle.
  29. Pry https://github.com/pry/pry

  30. Next and step

  31. Dotfiles: irbrc, pryrc, gemrc, etc. https://github.com/exAspArk/dotfiles

  32. List methods with Ruby

  33. List methods with Pry

  34. Switch context

  35. Show context

  36. Last eval

  37. Last exception

  38. Mute output

  39. See the source code

  40. Reload rails console

  41. Override in runtime

  42. Change local gems with bundler

  43. Restore local gems after

  44. Debugging in production If something weird is happening, consider collecting

    more information about frequency and context: • Report to your error tracker (Sentry) • Notify in your messenger (Slack) • Send an email • etc.
  45. Debugging in production

  46. Checkups https://speakerdeck.com/rofreg/the-doctor-is-in-using-checkups-to-find-bugs-in-production-with-presenter-notes

  47. Vim + sshrc > AWS Cloud9 https://github.com/Russell91/sshrc

  48. Inject any debugger in Vim with <Leader> + p https://github.com/exaspark/dotfiles

  49. Try to alias the most used CLI commands https://github.com/exaspark/dotfiles

  50. Pry in production https://github.com/Russell91/sshrc

  51. Check running processes (ps or top+zxc)

  52. Use strace or rbtrace https://github.com/tmm1/rbtrace

  53. Use rbspy or stackprof https://rbspy.github.io/rbspy-vs-stackprof/

  54. Debugging Elixir

  55. IEx

  56. Send messages from one node to another

  57. Use remote_console with Distillery https://hexdocs.pm/distillery/introduction/understanding_releases.html

  58. IO.inspect with pipe operator

  59. IEx.pry

  60. Debugger: start

  61. Debugger: attach and add a breakpoint

  62. Debugger: hit the breakpoint

  63. Observer