Slide 1

Slide 1 text

ࣦഊͯ͠΋େৎ෉ʂ ͻͱΓWebαʔϏεͷ͢ʍΊ @morihirok ฏ੒.rb #11 -ฏ੒Rejectձٞ-

Slide 2

Slide 2 text

ࣗݾ঺հ @_morihirok morihirok hey / STORES.jp, inc ত࿨63೥ੜ

Slide 3

Slide 3 text

ࠓ೔࿩͞ͳ͍͜ͱ • ͻͱΓͰ Web αʔϏεΛӡ༻͢ΔͨΊͷϊ΢ϋ΢ • Web αʔϏεͰͷՔ͗ํ • Ruby

Slide 4

Slide 4 text

ࠓ೔࿩͢͜ͱ • ։ൃͨ͠ Web αʔϏεͷ঺հ • ͻͱΓ Web αʔϏε։ൃϊ΢ϋ΢ • ͻͱΓ Web αʔϏε։ൃ͔ΒֶΜͩ͜ͱ

Slide 5

Slide 5 text

։ൃͨ͠ Web αʔϏεͷ঺հ

Slide 6

Slide 6 text

ʮऔΓஔ͖ʯͷ՝୊Λղܾ͔ͨͬͨ͠ “ʮऔΓஔ͖νέοτ༧໿ʯͱ͸ɺLINE΍ϝϧϚΨͳͲ ͰόϯυϝϯόʔʹऔΓஔ͖༧໿Λ࿈བྷͯ͠΋Β͑Ε ͹ɺϥΠϒϋ΢εͷड෇ͰલചΓνέοτΛʮऔΓஔ ͘ʯ͜ͱ͕Ͱ͖ΔγεςϜͰ͢ɻ” - औΓஔ͖༧໿ͱ͸ʁϥΠϒϋ΢εಠࣗͷνέοτ༧໿γεςϜΛղઆ (https://www.shellbys.com/entry/torioki)

Slide 7

Slide 7 text

- औΓஔ͖༧໿ͱ͸ʁϥΠϒϋ΢εಠࣗͷνέοτ༧໿γεςϜΛղઆ (https://www.shellbys.com/entry/torioki) ͦ΋ͦ΋ʮऔΓஔ͖ʯͱ͸ʁ

Slide 8

Slide 8 text

- औΓஔ͖༧໿ͱ͸ʁϥΠϒϋ΢εಠࣗͷνέοτ༧໿γεςϜΛղઆ (https://www.shellbys.com/entry/torioki) ͦ΋ͦ΋ʮऔΓஔ͖ʯͱ͸ʁ

Slide 9

Slide 9 text

- औΓஔ͖༧໿ͱ͸ʁϥΠϒϋ΢εಠࣗͷνέοτ༧໿γεςϜΛղઆ (https://www.shellbys.com/entry/torioki) ͦ΋ͦ΋ʮऔΓஔ͖ʯͱ͸ʁ

Slide 10

Slide 10 text

՝୊ײ • औΓஔ͖༧໿Λड͚෇͚ͨ͋ͱɺϥΠϒϋ΢εͷࢴʹϦ ετΛखॻ͖͢ΔʢϚδͰ200ਓ෼खॻ͖ͨ͠Γ͢Δʣ • TwitterͷDMɺLINEɺEϝʔϧͳͲͳͲϝϯόʔͦΕͧ Ε༷ʑͳํ๏Ͱड͚෇͚ͯ͠·͍؅ཧͰ͖ͳ͍ • ༧໿͢Δଆ΋TwitterͷDMͱ͔Eϝʔϧͱ͔ϋʔυϧ͕ ߴ͍

Slide 11

Slide 11 text

torioki.net Λ։ൃ

Slide 12

Slide 12 text

؅ཧը໘͔Β؆୯ʹ༧໿ϑΥʔϜΛ࡞ΕΔʂ

Slide 13

Slide 13 text

͓٬͞Μ͸༧໿ϑΥʔϜ͔Β؆୯ʹऔΓஔ͖Ͱ͖Δʂ

Slide 14

Slide 14 text

ϥΠϒ͝ͱͷऔΓஔ͖ϦετΛPDFͰམͱͤΔʂ

Slide 15

Slide 15 text

ͦΜͳtorioki.netͷ׆ಈใࠂ • ٕज़ελοΫɿ Ruby on Rails, Heroku • ։ൃظؒɿ 2018೥5݄ʙ2018೥9݄ ʢϑϧλΠϜͰಇ͍͓ͯΓ༨ՋͰ։ൃʣ • αʔϏεఏڙظؒɿ 2018೥10݄ʙ2019೥2݄ʢαʔϏεऴྃʣ • ૯Ϣʔβʔ਺ɿ 2ʢͦͷ͏ͪͷ1͸ࣗ෼ʣ ͜ͷൃද།Ұͷ3VCZཁૉ

Slide 16

Slide 16 text

ͻͱΓ Web αʔϏε։ൃϊ΢ϋ΢

Slide 17

Slide 17 text

Write Code Every DayΛ࣮ફ͢Δ • Write Code Every Day https://johnresig.com/blog/write-code-every-day/ ։ൃظؒ

Slide 18

Slide 18 text

Write Code Every DayΛ࣮ફ͢Δ • ϒϩάͷ಺༰Λݫີʹ࣮ફ͍ͯ͠ΔΘ͚Ͱ͸ͳ͍ • Կ೔͔࣮ફͰ͖ͳ͔ͬͨ • WebαʔϏεͰ͋ΔͨΊϓϥΠϕʔτϦϙδτϦʹ Push͠ଓ͚ͨ • ϝΠϯͷ࢓ࣄͷཪͰݸਓ։ൃΛߦ͏৔߹͸͓͢͢Ί

Slide 19

Slide 19 text

ٕज़తڵຯͱϓϩμΫτ׬੒ͷόϥϯεΛऔΔ • ݸਓ։ൃͰ͸ීஈ΍Βͳ͍͜ͱΛ΍Γͨ͘ͳΔ • લ͔Βؾʹͳͬͯͨ ̋ ̋ Λ࢖ͬͯΈ͍ͨ • Զ͕ߟ͑Δ࠷ڧͷΞʔΩςΫνϟΛࢼ͍ͨ͠

Slide 20

Slide 20 text

ٕज़తڵຯͱϓϩμΫτ׬੒ͷόϥϯεΛऔΔ • ׳Εͳ͍ٕज़Λ࢖͏ͱ։ൃ଎౓͕ग़ͳ͍ ։ൃ଎౓ ࢖͏ٕज़ͷशख़౓

Slide 21

Slide 21 text

ٕज़తڵຯͱϓϩμΫτ׬੒ͷόϥϯεΛऔΔ ։ൃظؒ ๞͖ΔՄೳੑ • ։ൃ଎౓͕ग़ͳ͍ͱ๞͖ΔՄೳੑ͕ߴ·Δʢݸਓࠩ͋Γʣ

Slide 22

Slide 22 text

ٕज़తڵຯͱϓϩμΫτ׬੒ͷόϥϯεΛऔΔ • ࢖༻͢Δٕज़ͷࢥ૝ʹΑͬͯ΋ͱ΋ͱ։ൃ଎౓͕ग़΍ ͍͢΋ͷ͕͋Δ • Ruby on Rails • Laravel • ͍ΖΜͳม਺͕͋Δ͕ܧଓ͕େࣄͳͷͰָ͘͠΍ΕΔ ͱࢥ͑Δٕज़બఆΛ

Slide 23

Slide 23 text

࠷খݶͷΰʔϧΛܾΊΔ • ։ൃத͸ເ͕ൃࢄ͢Δ • ͍ΖΜͳػೳɾ࣮૷ΞΠσΞ͕ࢥ͍ͭ͘ • εέʔϧͨ͠৔߹ͷΞʔΩςΫνϟʹ͍ͭͯࢥ͍Λد ͤΔ • ࣮ࡍͻͱΓͰ։ൃ͢ΔͱϦιʔε͕શવ଍Γͳ͍ • ʮ͜Ε͕Ͱ͖ͨΒ׬੒ʂʯΛখ͞ΊʹܾΊ͓ͯ͘

Slide 24

Slide 24 text

Bootstrap Studio͕࠷ߴͩͬͨ

Slide 25

Slide 25 text

Bootstrap Studio͕࠷ߴͩͬͨ • https://bootstrapstudio.io/ • Bootstrap frameworkΛ࢖༻ͨ͠Ϩεϙϯγϒͳ΢Σϒ αΠτͷϞοΫΞοϓ͕Ͱ͖ΔΞϓϦ • ϚʔΫΞοϓʹ͔͚Δ࣌ؒΛେ෯ʹ࡟ݮͰ͖ͨ • 1೥ؒͷϥΠηϯε͕ $29 ͔͔Δ͕༨༟Ͱݩ͕औΕͨͱ ײ͍ͯ͡Δ

Slide 26

Slide 26 text

ͻͱΓ Web αʔϏε։ൃ͔ΒֶΜͩ͜ͱ

Slide 27

Slide 27 text

࣮͸΍ͬͨ͜ͱͳ͍͜ͱ͕ͨ͘͞Μ͋Δ • OGPͷઃఆ΍SEOʹޮ͘λάͷઃఆ • υϝΠϯͷऔಘ • Google Analytics΍֤छ޿ࠂλάͷઃఆ • ٕज़બఆ • ͦͷଞͨ͘͞Μ

Slide 28

Slide 28 text

σβΠϯ͸ΊͬͪΌେมͩ͠σβΠφʔ͸͍͢͝ • ։ൃલʮheyͷCIσβΠϯϓϩηεશه࿥ʢhttps:// note.com/stam_mat2/n/n5282047afb1dʣʯͱ͍͏note ΛಡΉ • ͻͱͭͷίʔϙϨʔτΞΠίϯΛ࡞ΔͨΊʹͱͯͭ΋ͳ ͍ϓϩηεΛܦͨه࿥ • ࣗ෼΋αʔϏε։ൃΛ͢ΔͳΒ͜Ε͘Β͍ͩ͜ΘΓΛ ࣋ͬͯ࡞ΔΜͩͱ੤͏

Slide 29

Slide 29 text

σβΠϯ͸ΊͬͪΌେมͩ͠σβΠφʔ͸͍͢͝ • ։ൃʹ͋ͨͬͯσβΠϯΛษڧͩ͜͠ΘΓͷ͋ΔWebαʔϏ εʹ͠Α͏ͱࢤ͢ • ౰વͳ͕ΒҰேҰ༦Ͱ͸౸ఈͰ͖ΔΑ͏ʹͳΒͳ͍ • σβΠϯ͕Χόʔ͢Δൣғ͸ͱͯ΋޿͍ • ࣋ͬͯੜ·Εͨηϯε΋ඞཁʁʢ৺৅ʣ • Bootstrap StudioʹखΛग़͢ • ΩϟϦΞͷ࣠ʹʮσβΠφʔ͕ڧ͍૊৫ʯ͕௥Ճ͞ΕΔ

Slide 30

Slide 30 text

ϓϩμΫτϚωδϝϯτԿ΋Θ͔Βͳ͍ • ͦ΋ͦ΋࠷খݶͷΰʔϧ͸Ͳ͏΍ܾͬͯΊΔͷ͔ • ࢲ͕ఏڙ͍ͨ͠Ձ஋͸Կͳͷ͔ • ࣗ෼ͷମݧͱ޲͖߹͏೔ʑ • ՍۭͷϢʔβʔͱ޲͖߹͏೔ʑ • ࣮૷ํ๏ͷਖ਼ղ͸͋Δఔ౓Θ͔Δ͕ɺԿΛ࣮૷͢΂͖͔ ͷਖ਼ղ͸ͱͯ΋೉͍͠ • ೔ʑ͜͏͍͏՝୊ͱઓ͍ͬͯΔਓʑ͸͍͢͝

Slide 31

Slide 31 text

ͻͱΓͰWebαʔϏεΛӡ༻͠ଓ͚Δͷ͸େม • αʔϏε͕ଘଓ͢ΔݶΓ༨ՋΛར༻͠վળ͠ଓ͚ͳ͚ Ε͹ͳΒͳ͍ • վળҊ΍ཁ๬͸ແݶʹग़ͯ͘Δ • ݸਓ৘ใΛ༬͔ΔҎ্ϥΠϒϥϦΞοϓσʔτ͸ඞਢ • ༨Ջͱͷ޲͖߹͍ํ͸೔ʑมԽ͢Δ • ڵຯͷํ޲ੑ • ຊۀͰऔΓ૊ΜͰ͍Δ՝୊ • ϥΠϑελΠϧͷมԽ

Slide 32

Slide 32 text

ͻͱΓͰWebαʔϏεΛӡ༻͠ଓ͚Δͷ͸େม • ӡ༻Λଓ͚Δ͜ͱ͸Ͱ͖ͳ͍ͱ൑அ • ଞʹ༨ՋͰ΍Γ͍ͨ͜ͱ͕ग़͖ͯͨ • ສ͕ҰϢʔβʔ਺͕૿͑Δલʹ΍Ίͨํ͕޾ͤͩͱ ࢥͬͨ • ݸਓ৘ใΛऔΒͳ͍αʔϏεͳΒӡ༻ϋʔυϧ͸௿͍ ͔΋ʁ

Slide 33

Slide 33 text

ͻͱͦΕͧΕ ͍ΖΜͳΰʔϧͱ ͍ΖΜͳֶͼ͕͋Δ

Slide 34

Slide 34 text

αʔϏε͕੒ޭ͠ͳͯ͘΋ ֶͼ͸࢒Δ