Team productivity++ with conventions and CLIs

Team productivity++ with conventions and CLIs

How many times have you created a component file manually in a React project? It’s a lot of repetitive busy work. Perhaps your team uses a feature-based folder structure, so you need to create a folder, index, and style file. More work. Don’t forget to add a test!

We’ll look at how to reduce this repetitive work by leveraging a CLI to generate files in a predictable, yet customizable way. Watch your team’s productivity skyrocket by embracing a cornerstone of developer happiness — automation.

6254dc2b7e4f26b2ab5d05c560834671?s=128

Chris Ball

April 03, 2018
Tweet

Transcript

  1. Team productivity++ with conventions and CLIs

  2. Chris Ball cball_

  3. Chris Ball cball_ If you want to work with: React


    React Native
 GraphQL
 Node / Elixir / Rails Say
  4. Chris Ball cball_

  5. A Familiar Song & Dance

  6. Team productivity++ “Let’s make a new component”

  7. Team productivity++ 1. Manually create files.

  8. Team productivity++ 1. Manually create files.

  9. Team productivity++ Now let’s actually write the code.

  10. Team productivity++

  11. Team productivity++ Code Review

  12. Team productivity++ Code Review “Can you add a test?”

  13. Team productivity++ Code Review “Can you add a test?” “Actually,

    this is the old way. Check out <file>”
  14. Team productivity++ Code Review “Can you add a test?” “Actually,

    this is the old way. Check out <file>” … etc
  15. Team productivity++ Sound familiar?

  16. What’s the problem?

  17. Team productivity++ Source of truth is either:
 1. In someone’s

    head 2. Non-existent
  18. Team productivity++ DRY

  19. Team productivity++ The “right way” changes over time.

  20. Boilerplates & Starter Kits

  21. Team productivity++

  22. Team productivity++

  23. Team productivity++

  24. Team productivity++ “To get started, choose from one of these

    30 options.”
  25. Team productivity++ You are tied to a structure and set

    of conventions.
  26. Team productivity++ Someone has to keep things up-to-date.

  27. Team productivity++ Toor not to?

  28. Team productivity++

  29. A trend towards Flexible conventions

  30. Team productivity++

  31. Team productivity++ Create conventions for your team.

  32. Why?

  33. Team productivity++ ~12 clicks, min 5 keystrokes per file x

    3 different files = At least 45 seconds per component
  34. Team productivity++ And that assumes you do it right.

  35. Team productivity++ More important than time savings…

  36. Team productivity++ Decision Fatigue

  37. Team productivity++

  38. Team productivity++ No more copy paste.

  39. Team productivity++ Ensure everyone is doing things “the new way”.

  40. Team productivity++ Simplify onboarding of new team members.

  41. Team productivity++ Automation makes devs happy!

  42. How?

  43. Team productivity++ Use a CLI

  44. Team productivity++ Use a CLI

  45. Team productivity++ Use a CLI File / folder structure

  46. Team productivity++ Use a CLI File / folder structure Generate

    a failing test
  47. Team productivity++ Use a CLI File / folder structure Generate

    a failing test Redux boilerplate
  48. Team productivity++ But, make sure you can customize it.

  49. Team productivity++ Which CLI to use?

  50. Team productivity++

  51. Team productivity++

  52. Team productivity++

  53. Team productivity++

  54. Team productivity++

  55. Team productivity++

  56. Team productivity++

  57. Team productivity++

  58. Team productivity++

  59. Team productivity++

  60. Team productivity++

  61. Team productivity++

  62. Team productivity++

  63. Team productivity++ Before hygen, here’s what we did.

  64. Team productivity++

  65. Team productivity++

  66. Team productivity++

  67. Team productivity++

  68. Productivity++

  69. None
  70. Team productivity++ Create conventions for your team.

  71. Team productivity++ Extract or leverage tooling to enforce the pattern.

  72. Team productivity++ How can you improve your workflow?

  73. Team productivity++

  74. Chris Ball cball_ Thanks!