Intro to tech stacks bonny a primer for the non technical founder

1. A Primer For the Non-
Technical Founder
Tech Stacks

2. Bonny Lai
Startups Advisor . Co-
Founder . Head of Product At
Roost
500 Startups Alumni
@ansonwolfe
Bonny.lai@gmail.com
Hello!

3. AGENDA OVERVIEW
1 What is a Tech Stack?
2 Frameworks
3 Choosing the Right Stack

4. What is a Tech Stack?
PART ONE

5. Server-Side vs Client-Side
(Back end vs. Front end)

6. The BACK-END contains the business logic
that works behind the scenes to drive your
application.
Users never directly engage with the it.

7. Most well known example of a back-end tech
stack is the LAMP stack
(Linux, Apache, MySQL, PHP)
Variations instead of PHP: Ruby, Python,
NodeJS

8. Frameworks provide developers with
vetted implementations of common web
application features like user authentication
and data access, saving them from rebuilding
from scratch.
Picking the right framework helps with
development speed.

9. Add a High-Level
Impact Statement Here
Popular Frameworks
Language Frameworks
PHP Laravel, Codeigniter, Symphony,
CakePHP
Ruby Ruby on Rails, Sinatra, Lotus
Python Django, Flask
Javascript AngularJS, EmberJS, BackboneJS,
MeteorJS, SailsJS (for NodeJS)

10. The FRONT-END is the visual part of your
application that users will see and interact
with.
Users interact with it.

11. Web:
HTML (Markup Language)
– The content of the site. The text you see
CSS (Cascading Style Sheet)
- The colours & layout of the site
Presentation frameworks:
Twitter Bootstrap
Zurb Foundation

12. JavaScript (Scripting Language)
- The user experience.
JS Frameworks (highly recommended):
• AngularJS - backed by Google
• BackboneJS & EmberJS
• ReactJS - backed by Facebook

13. Data Point It’s a crazy world.

14. Mobile
The big question: Native vs. hybrid?

15. Native Apps
Pros:
• Good for pushing app up in app
store.
• Excellent user experience
• Works well with many APIs
• Always supported by 3rd party
services like marketing
automation platforms
Cons:
• Another codebase to support
• Takes longer to develop
Uses the preferred languages from mobile developers.
iOS: Objective-C, Swift
Android: Java

16. Hybrid Apps
Pros:
• Faster to develop (uses web
technologies)
• Quick learning curve
• Can use native phone features
like GPS, camera, contacts, etc.
• Good for simple, transactionals,
prototypes
Cons:
• Poor user experience
• API interactions slow down
tremendously
• Really great devs can speed
up apps down to 6fps – harder
to do
Uses web technologies (HTML, CSS, Javascript) to build interface, then wrapped
with native code as an app.
Ionic Framework, PhoneGap/Cordova, Telerik, Xamarin

17. React Native
Pros:
• Javascript on both iOS and
Android
• Good user experience
• Most APIs will have JS support
• Can access device features
natively
Cons:
• Still relatively new. Will need
time to tell
• Not yet widely adopted
Facebook’s solution to mobile app development. React is built on top of
Javascript, but resulting compiled app is native with native performance.

18. Choosing the right
stack
PART Three

19. Developers may be biased towards the
technology tools with which they are most
comfortable, or judge technologies purely on
technical merits rather than business needs.

20. Mobile or Web?

21. Mobile or Web
1.Who is your target user base?
2.MVP should focus on ONE platform
first.
• Mobile-first
• Mobile-only
• Mobile-later

22. Mobile First
Responsive / Mobile Optimised:
• Cheaper to build and design
• Great for SEO
• Simple UI - ok for mobile browser
i.e. Etsy, Vimeo, Scribd

23. Mobile Only
1. Available only through App stores
2. Product is mobile primarily
3. Need native device features like camera, GPS,
gyrometer, etc.
4. Real time interactions, push, micro purchases
5. But, you still want to have a simple website to
describe mobile app
6. Usually iOS first, b/c Android has many versions,
devices, harder to maintain

24. Mobile Later
1. Traditional approach – may not ever have
mobile
2. Great for businesses who usually use a
desktop or laptop. B2B
3. Complex user interface
• I.e. Canva, Invision app
4. File uploads like spreadsheets or large
images

25. What product are you trying to build?
Many solutions may already exist.
E-commerce:
1. Magento
2. Shopify
3. Spree
Content:
1. Wordpress
2. Joomla
3. Drupal
Simple:
1. SquareSpace
2. Wix
3. Weebly

26. THANK YOU!

27. The back-end contains the business logic that works
behind the scenes to drive your application. Users will
never directly engage with the back-end
most well known example of a back-end tech stack is
the LAMP stack (Linux, Apache, MySQL, PHP)
Variations: Ruby, Python, NodeJS instead of PHP
Back End