This talk explores some strategies and gives some recommendations when building and maintaining large apps. Given at Drund HQ on Thursday, March 9th 2016.

1. Building Large Mobile Apps

2. A Quick Introduction

3. Me

4. • Adam Magaña
• Lead Mobile Engineer
• 7 years at Drund
• YSU - computer science grad
• Interested in random things -
baking bread, riding bikes,
backpack enthusiast
Me

5. Drund

6. Drund is a white-label communication and
audience-building platform for enterprise
brands.
Allow me to explain…

7. We provide custom branded apps,
a custom branded website, a full
admin panel, and a metric boatload
of features to our customers.

8. Some of Our Customers
• Austintown schools
• Boardman schools
• YSU Athletics
• The Cleveland Cavaliers
• And a few others getting ready to sail

9. We’ve been at this for
a while.

10. A Quick Drund History

11. Drund 1.0

13. • Single sign-on
• Facebook, Twitter, and YouTube integrations
• Netflix and Hulu integrations
• A customizable news reader
• File storage
• Calendar integration
• A quick and simple website publisher

14. It was pretty cool
but…

15. We scrapped most of it.

16. The product needed to be better.
We began revamping our entire project and
started expanding upon our social tools.

17. Then one fateful day…

18. “I need you to start
working on a mobile app
for us.”

19. Okay, let’s do it. But…

20. A Few Immediate Challenges
• No previous experience writing iOS or Android
apps
• Very small team
• Need to build many features
• Need a working prototype very soon

21. Here comes Titanium.

22. Titanium
• Compiles to native iOS and Android
• JavaScript-based API
• Open source
• Native module support
• Better performance than webview-based
competitors

23. One person with no prior mobile
experience could start creating
apps for both iOS and Android.

24. No brainer.
Let’s use Titanium.

25. Mobile Development Starts
This is where the fun begins.

26. A few man-hours
later…

27. iOS App Store launch on October 2012
Google Play Store launch March 2013

28. Initial Launch Features
• Posts
• Broadcasts
• Private messaging
• Profiles

29. Our Feature List Today
• Live video streaming
• Check-ins
• Pages
• Groups
• Custom user permissions
• Account import tools
• Community statistics
• Member statistics
• Facebook and Twitter
integration
• File storage
• Branded apps
• Announcements
• Polls
• Store
• Auctions
• Events
• Hashtags
• Mentions
• Post/announcement
scheduling
• Private messaging
Just to name a few…

30. Current Mobile Status
• 4 full-time mobile team
members.
• 22 custom branded apps on
Play Store and App Store
• 3 branded video streaming
apps
• Ongoing transition to fully
native apps

31. Needless to say we’ve had
to overcome a lot of hurdles.
What helped us get to where
we are today?

32. Three Challenges And
How We Tackle Them

33. 1. Creating and
Managing Branded Apps

34. “We need to be able to completely
customize the existing app.
Colors, icons, splash screens…
everything.”

35. Even after we figure out
how to do it technically
how do we do it feasibly?

36. We need to be able to…
• Edit brand-specific JSON files en masse
• Generate/render template files
• Render brand-specific icons
• Create whole new sets of assets with relative
ease
• Validate existing assets

37. We need automation.

38. Grunt
• JavaScript-based task runner
• Hundreds, if not thousands, of plugins
• Large developer community
• Easy learning curve
• Robust enough for our needs

39. $ grunt simulate:cavs —platform=ios
$ grunt clean
$ grunt production —platform=android
$ grunt add-brand
$ grunt add-property
Automated most of our workflow with relative ease.

40. 2. Maintaining Good
Code Quality

41. Large, high priority feature
roadmap
+
Regular maintenance and
bug fixes
=
Limited time for cleanup

42. Use a code linter - ESLint
Code review everything

43. Still doesn’t completely solve
the code quality problem.
Need to develop good
habits.

44. Hit and Run Approach

45. Android boot file iOS boot file
• Add JS prototype
functions
• Check for credentials
• Open login window if
needed
• Automatically log user
in if needed
• Etc.
Problem:
• Need to add extra logic to boot up process
• Boot up files need cleaned up
• Add JS prototype
functions
• Check for credentials
• Open login window if
needed
• Automatically log user
in if needed
• Etc.

46. Universal boot file
Ideal Solution:
• Add JS prototype
functions
• Check for credentials
• Open login window if
needed
• Automatically log user
in if needed
• Etc.

47. Android boot file iOS boot file
• Check for credentials
• Open login window if
needed
• Automatically log user
in if needed
• Etc.
• Check for credentials
• Open login window if
needed
• Automatically log user
in if needed
• Etc.
Prototype utility file
• Add JS prototype functions
Compromise:

48. Sometimes you can’t do all the
clean up you want to do but you
can and should do something.
Easy to forget that when on a
time crunch.

49. 3. Code Base Bloat

50. Large code base with
multiple developers
+
Non-stop additions
=
Bloat, yo

51. Make simple tools and teach your
peers how to use them.
Avoid accidentally making the same
thing twice.

52. Overlay Tutorials
• Client wants to show a one
time overlay tutorial to new
users.
• How can we break this down
into simple and reusable
parts?
• Expand toolbox
• Avoid writing code that can
only be used for one thing.

53. OneTimeAction.registerOrCallAction({
actionId: 'feed_overlay',
callback: function () {
// This function gets called only one time.
}
});
One Time Action Module

54. TutorialOverlay.showTutorialOverlay({
mode: TutorialOverlay.modes.MESSAGE,
permissions: {
canCreateMessages: self.canSendMessage
}
});
Tutorial Overlay Module
Extends Base Overlay Module

55. OneTimeAction.registerAction({
actionId: 'messages',
callback: function () {
TutorialOverlay.showTutorialOverlay({
mode: TutorialOverlay.modes.MESSAGE,
permissions: {
canCreateMessages: self.canSendMessage
}
});
}
});
Combined Usage

56. This is by no means
groundbreaking. But when you’re
building and maintaining a lot of
code with others it’s easy to
forget to make and share tools.
Avoid re-making something you
or someone else made.

57. These recommendations are in
their simplest form.
Lots of other takeaways we
could talk about.
Don’t get discouraged if you
find yourself wrangling with a
large codebase.

58. We’re looking to grow
our crew!

59. • Backend/DevOps
• Frontend
• Mobile
• Communications
• Design

60. Our next meet up and talk will be
April 27th.
“Up And Running With Docker”
by Mark Beacom
“Building and Refining Features
For Android and iOS”
by Aaron Womer
and Mike Donahue

61. Thanks for coming!

62. Q & A