Tweet
Tweet

Slide 1

Slide 1 text

How a small team built an e-commerce service w/ Ruby on Rails and Spree 4QSFFͰ໿ϲ݄Ͱ Πν͔Β&ίϚʔεαʔϏεΛ ࡞Δ·Ͱ Sapporo RubyKaigi 2012, 2012.09.16(Sun) ന౔ ܛ, Shiratsuchi Kei, @kei_s Slides in English, Talk in Japanese. Thank you for helping English. @yuki24 @tenderlove @morgan_randy

Slide 2

Slide 2 text

@kei_s • ന౔ ܛ Shiratsuchi Kei • Born in Sapporo!! • Web app engineer • http://github.com/kei-s

Slide 3

Slide 3 text

How a small team built an e-commerce service w/ Ruby on Rails and Spree 4QSFFͰ໿ϲ݄Ͱ Πν͔Β&ίϚʔεαʔϏεΛ ࡞Δ·Ͱ

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

OhMyGlasses http://www.ohmyglasses.jp

Slide 6

Slide 6 text

http://www.facebook.com/ohmyglassesjp Coupon Code: sprk2012 !!! 12% OFF !!!

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

•Closed β in December 2011 •Public release in January 2012 •Startup, 4 members+ •Seen on TV, twice OhMyGlasses

Slide 9

Slide 9 text

•Built on E-Commerce framework w/ PHP, Magento. •No engineers. (Yes, I wasn’t there.) OhMyGlasses Closed β in December 2011

Slide 10

Slide 10 text

http://www.flickr.com/photos/betsyweber/6719452305/

Slide 11

Slide 11 text

http://www.flickr.com/photos/betsyweber/6719452305/ Get the first Feedback •“Are we able to sell glasses on the web?” •Many concerns. customers, products, operation ...

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

Answer a Tough Question Use Feedback to evaluate Run Iterations before the deadline

Slide 14

Slide 14 text

•Go with PHP Framework •or, rewrite everything with Ruby on Rails When I joined, I make a hard decision ...

Slide 15

Slide 15 text

No content

Slide 16

Slide 16 text

Spree E Commerce Platform Ruby On Rails 100% Open Source

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

Why Ruby/Rails? Why Spree?

Slide 21

Slide 21 text

Why Ruby/Rails? •To run iterations faster, we need a familiar platform. •At least for me, it’s Ruby on Rails. •Why? I love coding in Ruby.

Slide 22

Slide 22 text

Why Spree? •First time to develop an E-Commerce service. •We needed to build well structured cart/payment features.

Slide 23

Slide 23 text

http://www.flickr.com/photos/ucumari/1985214623/

Slide 24

Slide 24 text

Standing on the Shoulders of Giants http://www.flickr.com/photos/ucumari/1985214623/

Slide 25

Slide 25 text

Spree’s structure Rails spree_core Ver 1.2.0 spree_api spree_dash spree_promo spree_auth_devise spree_cmd Ruby

Slide 26

Slide 26 text

Rails spree_core spree_cmd Ruby spree_api spree_dash spree_promo spree_auth_devise Spree’s structure Ver 1.2.0

Slide 27

Slide 27 text

spree_api spree_dash spree_promo spree_auth_devise Rails spree_core spree_cmd Ruby Kaminari Paperclip ActiveMerchant Devise Cancan RSpec FactoryGirl Spree’s structure Ver 1.2.0

Slide 28

Slide 28 text

Spree’s Entity-Relationship Diagram

Slide 29

Slide 29 text

User Product Cart Payment Promotion Tracking Shipment Spree’s Entity-Relationship Diagram

Slide 30

Slide 30 text

http://www.flickr.com/photos/pasukaru76/4370098141/

Slide 31

Slide 31 text

http://www.flickr.com/photos/pasukaru76/4370098141/ Inspect Giants

Slide 32

Slide 32 text

•Only a little code descriptions are in the official documents. •So, I have to read code. Inspect Spree

Slide 33

Slide 33 text

Inspect Code in RubyGems $ cd `bundle show spree_core` #=> /installed/gems/spree_core-1.2.0 $ vim app/models/spree/order.rb •Add debug code into gem code, check changes in the app.

Slide 34

Slide 34 text

Inspect Code def gateway_action(source, action, success_state) protect_from_connection_error do check_environment response = payment_method.send(action, (amount * 100).round, source, gateway_options) handle_response(response, success_state, :failure) end end spree_core/app/models/payment/processing.rb

Slide 35

Slide 35 text

spree_core/app/models/payment/processing.rb Inspect Code def gateway_action(source, action, success_state) protect_from_connection_error do check_environment response = payment_method.send(action, (amount * 100).round, source, gateway_options) handle_response(response, success_state, :failure) end end ? ?

Slide 36

Slide 36 text

spree_core/app/models/payment/processing.rb Inspect Code with tapp def gateway_action(source, action, success_state) protect_from_connection_error do check_environment response = payment_method.send(action, (amount * 100).round, source.tapp, gateway_options) handle_response(response.tapp, success_state, :failure) end end Pretty-print object on console Pretty-print object on console https://github.com/esminc/tapp

Slide 37

Slide 37 text

spree_core/app/models/payment/processing.rb Inspect Code with tapp def gateway_action(source, action, success_state) protect_from_connection_error do check_environment response = payment_method.send(action, (amount * 100).round, source.tapp, gateway_options) handle_response(response.tapp, success_state, :failure) end end # # https://github.com/esminc/tapp

Slide 38

Slide 38 text

http://www.flickr.com/photos/bartelomeus/4184705426/

Slide 39

Slide 39 text

http://www.flickr.com/photos/bartelomeus/4184705426/ Stay Focused

Slide 40

Slide 40 text

•Develop features similar to the existing system.(exclude for operations) •No need to develop new features. (We can do after we ship it.) Focus & Ship

Slide 41

Slide 41 text

One example

Slide 42

Slide 42 text

Lens selection

Slide 43

Slide 43 text

Lens selection Insert your own step in cart process Add lens price to total cost

Slide 44

Slide 44 text

Insert your own step in cart process •Skip the detail :( •I implemented it at Spree Ver1.1.*. •You can do the same much easier with Ver1.2.0.

Slide 45

Slide 45 text

Add lens price to total cost Order line_items 1 * adjustments 1 * Product A : Product B : 20000 JPY 23000 JPY Shipping : Coupon : Tax : Item total : 43000 JPY 500 JPY -3000 JPY (included) 0 JPY Total : 40500 JPY { {

Slide 46

Slide 46 text

Add lens price to total cost Order line_items 1 * Product A : Product B : 20000 JPY 23000 JPY Shipping : Coupon : Tax : Lens : Item total : 43000 JPY 500 JPY -3000 JPY (included) 0 JPY 1500 JPY Total : 42000 JPY adjustments 1 * { { Lens adjustment

Slide 47

Slide 47 text

•Write minimum code to achieve the goal. •Find out where to change. Focus

Slide 48

Slide 48 text

And so ... •Began rewriting in January 2012 •Shipped the new version of the app at the end of March 2012

Slide 49

Slide 49 text

How is Spree? building an EC web service? working for a Startup?

Slide 50

Slide 50 text

Too Well structured cart/payment. Product part could be optional. Nice admin interface. How is Spree?

Slide 51

Slide 51 text

•Fun to develop a B2C web service. •“Selling glasses with happiness is our goal”. Simple. How is building an EC web service?

Slide 52

Slide 52 text

•I have a lot of things to do. •I can focus on what I really should do. •I have direct impact on the direction and results. How is working for a Startup?

Slide 53

Slide 53 text

Repetition

Slide 54

Slide 54 text

Answer a Tough Question Use Feedback to evaluate Run Iterations before the deadline

Slide 55

Slide 55 text

Standing on the Shoulders of Giants http://www.flickr.com/photos/ucumari/1985214623/

Slide 56

Slide 56 text

http://www.flickr.com/photos/pasukaru76/4370098141/ Inspect Giants

Slide 57

Slide 57 text

http://www.flickr.com/photos/bartelomeus/4184705426/ Stay Focused

Slide 58

Slide 58 text

And, We are hiring: Engineer, Designer Talk to @kei_s, @ikuma, @libkazz Thank you!