Drawing the line between 3rd party and handcrafted code

Often when we write new components, we might be like: Come on, there must be something out there! And most times there was already someone who faced the same problem... only that it's not quite the same. Should I use the 3rd party lib? Or go with my own? Let's find out the differences and drawbacks in this session.

Transcript

1. 3rd party handcrafted @glnnrys
2. Glenn Reyes @glnnrys
3. @glnnrys What should I use?
4. @glnnrys formik final-form formsy redux-form, duh! What form library should I use?
5. @glnnrys react-datepicker react-date-picker react-day-picker material-ui What date picker should I use?
6. @glnnrys moment date-fns dayjs luxon None, just native Date API What date library should I use?
7. @glnnrys nanoid cuid shortid None, just write my own What id generator should I use?
8. @glnnrys lodash ramda underscore What utility library should I use?
9. @glnnrys
10. @glnnrys Approaches
11. @glnnrys
12. @glnnrys
13. @glnnrys Awesome!! Now we have collected all 534 different options! 
 Let's setup a 3-day meeting in two weeks to talk about that and make a constructive bikeshedding workshop!
14. @glnnrys In any case ...
15. @glnnrys
16. @glnnrys "
17. @glnnrys "
18. @glnnrys "
19. @glnnrys "
20. @glnnrys "
21. @glnnrys Architectural decision
22. @glnnrys Complexity Speed API Size Bugs Dependency Documentation Time Constraints Development Environment License https://stackoverflow.com/q/1236256/4149575
23. @glnnrys How to decide what library to use?
24. @glnnrys How to decide what library to use? GitHub stars Active maintenance Active community Platforms
28. @glnnrys Is it over-engineered?
29. @glnnrys Look into the source code.
30. @glnnrys if (el.classList) { el.classList.toggle(className); } else { var classes = el.className.split(' '); var existingIndex = classes.indexOf(className); if (existingIndex >= 0) classes.splice(existingIndex, 1); else classes.push(className); el.className = classes.join(' '); }
31. @glnnrys if (el.classList) { el.classList.toggle(className); } else { var classes = el.className.split(' '); var existingIndex = classes.indexOf(className); if (existingIndex >= 0) classes.splice(existingIndex, 1); else classes.push(className); el.className = classes.join(' '); }
32. @glnnrys if (el.classList) { el.classList.toggle(className); } else { var classes = el.className.split(' '); var existingIndex = classes.indexOf(className); if (existingIndex >= 0) classes.splice(existingIndex, 1); else classes.push(className); el.className = classes.join(' '); }
33. @glnnrys el.classList.toggle(className);
34. @glnnrys Should I pick the lib with highest popularity?
35. @glnnrys How to measure popularity?
36. @glnnrys GitHub stars
37. @glnnrys npm downloads
38. @glnnrys npm downloads
39. @glnnrys Google Trends
40. @glnnrys Google Trends
41. @glnnrys Should I pick the lib with highest popularity?
42. @glnnrys No.
43. @glnnrys Why not just write my own?
44. @glnnrys Tailor to your exact needs.
45. @glnnrys Full control
46. @glnnrys Own responsibility
47. @glnnrys Where to draw the line?
48. @glnnrys It depends.
49. @glnnrys It's a complex problem.
50. @glnnrys Importance
51. @glnnrys Complexity Speed API Size Bugs Dependency Documentation Time Constraints Development Environment License
52. “ ” @glnnrys Kent C. Dodds We should be mindful of the fact that we don't really know what requirements will be placed upon our code in the future.
53. Harm reduction
54. Try to get the best outcome but reduce potential risks.
55. @glnnrys 80/20
56. Always have an answer.
57. Always have a reason.
58. Kiitos. @glnnrys