Boilerplate for a web app today

opinion by Alex Palcuie

Links:
http://infoeducatie.ro/
http://github.com/infoeducatie/infoeducatie-ui
http://github.com/palcu/devnull

Pete Hunt videos:
https://www.youtube.com/watch?v=IVvHPPcl2TM
https://www.youtube.com/watch?v=VkTCL6Nqm6Y

Transcript

1. Boilerplate for a web app today opinion by Alex Palcuie
2. > console.log(me)
3. InfoEducatie
4. Need • website for presentation • community for the participants • paperwork for the organizing committee
5. Paperwork?! • student qualifications from counties • transport sheets • accommodation places • 2 x teacher sheets • rankings for every category • prizes • ministry sheets • NGO sheets • fucking bureaucracy
6. Deliverables • Rails API • Admin Panel • React Frontend
7. To Flux or to not Flux
8. Flux • still have not seen a standard implementation (singleton bleah) • Facebook Flux, Flummox, Reflux • too much extra code to understand • for small apps, $.ajax is still okay • you can always start converting when you feel you have to sync a lot (Facebook did that, Twitter is doing that)
10. Bundling Browserify+Gulp vs WebPack
11. Why WebPack?! • nice pipeline API • require images, stylesheets, whatever • transform JSX, Babel, whatever
12. ES5 vs ES6 What type of React classes?
13. ES6 • cleaner module system • sexy syntax • not using yet w/ React classes because they dropped mixins and did not replace w/ contexts
14. Routing Influences more than you think
15. Routing • react-router + react-router-bootstrap • user object on window.Auth.User • global props • window.Auth.login binded to setState
16. Styles Programmers are not designers
17. Styles • LESS works great w/ WebPack • every component w/ it’s own style • Bootstrap FTW
18. Forms The biggest part of my web app
19. Forms • Declarative, reusable, i18n • react-forms • newforms • … maybe manual?! • same problem as Infoarena, we are writing our own
20. Tests To Jest or not to Jest
21. Tests • karma/mocha/chai vs jest • react-router is pretty difficult to test • will go for live screenshot testing
22. OnBoarding Devs • Bogdan (infra Twitter), Vlad (backend Presslabs), Robert (system Intel) • show them videos of Pete Hunt • props vs state (Hootsuite doc) • linting + CI • you will become SPOF
23. Thanks • http://github.com/infoeducatie/infoeducatie-ui • http://github.com/palcu/devnull • @AlexPalcuie