Your SlideShare is downloading. ×
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Code for Startup MVP (Ruby on Rails) Session 1
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Code for Startup MVP (Ruby on Rails) Session 1

5,307

Published on

First Session on Learning to Code for Startup MVP's using Ruby on Rails. …

First Session on Learning to Code for Startup MVP's using Ruby on Rails.

This session covers the web architecture, Git/GitHub and makes a real rails app that is deployed to Heroku at the end.

Thanks,
Henry

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
5,307
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
30
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Learning to Code forStartup MVPPresented by Henry Shi
  • 2. IntroductionOverview of SessionsGoals and ExpectationsWhat this session is NotMy background and experiences
  • 3. ResourcesRuby on Rails Tutorial - Michael HartlCS 169: Software Engineering for Software as a Service - Berkeley Course on CourseraRails for Zombies - CodeSchoolVarious resources around the web
  • 4. About Me• Henry Shi o CTO, BetterU (Rails powered ☺) o Tech: Bloomberg Sports • Statistics and Predictive Analytics for MLB • Rails Powered App, Java/C++ services Scotia Capital • Worked on Derivative Trading Engine (Interest rate swaps) • Java, J2EE o Teachings: Student Leadership Program Facilitator Calculus Teaching Assistant
  • 5. Agenda - Monday October 291. The Web and How it Works2. Git/Github3. Rails and Ruby4. Heroku
  • 6. Prework – Setup• Windows (not recommended if possible): o http://railsinstaller.org/• OSX: o http://railsinstaller.org/ o This includes osx-gcc-installer (200mb)• Linux: o http://blog.sudobits.com/2012/05/02/how-to-install- ruby-on-rails-in-ubuntu-12-04-lts/Note: this may take some time
  • 7. Prework - GitInstall git if not already included:http://www.git-scm.com/book/en/Getting- Started-Installing-GitConfigure Git:git config --global user.name "Your Name“git config --global user.email your.email@example.com
  • 8. The WebClient-ServerHTTP, URIHTML, CSS3 Tier ArchitectureMVC
  • 9. The Web - Overview
  • 10. The Web - Client ServerThe web is fundamentally request/reply orientedClient: ask questions on behalf of usersServer: wait for & respond to questions, serve many clients Web browser Web site InternetContrast to P2P
  • 11. The Web - HTTPHypertext Transfer Protocol: an ASCII-based request/reply protocol for transferring information on the WebHTTP request includes:• Request method (GET, POST, etc.) curl –IL “www.betteru.org”• Uniform Resource Identifier (URI)• HTTP protocol version• Headers HTTPstatus codes:HTTP response from server: 2xx — all is well• Protocol version and Status Code 3xx — resource moved• Response Header 4xx — access problem• Response Body 5xx — server error
  • 12. The Web - HTTP• Problems in HTTP: o HTTP is Stateless How to guide use through a flow of pages? IP? String in URI? Cookies o URI naming http://www.amazon.com/gp/product/B0000262LH/ref=s9subs_c3_img1- rfc_p_19_32_31_9_9?pf_rd_m=A1IDDPB1NC5TQ&pf_rd_s=center- &pf_rd_r=1FMGVYJN44H7WQD9YCR9&frd_t=101&pf_rd_p=139524591&pf_rd_i=301128 ^ WTFF? http://www.amazon.com/cd/attwenger/dog REST
  • 13. The Web – HTML & CSS
  • 14. HTML• Hypertext Markup Language <p>This is an element</p> <br /><!-- comment--> <img src="welcome.jpg" id="welcome"/> <h1 class=”foo”> This is an element with an attribute </h1>• Document = Hierarchical collection of elements• Element can have attributes (many optional) – id, class
  • 15. HTML - DOM
  • 16. HTML5• HTML5 is the futurehttp://slides.html5rocks.comCurrent support is not completeDifferent Browswers = Different ResultsDon’t use IE
  • 17. The Web - CSS• Cascading Style Sheets o visual appearance of page described in separate document (stylesheet) o separate designers’ & developers’ concerns• HTML markup should contain NO visual styling information
  • 18. CSS• HTML id & class attributes important in CSS o ( # ) id – must be unique on page o (.) class – can be attached to many elements o element // id selector #main { background-color: orange;} // class selector .sidebar { color: black; } // element selector span { font-size: 24px;} // mixed span.sidebar { color: #C5C5C5; }
  • 19. The Web – 3Tiered Architecture
  • 20. 3Tiered Architecture• Old Days: o Web pages were collection of text files (eg. CS course websites)• Web 1.0: o run a program to generate the “page” o Template embedded with code snippets (Php sites) o Eventually, code became “tail that wagged the dog” and moved out of the Web server• Web 2.0: o Sites that are really programs (SaaS) o Separation of duties, structured
  • 21. 3Tiered Architecture• Frameworks helps you to: Filesystem persistence o “map” URI to correct programs or database & function? o pass arguments? your app logic (app) o invoke program on server? Common Gateway o handle persistent storage? Interface (CGI) o handle cookies? presentation (Web server) o handle errors? o package output back to user? client (browser)
  • 22. 3Tiered Architecture
  • 23. 3Tiered Architecture - Summary• Browser requests web resource (URI) using HTTP – HTTP is a simple request-reply protocol that relies on TCP/IP – In SaaS, most URI’s cause a program to be run, rather than a static file to be fetched• HTML is used to encode content, CSS to style it visually• Cookies allow server to track client Browser automatically passes cookie to server on each request Server may change cookie on each response Typical usage: cookie includes a handle to server-side information That’s why some sites don’t work if cookies are completely disabled• Frameworks make all these abstractions convenient for programmers to use, without sweating the details• ...and help map SaaS to 3-tier, shared-nothing architecture
  • 24. The Web - MVC
  • 25. MVC• Goal: separate organization of data (model) from UI & presentation (view) by introducing controller o mediates user actions requesting access to data o presents data for rendering by the view • User actions Controller • Update data • Directives for rendering data View Model • Data provided to views through controller
  • 26. MVC• Can I see it? o View• Is it business logic? o Controller• Is it a reusable class logic? o Model• More later….
  • 27. GIT/GITHUB• What is GIT?• Distributed Version Control System (DVCS)• Why should I care? o Never lose data or accidentally overwrite, delete files o Collaborate with peers anywhere and stay in sync automatically (no more _v1, _v2, _final, _final_final…) o Compare and track changes over time, and easily revert changes o Deploy code to real web
  • 28. Git - Distributed• Better than CVS, SVN, etc
  • 29. GitHub – Social Coding GitHub will be our central repository Contains the master version of our code GitHub account is the LinkedIn for developers
  • 30. Git – BasicsGit init o Start a git repository in current directory• Make changes o Eg. Touch readme.txtGit status o Check what has changed since previous commitGit add (filename) o Adds files to staging area (about to be committed) o Git add . To add everythingGit commit –m “my message” o Commits changes
  • 31. Git - IntermediateGit Branch branch_name o Create a new branch (parallel code) from current commit pointGit checkout branch_name o Switch to another branchGit Merge branch_name o Merge branch_name to current branch
  • 32. Git – Working Remotely andCollaboration• git remote add origin git@github.com:henrythe9th/foo.git o add a remote repository (named origin) to the repo o In this case, our GitHub repo is the originGit pull o Pull latest changes from originGit push o Push changes to origin
  • 33. Rails and Ruby Programming Web Framework LanguageOur focus is on Rails and how to rapidly prototype Startup MVPs
  • 34. Rails• Ruby on Rails is an open-source web framework that’s optimized for programmer happiness and sustainable productivity.• It lets you write beautiful code by favoring convention over configuration.• 80/20 Rule =>great for Startup MVP
  • 35. Rails – Opinionated Software• Convention over Configuration o Decrease the number of decisions needed gaining simplicity but without losing flexibility• Donʼt Repeat Yourself (DRY) Don’t reinvent the wheel• Architecture: o MVC (Model – View – Controller) o ORM (Object Relational Mapping) o RESTful (Representational State Transfer)
  • 36. Ruby – Programmer’s Best Friend• Ruby is a dynamic, open source programming language with a focus on simplicity and productivity. It has an elegant syntax that is natural to read and easy to write.
  • 37. Ruby – Rocks!• See slides 44 – 92 of slides:http://www.slideshare.net/madrobby/ruby-on- rails-introduction
  • 38. Ruby on Rails – First App• Generators to make first application!• Mkdir first_app• Cd first_app• rails new first_app o You will see that a bunch of files created by Rails automatically – this is the generator scaffolding at work
  • 39. RoR – First App
  • 40. RoR – Directory Structure
  • 41. First App – Gemfile• Open Gemfile• Change line: gem sqlite3‘ togroup :development do gem sqlite3, 1.3.5‘end• Add:group :production do gem pg, 0.12.2end• Run:bundle install --without production
  • 42. First App – Running Server• Run:• rails server
  • 43. First App - GitHub• Create new repo on GitHub – First App
  • 44. First App – Git Commit and Pushgit initgit add .git commit –m “Initial Commit of First App”git remote add origin git@github.com:<username>/first_app.gitgit push –u origin master
  • 45. First App - Usersgit checkout –b users o Create and switch to new branch called usersrails generate scaffold User name:string email:string o Use rails scaffolding to generate users!bundle exec rake db:migrate o Apply the user changes to the databaserails sCommit your code using Git!
  • 46. First App - UsersVisit localhost:3000/usersLocalhost:3000/users/newEverything was created automatically by rails generator! And it all just works!
  • 47. First App – Users MVC
  • 48. First App – Users MVC• Model: /app/models/user.rb• Controller: /app/controllers/users_controller.rb• View: /app/views/users/
  • 49. First App - Micropostsrails generate scaffold Micropost content:string user_id:integer o Use rails scaffolding to generate microposts!bundle exec rake db:migrateEdit: app/models/micropost.rbRails s o Submitting a micropost with more than 140 chars will give error (Automatically handled by Rails!)
  • 50. First App – Microposts & Users• One of Rail’s most powerful features is ability to form associations between data model• each user potentially has many microposts• Edit: app/models/user.rb• Edit: app/models/micropost.rb
  • 51. First App – Microposts and Users• That’s it! Rails automagically set up the association for us. Watch how powerful it is:Rails consolefirst_user = User.firstfirst_user.microposts o Rails automagically knows to find all of the first user’s microposts!
  • 52. First App – Final Commit & MergeCommit your code using gitMerge back into master:Git checkout masterGit merge users
  • 53. First App - HerokuWhat is Heroku?•a hosted platform built specifically for deploying Rails and other web applications in 1 command•Best thing since sliced bread•YC Class 08 (sold for $212M to Salesforce)• Interestingly, they are built on top of Amazon AWS, they just provide an easy abstraction
  • 54. First App – Heroku Setup• Sign up for Heroku (it’s Free!) http://api.heroku.com/signup• Install the Heroku Toolbelt https://toolbelt.heroku.com/• Heroku login• Heroku create o This will create a heroku app and tell you the url of your app• Git push heroku master o This’ll deploy your code to Heroku. Let it do its magic!• Heroku run rake db:migrate• Heroku open ☺
  • 55. Rails Motivation• Basecamp (the origin of Rails)• Twitter (still using it for frontend)• Scribd/Slideshare• Hulu• GitHub• Shopify• Groupon/Livingsocial• YellowPages
  • 56. Next Time…• Understanding Ruby• Exploring Rails deeper• Building toward our Twitter app with user signup/sign in, posts, friends, followers, feeds, etc• Stay Tuned….• Thanks!• Suggestions, Feedback, Contact: henrythe9th@gmail.com

×