workboxで簡単にオフライン対応しよう_JS祭ver

XPSLCPYͰ؆୯ʹ ΦϑϥΠϯରԠ͠Α͏ ౙͷ+BWB4DSJQUࡇJOϝϯόʔζΩϟϦΞ גࣜձࣾΦʔϓϯετϦʔϜ ஛಺ɹ༎հ

ࣗݾ঺հ ஛಺ɹ༎հ ϓϩάϥϚʔ झຯͰήʔϜ࡞ͬͯ·͢ +4େ޷͖

8&#ΞϓϦ

8&#ͩͱ ΦϑϥΠϯͰԿ΋ Ͱ͖ͳ͍

ͦͷ໰୊ 8PSLCPYͳΒ ղܾͰ͖Δ

ΞδΣϯμ ΦϑϥΠϯΩϟογϡͱ͸ ඪ४ػೳͰΦϑϥΠϯରԠ XPSLCPYͰΦϑϥΠϯΩϟογϡ͢Δ 4FSWJDF8PSLFSߋ৽໰୊ ·ͱΊ

ΦϑϥΠϯΩϟογϡ Ұ౓ಡΈࠐΜͩαΠτΛΦϑϥΠϯঢ়ଶ Ͱ΋ݟΔ͜ͱ͕Ͱ͖Δ࢓૊Έ *&Ҏ֎͸Ͳͷϒϥ΢βͰ΋ରԠࡁΈ

αϯϓϧ IUUQTHCSBWFSCVSTUDPN

ղઆ ࣗ࡞ήʔϜͰ͢ Ұ౓ಡΈࠐΊ͹ɺΦϑϥΠϯͰ΋ϓϨΠՄೳ ෭࣍ޮՌͱͯ͠ɺճ໨Ҏ߱ϩʔυ͕ര଎ ίʔυ͸HJUIVCʹެ։͍ͯ͠·͢ IUUQTHJUIVCDPNLBJEPVKJTUVEZUISFFKT

ඪ४"1*αϯϓϧ XPSLCPYΛ࢖Θͳͯ͘΋ɺ ΦϑϥΠϯΩϟογϡ͸࣮ݱՄೳ αϯϓϧίʔτ͸ҎԼ IUUQTHJUIVCDPNLBJEPVKJDBDIF FYBNQMFCMPCNBTUFSQVCMJDTXKT

Α͘෼͔Βͳ͍Ͱ͢Ͷ

4FSWJDF8PSLFSͱ͸ ϒϥ΢βͱ͸ಠཱͯ͠ଘࡏ͢ΔϓϩάϥϜ ϒϥ΢βλϒΛดͯ͡΋ɺ4FSWJDF8PSLFS ͸ಈ͖ଓ͚Δ

4FSWJF8PSLFSͰग़དྷΔ͜ͱ ΦϑϥΠϯΩϟογϡ 1VTI௨஌ όοΫάϥϯυಉظ

ϒϥ΢β Πϯλʔωοτ

ϒϥ΢β Πϯλʔωοτ 4FSWJDF 8PSLFS $BDIF 4UPSBHF

ඪ४"1*ͷ໰୊ ΩϟογϡɺωοτϫʔΫͷ༏ઌॱҐ͕ ෼͔ΓͮΒ͍ ෆཁͳ΋ͷΛΩϟογϡͯ͠ɺ ༧ظͤ͵ಈ͖Λ͢ΔՄೳੑ͕͋Δ

8PSLCPYͱ͸ ΦϑϥΠϯΩϟογϡൺֱత༻ҙʹ ࣮ݱͰ͖ΔϥΠϒϥϦ ΦϑϥΠϯΩϟογϡͷ σϑΝΫτελϯμʔυ ࢦఆͨ͠ϦΫΤετΛΩϟογϡ͢Δ

ίʔυྫ IUUQTHJUIVCDPNLBJEPVKJTUVEZUISFF KTCMPCNBTUFSTSDKTTXKT ઌ΄Ͳৄࡉͨࣗ͠࡞ήʔϜͷҰ෦

1SF$BDIF 3VOUJNF$BDIF /FUXPSL'JSTU $BDIF'JSTU 4UBMF8IJMF3FWBMJEBUF 8PSL#PYΩϟογϡ ͦͷଞॾʑʜ

4FSWJDF8PSLFSϥΠϑαΠΫϧ */45"-- 8"*5*/( "$5*7"5&

1SF$BDIF */45"--࣌ʹɺҰ౓͚ͩΩϟογϡ͢Δ Ҏ߱͸ৗʹΩϟογϡ͔ΒऔΓଓ͚Δ Ωϟογϡର৅͸ϑϧύεͰࢦఆ͢Δ ඞཁ࠷௿ݶͷIUNMɺKTɺDTTΛ Ωϟογϡ͢ΔͨΊʹ͋Δ

ϒϥ΢β Πϯλʔωοτ 4FSWJDF 8PSLFS $BDIF 4UPSBHF ͣͬͱ͜͜ʂ $BDIFʹηοτ

3VOUJNF$BDIF ϒϥ΢βͷϦΫΤετʹԠͯ͡ɺ ಈతͰΩϟογϡ͢Δ Ωϟογϡର৅͸ਖ਼نදݱͰࢦఆ͢Δ ωοτϫʔΫɺΩϟογϡͷ༏ઌ౓͸ɺ ΩϟογϡઓུʹΑͬͯมΘΔ

/FUXPSL'JSTU جຊతʹωοτϫʔΫ͔Β৘ใΛऔಘ͢Δ ωοτϫʔΫͷϨεϙϯε͕੒ޭͨ͠Βɺ ͦΕΛΩϟογϡʹͭΊΔ ωοτʹͭͳ͕Βͳ͍͚࣌ͩΩϟογϡΛ࢖͏

ϒϥ΢β Πϯλʔωοτ 4FSWJDF 8PSLFS $BDIF 4UPSBHF ୈҰ༏ઌ ͩΊͳΒͬͪ͜ 614&35

$BDIF'JSTU ݪଇͱͯ͠ɺΩϟογϡ͔Β৘ใΛऔಘ͢Δ Ωϟογϡ͕ͳ͍৔߹ɺωοτϫʔΫ͔Β ৘ใΛऔಘ͢Δ ωοτϫʔΫͷϨεϙϯε͕੒ޭͨ͠৔߹ɺ ͦΕΛΩϟογϡʹͭΊΔ Ҏ߱͸ɺωοτϫʔΫͷ৘ใ͕৽͘͠ͳΖ͏͕ɺ ΩϟογϡΛ࢖͍ଓ͚Δ

ϒϥ΢β Πϯλʔωοτ 4FSWJDF 8PSLFS $BDIF 4UPSBHF ͳ͚Ε͹ίον ୈҰ༏ઌ */4&35

4UBMF8IJMF3FWBMJEBUF ݪଇͱͯ͠ɺΩϟογϡ͔Β৘ใΛฦ͢ ಉ࣌ʹωοτϫʔΫΞΫηεΛͯ͠ɺ ৘ใ͕ߋ৽͞Ε͍ͯͨΒΩϟογϡ΋ߋ৽͢Δ /FUXPSL'JSTUɺ$BDIF'JSTUͷ͍͍ͱ͜औΓͷ Πϝʔδ

ϒϥ΢β Πϯλʔωοτ 4FSWJDF 8PSLFS $BDIF 4UPSBHF ୈҰ༏ઌ 614&35 ͳ͚Ε͹ίον

8PSLCPYͰղܾͰ͖ͳ͍໰୊ ෆཁͳΩϟογϡΛ͢Δ໰୊͸ղܾͰ͖ͳ͍ "1*ͷ63-Λࢦఆͨ͠Βɺ໰౴ແ༻Ͱ Ωϟογϡ͞ΕΔ ࡞ΓࠐΈόά͸େ෯ʹݮΔ͕ɺ ઃܭόά͸ফ͑ͳ͍

48ߋ৽໰୊ͱ͸ 4FSWJDF8PSLFSߋ৽ͨ͠ࡍʹɺ ॳճ͸ੲͷ4FSWJDF8PSLFS͕Քಇ͢Δ໰୊ 4FSWJDF8PSLFSશൠͷ໰୊

48ߋ৽໰୊ͷৄࡉ લఏ 4FSWJDF8PSLFSΛొ࿥͍ͯͨ͠ͱ͢Δ 4FSWJDF8PSLFSΛߋ৽ͨ͠ ࣄ৅ ॳճʹҎԼ໰୊͕ൃੜ͢Δ ݹ͍4FSWJDF8PSLFS͕ಈ࡞͢Δ ߋ৽લͷ1SF$BDIF͕දࣔ͞ΕΔ

ओͳղܾํ਑ ڧ੍తʹ"DUJWBUFͤ͞Δ ͳΔ΂͘$BDIFΛ࢖Θͳ͍ 4FSWJDF8PSLFS͕ߋ৽͞ΕͨΒɺ ܯࠂը໘ʹڧ੍తʹભҠͤ͞Δ

ڧ੍తʹ"DUJWBUF ݹ͍4FSWJDF8PSLFS͕Քಇ͍ͯͯ͠΋ɺ ແཧ΍Γ৽͍͠΋ͷʹ੾Γସ͑Δํ๏͸͋Δ ੔߹ੑΛอͭͨΊʹɺϥΠϑαΠΫϧʹ 8"*5*/(͕͋Δ ͦΕΛແࢹ͢Δ৔߹ɺͪΌΜͱઃܭ͠ͳ͍ͱ ഁ୼͢Δ

ͳΔ΂͘$BDIFΛ࢖Θͳ͍ /FUXPSL'JSUΛͳΔ΂͘༻͍Δ $BDIFʹΑΔߴ଎Խ͸ݟࠐΊͳ͍ ݹ͍4FSWJDF8PSLFS͕Քಇ͢Δ໰୊ ͸ղܾͰ͖ͳ͍

POVQEBUFGPVOE ͦΕͬΆ͍ίʔϧόοΫؔ਺͕༻ҙ͞Ε͍ͯΔ 4FSWJDF8PSLFS3FHJTUSBUJPOPOVQEBUFGPVOE ݁࿦͔Βݴ͏ͱ࢖͑ͳ͍ ཧ༝͸ɺ4FSWJDF8PSLFSະొ࿥Ͱ΋ ݺ͹ΕΔ͔Β

4FSWJDF8PSLFSϥΠϑαΠΫϧ */45"-- 8"*5*/( "$5*7"5& ݺ͹ΕΔ ͜͜Ͱ΋ݺ͹ΕΔ

*/45"-- 8"*5*/( "$5*7"5& 0/61%"5&'06/%ൃՐ "$5*7"5&ͳ48͋Γ ϒϥ΢βىಈ࣌ 8"*5*/(ͳ48͋Γ 4FSWJDF8PSLFSߋ৽൑ఆ

"$5*7"5&ͳ48ଘࡏ൑ఆ 4FSWJDF8PSLFS3FHJTUSBUJPOBDUJWF OVMM "$5*7"5&ͳ48͕ͳ͍ OVMMҎ֎ "$5*7"5&ͳ48͕͋Δ

ىಈ࣌൑ఆ͕ඞཁͳཧ༝ ͍͖ͳΓ8"*5*/(͔Β࢝·Δέʔε͕͋Δ͔Β */45"--׬ྃޙʹɺλϒΛด͡ͳ͍ͰҎԼΛ ࣮ߦ͢Δ ৽͍͠λϒΛ։͘ ϒϥ΢βϦϩʔυ͢Δ

*/45"-- 8"*5*/( "$5*7"5& λϒด͡ͳ͍ ৽نλϒ 03 ϒϥ΢βϦϩʔυ

8"*5*/(ͳ48ଘࡏ൑ఆ 4FSWJDF8PSLFS3FHJTUSBUJPOXBJUJOH OVMM 8"*5*/(ͳ48͕ͳ͍ OVMMҎ֎ 8"*5*/(ͳ48͕͋Δ

48ߋ৽൑ఆίʔυྫ IUUQTHJUIVCDPNLBJEPVKJTUVEZUISFF KTCMPCNBTUFSTSDKTBDUJPOTFSWJDF XPSLFSDSFBUFMJTUFOFSKT ྫͷ͝ͱࣗ͘࡞ήʔϜͷҰ෦Ͱ͢ ΞϓϦͷॳظԽ෦෼Ͱݺ͹Ε͍ͯ·͢

·ͱΊ 8PSLCPYͳΒൺֱత༰қʹ ΦϑϥΠϯΩϟογϡΛ࣮૷Ͱ͖Δ ༻్ʹԠͨ͡ΩϟογϡઓུΛબ΅͏ 4FSWJDF8PSLFSߋ৽໰୊ʹ͍ͭͯ΋ ߟ͓͑ͯ͜͏

͝ਗ਼ௌ͋Γ͕ͱ͏ ͍͟͝·ͨ͠

workboxで簡単にオフライン対応しよう_JS祭ver

workboxで簡単にオフライン対応しよう_JS祭ver

More Decks by kaidouji85

Other Decks in Programming

Featured

Transcript