TwitterのList編集しやすいやつ作った

Transcript

1. 5XJUUFSͷ-JTUฤू͠
   ΍͍͢΍ͭ࡞ͬͨ
   !SZPOFYU
   

   View Slide

2. ࣗݾ঺հ
   w !SZPOFYU
   w ήʔϚʔܥΤϯδχΞ
   w ࠷ۙ͸07&38"5$)΍ͬͯ·͢
   

   View Slide

3. ࡞ͬͨ΋ͷ
   w 5XJUUFSͷϦετΛ੔ཧ͠΍͍͢πʔϧ
   w ͜͜ͰՔಇத
   w IUUQTUXJUUFSMJTUFEJUPSIFSPLVBQQDPN
   w ιʔε
   w IUUQTHJUIVCDPNSZPOFYU
   UXJUUFS@MJTU@FEJUPS
   

   View Slide

4. ը໘
   

   View Slide

5. ͳ͔ͥͭͬͨ͘
   w ެࣜͷϖʔδͰϦετͷ௥Ճɾ࡟আ͢Δͷ͸ݫ
   ͔ͬͨ͠
   

   View Slide

6. ਓΛݸผʹબΜͰϦετ௥Ճ
   w ϛϡʔτ΍ϒϩοΫ͕ۙ͘ʹ͋ͬͯ͜Θ͍
   

   View Slide

7. Ϧετͷϖʔδ͔Β͸ਓΛ
   ௥ՃͰ͖ͳ͍
   

   View Slide

8. ྨࣅͷαʔϏε
   w IUUQUXJUMJTUNBOBHFSDPN
   

   View Slide

9. ͜͏͍͏ը໘
   

   View Slide

10. ໰୊఺
    w ϔομʔ͕͍ͭͯ͜ͳ͍ͷͰͲͷϦετͳͷ͔ɺ
    ը໘ʹऩ·Βͳ͍ൣғͰ͸Θ͔Γʹ͍͘
    

    View Slide

11. ໰୊఺
    w 4BWFԡ͠๨ΕΔ
    w ✅Λมߋͨ͠Βଈ൓өͯ͠ཉ͔ͬͨ͠
    

    View Slide

12. ͦΕΛ౿·͑ͯ͜͏͍͏ϨΠΞ
    ΢τʹ
    w ΞΧ΢ϯτ͝ͱʹϦετ΁ͷ௥Ճঢ়ଶ͕Θ͔Δ
    w ✅Λมߋͨ͠Β͙͢ʹ൓ө͢Δ
    

    View Slide

13. ࢖ٕͬͨज़
    w 3BJMT
    w UXJUUFS IUUQTHJUIVCDPNTGFSJLUXJUUFS
    
    w UXJUUFSPBVUI IUUQTHJUIVCDPN
    NPPNFSNBOUXJUUFS@PBVUI
    
    w 7VFKT
    

    View Slide

14. UXJUUFSͱUXJUUFSPBVUIΛ྆ํ
    ࢖͍ͬͯΔཧ༝
    w UXJUUFS (FN
    ͸ɺαϯϓϧίʔυ΍ϦϑΝϨϯεΛ
    ݟͨײ͡ɺ͢ͰʹϢʔβͷΞΫηετʔΫϯ͕͋Δ
    ঢ়ଶͰ5XJUUFS"1*ʹϦΫΤετΛ͢Δ΋ͷͩͬͨ
    w $POTVNFSLFZTFDSFU͚ͩ͋ͬͯɺ5XJUUFSʹೝ
    ূΛ౤͛ͯίʔϧόοΫΛड͚औͬͯΞΫηετʔ
    ΫϯΛऔಘ͢Δɺͱ͍͏͜ͱ͕Ͱ͖ͳͦ͞͏ͩͬͨ
    w ͦ͜ΛຒΊΔͨΊʹ࢖ͬͨͷ͕UXJUUFSPBVUI
    

    View Slide

15. ࡞͍ͬͯͯͭΒ͔ͬͨͱ͜Ζ
    w ࣗ෼ͷϑΥϩʔͯ͠Δਓશ෦Λऔಘ͢Δ
    w ࣗ෼ͷ͍࣋ͬͯΔϦετΛશ෦औಘ͢Δ
    w ࣗ෼ͷ͢΂ͯͷϦετͷϝϯόʔΛશ෦औಘ͢Δ
    w "1*ͷίʔϧ਺͕ଟ͍ͷͰ3BUF-JNJUΛ৯Β͍΍
    ͍͢
    

    View Slide

16. ϑΥϩʔͯ͠ΔਓɺϦετͷ
    ࿩
    w ී௨ʹ΍Δͱ͔݅ͣͭ͠औΕͳ͍
    w ͔ͭɺϥΠϒϥϦͷݺͼग़͠ํΛ޻෉͠ͳ͍ͱ
    Ұؾʹશ݅औಘͯ͠͠·͏
    w ෼Ҏ಺ʹճҎ্ݺͿͱ3BUF-JNJU
    

    View Slide

17. w 5XJUUFSͷ(FNΛ࢖ͬͯ'PMMPXͨ͠ਓͷҰཡΛऔ
    Ζ͏ͱͨ͠ΒͪΐͬͱϋϚͬͨ݅2JJUBIUUQ
    RJJUBDPNSZPOFYUJUFNT
    EDG
    w ͜͜ʹ·ͱΊͨͷͰ͕͢ɺ݅·ͰऔಘͰ͖Δ
    ͷͰ݅औͬͯ௥Ճ෼͸ಡΈࠐΉํ޲ͰରԠɻ
    w ϑΥϩʔͯ͠Δਓ͕௒ଟ͍ͱͲ͏͠Α͏΋ͳ͍
    

    View Slide

18. ϝϯόʔͷ࿩
    w 3BJMTଆͰϦετͷϝϯόʔΛऔಘ͢Δ"1*Λ࡞੒
    1 class MembersController < ApplicationController
    …
    4 def index
    5 member_id_lists = twitter.list_members(list_id: params[:list_id], owner_id:
    params[:owner_id], count: 200).map {|m| m.to_h[:id_str] }
    6 render json: member_id_lists
    7 end
    …
    24 end
    

    View Slide

19. w +4ଆͰϦετͷ਺͚ͩϧʔϓΛճͯ͠ɺ7VFKTͷ
    EBUBͱͯ࣋ͭ͠
    14 fetchMembers: (list) ->
    15 this.$http(
    16 method: "GET"
    17 url: "/members?list_id=#{list.list.id_str}
    &owner_id=#{this.currentUserId}"
    18 headers:
    19 "X-CSRF-Token": $('meta[name="csrf-token"]').attr('content')
    20 ).then( (response) ->
    21 list.members = response.data
    22 ).catch( (err) ->
    23 alert("error")
    24 ).finally( ->
    25 list.completed = true
    26 )
    

    View Slide

20. w ϝϯόʔ͔Ͳ͏͔ͷ൑ఆ͸୯७ʹ+BWBTDSJQUͷॲཧ͚ͩͰߦ͍ɺ"1*ϦΫΤετΛൃੜͤ͞ͳ͍Α͏ʹ͢Δ
    w ϑΥϩʔͯ͠Δਓ݅Λ௥ՃͰಡΈࠐΜͰ΋7VFͷ഑ྻʹಥͬࠐΊ͹൑ఆͯ͘͠ΕΔ
    w "1*ͷϦΫΤετ਺͸ɺϑΥϩʔͯ͠ΔਓΛऔΔ
    ࣗ෼ͷϦετશ෦ΛऔΔ
    Ϧετͷ਺͚ͩϝϯόʔ
    ΛऔΔ O
    ʹ཈͑ΒΕΔɻ
    10 computed:
    11 checked: ->
    12 this.members.includes(this.user.id_str)
    

    View Slide

21. ·ͱΊ
    w շదʹϦετૢ࡞Ͱ͖ΔΑ͏ʹͳΓ·ͨ͠
    w ֎෦"1*ୟ͘ͱ͖͸ϦΫΤετ਺ΛݮΒ͢Α͏ʹ
    ޻෉͢Δͷ௒ॏཁ
    

    View Slide