This document summarizes a developer's process in building a mobile-first dashboard application called Dashery over 2016. It involved standing up a Rails web app, building an Express API, creating a CLI with COA, developing a React Native mobile app, and integrating Azure Functions for serverless components. Challenges included learning new technologies like Docker, Kubernetes, React, Redux, and React Native. The developer also worked to design APIs, SDKs, and automate builds and deployments to launch the minimum viable product.

2. 2016: A YEAR IN REVIEW (THE
DRINKING GAME)➤ Every time I change languages take a shot.
➤ Every time I change jobs take two shots.
➤ Every time I change what I’m working on drink a beer.
➤ Call emergency services.

5. “I NEED TO SHIP SOMETHING
-Me (Around July . . . Roughly)

6. BREADCRUMB TRAIL TO AN IDEA
➤ Munging the iTunes Review Feed took a lot of time.
➤ Fragile Data
➤ Frequent Problems
➤ It would be nice to check the status on my phone…

7. HOW ABOUT A
MOBILE-FIRST
DASHBOARD?

8. THE CHALLENGE
➤ Build a …
➤ API and SDK’s
➤ Command Line Interface (CLI)
➤ Web App
➤ Serverless Data Pipeline Component
➤ Mobile App
➤ Treat it like a hackathon
➤ MVP-Focused
➤ Time-Box

9. Web Application
CLI API (Express.js)
SDK’s Mobile
Serverless (Azure Function)

10. Web ApplicationSDK’s Mobile
CLI API (Express.js) Serverless (Azure Function)

11. Web ApplicationSDK’s Mobile
?
CLI API (Express.js) Serverless (Azure Function)

12. Web ApplicationSDK’s Mobile
CLI API (Express.js) Serverless (Azure Function)

14. THE CHALLENGE
➤ Build …
➤ API and SDK’s
➤ Command Line Interface (CLI)
➤ Web App
➤ Serverless Component
➤ Mobile App
➤ Treat it like a hackathon
➤ MVP-Focused
➤ Time-Box

15. STAND UP THE WEB APP
➤ Create the initial database schema.
➤ Allow for account sign-up and basic sharing.
➤ Templates:
➤ https://railskits.com
➤ https://github.com/railsapps
➤ https://github.com/abdesigner/SaaStarter
➤ Customize the template.
➤ Total Time: 10 Hours

18. HOW TO LOSE A MONTH
➤ Learn Docker Networking
➤ Learn About Kubernetes
➤ Make Contributions to Open Source Projects
➤ https://github.com/deis/deis/pull/5097
➤ https://github.com/deis/postgres/pull/159
➤ https://github.com/kubernetes/kubernetes-
anywhere/pull/258

19. DESIGNING THE API
➤ Use swagger.io to create the API spec.
➤ Use the existing schema setup by the web app.
➤ Keep it RESTful and simple.

20. BUILDING THE API
➤ Configs: dotenv, config
➤ ORM: Sequelize
➤ Bonus: Sequelize CLI
➤ Validation: express-validator
➤ Authorization: Passport
➤ Authentication: Custom
➤ Security: Helmet
➤ Total Time: 16 Hours

21. DESIGNING THE CLI
➤ Similar to Heroku, CloudFoundry, or Dies.
➤ Users should be able to login and logout.
➤ Help should be part of the command definitions.
➤ Help should be available at the command group.
➤ No funky UI in the CLI.

22. BUILDING THE CLI
➤ Security: netrc, dashery-js
➤ Use the API to login.
➤ Store token using .netrc
➤ CLI Framework: COA
➤ JavaScript Compiler: Nexe
➤ Gotchas:
➤ No relative paths! (Browserify loves your tears)
➤ I got 1 problem and CoffeeScript is 99 of them.
➤ Don’t keep your Nexe file open.
➤ Hey Nexe, can I have some HDD space back?
➤ Total Time: 32 Hours

23. BUILDING THE SERVERLESS
COMPONENT (AZURE FUNCTION)➤ Re-use code from the API:
➤ dashery-models
➤ dashery-auth
➤ Middleware: https://github.com/christopheranderson/func-
middleware
➤ Strategies: Custom-Rolled

24. API +
SERVERLESS

27. ABOUT THOSE AZURE APPLICATION
GATEWAYS➤ Great SSL Offloading
➤ Super Slow For Applying Configuration Changes
➤ Configuration Templates Are Verbose
➤ No Good URL Routing Options
➤ Wanted: /applications/{appId}/dashboards/{dashId}/data
➤ Got: /data/applications/{appId}/dashboards/{dashId}
➤ Total Time: 36 Hours

28. DESIGNING THE MOBILE APP
➤ Make it simple
➤ Doesn’t have to be beautiful, just not jarring.
➤ Users should be able to login and logout.
➤ Session state goes to local storage.
➤ Users stay logged in.
➤ Slide out menu for Application selection.
➤ Swipe left and right to go to different dashboards.
➤ Pull to refresh Dashboard.
➤ Dashboards render with common dashboard library.

29. LEARNING REACT, REDUX, AND REACT
NATIVE➤ Apply lessons learned from Polymer.
➤ Read the docs:
➤ https://facebook.github.io/react-native/
➤ https://facebook.github.io/react/
➤ http://redux.js.org/
➤ Watch some videos:
➤ https://egghead.io/courses/getting-started-with-redux
➤ Read some blogs:
➤ https://medium.com/@jonlebensold/getting-started-with-react-native-
redux-2b01408c0053#.4bhmi09ry
➤ Total Time: 16 Hours

30. REACT NATIVE (AND HOW REAL THE
STRUGGLE GETS)➤ Security: dashery-js
➤ Use the API to login.
➤ Store token in state.
➤ Validation: validator
➤ Patch Timers: react-mixin, react-timer-mixin
➤ Animations:
➤ Just curl up in a ball right here.
➤ Rock back and forth crying.
➤ Total Time: 8 Hours . . . and counting

31. BUILDING THE SDK’S
➤ Create Package Configurations
➤ Use Swagger Codegen
➤ Total Time: 1 Hour

32. THINGS TO DO
➤ Finish up the React Native application.
➤ Automate builds and deployments:
➤ fastlane.tools
➤ travis-ci.com
➤ Create basic dashboards for everyone.
➤ Time Budget: 4 Hours
➤ Write some support documentation.
➤ Time Budget: 4 Hours
➤ Launch!
➤ Time Budget: ?????

33. QUESTIONS?
https://getdashery.io