Building web apps with React+MobX

Presented at the first meetup of the Web Applications Meetup group Veenendaal.

Transcript

1. Web Application Meetup Veenendaal The first
2. Gerben Meyer • Lead Developer at Minox • Before: • Lead Developer at Zoover • Stuff in Taipei • Academia • http://gerbenmeyer.com/
3. Minox • Accounting software • Since 1983 • Around 20 employees • Veenendaal based • Transitioning to cool tech
4. Building web apps with React+MobX How we do it at Minox
5. React • "A JavaScript library for building user interfaces" • Generate HTML client-side and/or server-side • https://reactjs.org/
6. MobX • "Simple, scalable state management" • Store data on which the UI is based • https://mobx.js.org/
7. Integrating MobX and React • Inject the MobX store in the React component • MobX decorators do most of the magic
8. Changing State • Define an action for changing state • Updating observables will notify observers
9. Changing View • MobX observer will update React props • So new accounts are rendered automagically!
10. React Styleguidist • "Isolated React component development environment with a living style guide" • AFAIK the best way of managing all your React components • Especially awesome when not using CSS • https://react-styleguidist.js.org/
11. Bizcuit • "Écht betalen vanuit jouw boekhouding!" • Our first application builtthis way • Mobile-first web app • Connects with bank APIs • Back-end built in NodeJS • HA deployment in AWS • https://www.bizcuit.nl/
12. Let's demo some! All this in practice
13. Time for discussion Thanks for your attention!