bentobox model for understanding technology stacks
DESCRIPTION
TRANSCRIPT
![Page 1: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/1.jpg)
a.k,a the Bentobox method to understanding web appsunderstanding web apps
![Page 2: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/2.jpg)
What have we learned so far?
![Page 3: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/3.jpg)
The difference between a web site and a web applicationand a web application.
The difference between aprogramming language and a webprogramming language and a webframework.
Copy-paste rules. Google everything!py p g y g
![Page 4: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/4.jpg)
Picture byhttp://www.flickr.com/photos/gamene/
![Page 5: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/5.jpg)
Why Bento?Why Bento?• You need a balanced mix of things. You need a balanced mix of things. • It’s a puzzle - putting everything
together in the box.
• “Ekiben“ - content which is arranged in the most efficient, graceful manner. The bento is presented in a simple, beautiful, balanced way. Nothing lacking. Nothing superfluous. Not decorated, b t d f ll d i dbut wonderfully designed.
![Page 6: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/6.jpg)
The Bento wireframeThe Bento wireframe
STORAGE(BACK‐END)
THE LOGIC (BACK‐END)
THE STRUCTURE AND STYLE (THE INFRA
(BACK‐END)FRONT‐END
(BACK END)
![Page 7: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/7.jpg)
In practiceTHE LOGIC (THE BACK-END)
In practice…THE LOGIC (THE BACK END)
RUBY ON RAILS, DJANGO, CAKEPHP, JETTY , LIFT….
RUBY, PYTHON, PHP, SCALA MYSQL,
MONGODB
JETTY , LIFT….
HTML CSS
XML
JAVASCRIPTAG
E
K-E
ND
)
UNICORN
AJAX
DOM
E S
TO
RA
NF
RA
E B
AC
K
THE STRUCTURE & STYLE (THE FRONT-END)
TH
E&
IN
(TH
![Page 8: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/8.jpg)
ETSY “We use a number of different programming languages (including Matlab!) but are primarily a PHP shop We ETSY (including Matlab!) but are primarily a PHP shop. We have a number of databases, some of which are MySQL and some of which are PostgreSQL. “
MySQL 0 PostresSQL
PHP + Matlab
ost esSQ
XML
INFRA HTML CSS JAVASCRIPT
DOM
INFRA
AJAX
![Page 9: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/9.jpg)
4SQ “Server code is written in scala running on the lift web framework using jetty for a webserver. We front 4SQeverything with nginx, and use HAProxy in between.MongoDB handles most of our data storage needs (though a bit hasn't been migrated off PostgreSQL yet).
Scala
MongoDB and PostresSQL
Lift
Scala
PostresSQL
XML
HTML CSS JAVASCRIPT
DOM
Nginx + HAProxy
AJAX
![Page 10: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/10.jpg)
R
#1 HTML/CSS#1 HTML/CSS#2 JQUERY #2 JQUERY #3 Unicorn#3 Unicorn
![Page 11: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/11.jpg)
HTML / CSSHTML / CSS
RUBY ON RAILS, DJANGO, CAKEPHP, JETTY , LIFT….
RUBY, PYTHON, PHP, SCALA MYSQL,
MONGODB
JETTY , LIFT….
HTML CSS
XML
JAVASCRIPTUNICORN
AJAX
DOM
![Page 12: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/12.jpg)
jQueryjQuery
RUBY ON RAILS, DJANGO, CAKEPHP, JETTY , LIFT….
RUBY, PYTHON, PHP, SCALA MYSQL,
MONGODB
JETTY , LIFT….
HTML CSS
XML
JAVASCRIPTUNICORN
AJAX
DOM
![Page 13: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/13.jpg)
UnicornUnicorn
RUBY ON RAILS, DJANGO, CAKEPHP, JETTY , LIFT….
RUBY, PYTHON, PHP, SCALA MYSQL,
MONGODB
JETTY , LIFT….
HTML CSS
XML
JAVASCRIPTUNICORN
AJAX
DOM
![Page 14: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/14.jpg)
R#1 PHP#2 SaaS
#6 Apache#7 CSS#2 SaaS
#3 RoR#7 CSS#8 Django
#4 HTML#5 M DB
j g#9 MySQL#10 i#5 MongoDB #10 nginx
Rules: Figure out the term and place it on the bentobox in the right place.. There might be false friends and doubles. Googling allowed!Yo ha e fi e min tes rong ans ers ill beYou have five minutes – wrong answers will beremoved, the team with most post-its wins!
![Page 15: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/15.jpg)
Game on!Game on!
![Page 16: Bentobox model for understanding technology stacks](https://reader034.vdocument.in/reader034/viewer/2022051609/5462a210af79597c138b4b0f/html5/thumbnails/16.jpg)
More questions? Shoot!q