Rails 入門與新人實戰經驗分享 by 小蟹

1. Rails
Ruby on Rails
1

2. Who am I
• I’m
• Master: Ruby & Ruby on Rails
• Company: PIXNET
• Site: http://belovely.tw/
• Blog: http://wildjcrt.pixnet.net/
2

3. Agenda
• Introduction Ruby on Rails
• Rails basic training course
• Working experience
• Example
3

4. Introduction
Ruby on Rails
4

5. Ruby
• Matz
• Perl 6 pearl
Ruby 7 ruby
* http://www.ruby-lang.org/en/
* http://www.ruby-lang.org/zh_TW/ ( )
* http://ruby.tw/ ( )
5

6. Ruby on Rails (1)
• David Heinemeier Hanson (37signals)
• Yehuda Katz (Engine Yard)
* http://rubyonrails.org/
* http://www.rubyonrails.org.tw/ ( )
6

7. Ruby on Rails (2)
• A web framework for Ruby
• MVC architecture
• Agile software development
- Don't Repeat Yourself.
- Convention over Configuration.
7

8. Website using Rails
• BeLovely
• Techbang
• Twitter
• Github
• Tenlong
• Basecamp
• ......more 8

9. In general,
it takes a significant
investment of time to
learn Rails.
9

10. Regular learning roadmap
http://techiferous.com/2010/07/
roadmap-for-learning-rails/
10

11. But,
we now have another way in
the beginning.
11

12. Rails basic
training course
12

13. 2010 Ruby on Rails
Rails 2
• http://blog.xdite.net/?p=1754
- http://blog.xdite.net/?p=1807
- http://wildjcrt.pixnet.net/blog/post/
26624950
* This course is designed by xdite.
13

14. Course purpose
• Basic knowledge
- git, editor, linux cli
• Useful services
- CRUD, authentication, pagination,
attachment files, admin backstage
• Bottleneck
- rack, environment setting
14

15. Course 0: Git
• Open a project in github.
• Practice git useful commands.
- pull, push, commit, branch, add, checkout,
merge, status, diff, grep
* Peepcode Git Pro Git
* http://wildjcrt.pixnet.net/blog/post/
26458848
15

16. Course 0: Editor
• vgod Vim
- http://blog.vgod.tw/2009/12/08/vim-cheat-
sheet-for-programmers/
* http://c9s.blogspot.com/2009/08/vim-hacks-
coscup.html
* Oreilly vi vim
* Pragmatic TextMate: Power Editing for the Mac
16

17. Course 0: Linux CLI
• Peepcode Meet the Command Line
Advanced Command Line
17

18. Reference before course
* http://rails.pixnet.net/blog/category/list/1603567
* http://wildjcrt.pixnet.net/blog/category/list/1431631
* Ruby Programming — Ruby
* Ruby for Rails - Rails Ruby
* The Well-Grounded Rubyist
* Rails
* Agile Web Development with Rails, Third Edition
* The Rails Way
* Ruby Pocket Reference
* Rails Recipes
* Advanced Rails Recipes: 84 New Ways to Build Stunning Rails Apps
18

19. Course 1 (1)
• Create a new rails project.
• Setup configuration.
- database.yml
- .gitignore
• Push to github.
* http://rails.pixnet.net/blog/post/22953827
19

20. Course 1 (2)
• Complete a basic forum.
- Forum model CRUD (scaffold)
- Post model CRUD (scaffold)
- Setting routes in this format :
http://example.org/forums/1/posts/2
* http://rails.pixnet.net/blog/post/22956704
* http://ihower.tw/training/rails-tutoral.html
20

21. Course 2
• User can login / logout / signup.
- Guest can view all posts.
- Post needs to login forum.
- User can only edit and destroy his own
posts.
• Plugin: http://github.com/technoweenie/
restful-authentication DRY!
21

22. Course 3
• Forum posts order and paginate.
- params, pagination
- counter_cache
- named_scope :recent
• Plugin: http://github.com/mislav/will_paginate
* http://railscasts.com/episodes/23-counter-cache-
column
* http://railscasts.com/episodes/108-named-scope
22

23. Course 4
• Attachment files
- PostAttachment model
- form_for, multipart
• Plugin: http://github.com/thoughtbot/paperclip
• Plugin: http://github.com/technoweenie/
attachment_fu
23

24. Course 5
• Forum can manage admin accounts.
• Build backstage.
- route : namespace
- before_filter :require_is_admin
* http://railstips.org/blog/archives/2007/04/28/
namespaces-added-to-routes/
24

25. Course 6
• Rake
- create seed data
- create fake data
• Plugin: http://github.com/ryanb/populator
* http://railsenvy.com/2007/6/11/ruby-on-rails-rake-
tutorial
* http://ryandaigle.com/articles/2009/5/13/what-s-
new-in-edge-rails-database-seeding
25

26. Course 7 (1)
• Installing Ruby on Rails environment in a
pure OS (recommend Debian / Ubuntu).
- Ruby Enterprise Edition
- MySQL
- Apache / nginx
- Passenger
- Capistrano
26

27. Course 7 (2)
• Deploy the practice project.
- Setup deploy.rb.
- Create an account for deploy.
- Setup ssh.
- Setup database, run migration.
- Setup virtual host.
27

28. Course 7 (3)
* http://wildjcrt.pixnet.net/blog/post/
26624950
* http://blog.xdite.net/?p=1807
* AWDR3 deploy
* Ruby Pocket Reference capistrano
28

29. Another Rails Training( )
Ruby on Rails
Ruby on Rails
http://ihower.tw/ http://ihower.tw/
rails2/ rails3/ Rails3
*designed by ihower
http://ihower.tw/blog/
29

30. Related Link
• Ruby on Rails? 2009
- http://rails.pixnet.net/blog/post/27997778
• Ruby on Rails 2009
- http://rails.pixnet.net/blog/post/27997784
• Rails
- http://wildjcrt.pixnet.net/blog/post/26784340
• Rails
- http://wildjcrt.pixnet.net/blog/post/27037216
• Rails from T
- https://gist.github.com/758319
30

31. Working
experience
31

32. Usual work
• Development
- Ex: note on your photos, trying products,
SSO, ...etc.
• Maintaining
- Ex: crontab, daily backup, search
index, ...etc.
32

33. Development new
services
• Planning features in the service.
• Photoshop layout by art.
- layout to HTML by art.
- layout to Ralis by tech.
33

34. When tech get
photoshop layout,
• Divided to many functional blocks. (tickets)
• Design models and schema by
blocks. (paper and pen)
• Create new branch in git.
• Create Models and migrations.
• Apply to controllers and views.
34

35. You maybe need to
• write model method and helper methods.
• write jQuery.
• add your backstage services.
35

36. When tech get
HTML layout
• Ex: http://show.channel.pixnet/index.html
• Divided into Rails layout.
• Combined your functional blocks with
HTML and CSS.
36

37. Finally
• Deploy branch to staging.
• Test and feedback for adjustment.
• Repeat until service online.
• Merge master and deploy to production.
37

38. Example
38

39. Plan - Main
39

40. Plan - List
40

41. Plan - Sticker
41

42. Photoshop - Main
42

43. Photoshop - List
43

44. Photoshop - Sticker
44

45. Tech - List (1)
45

46. Tech - List (2)
46

47. Tech - List (3)
47

48. Tech - Sticker (1)
48

49. Tech - Sticker (2)
49

50. Tech - Sticker (3)
50

51. Combination - Layout
51

52. Combination - List (1)
52

53. Combination - List (2)
53

54. http://belovely.tw/event/perfect
54

55. Q &A
55