Frontend Conference Okinawa 2023, 2023/11/18 Ivanova Marina, גࣜձࣾΏΊΈ Ϣʔβʔొ࿥ͱϩάΠϯϑΥʔϜʹ autocompleteଐੑΛ࢖͍·͠ΐ͏ 

ྲྀΕ • autocompleteଐੑͷ঺հ • autocompleteͷ࢖༻ͷྫ • Ϣʔβʔొ࿥ϑΥʔϜͷautocompleteͷ஋ • ϩάΠϯϑΥʔϜͷautocompleteͷ஋ • ·ͱΊ 

autocompleteଐੑͷ঺հ • ϑΥʔϜϑΟʔϧυͷ஋ͷࣗಈิ׬ʹؔͯ͠ϢʔβʔΤʔδΣϯτʹͲͷΑ͏ ͳݖݶ͕͋Δ͔Λࢦఆ • ϑΟʔϧυʹظ଴͞ΕΔ৘ใͷλΠϓʹؔ͢Δϒϥ΢β΁ͷΨΠμϯεΛఏ • ɺɺ<select>ɺ<form>ʹରͯ͠ར༻Մೳ autocompleteͷ஋͸ɺhttps://developer.mozilla.org/ja/docs/Web/HTML/Attributes/ autocomplete Ͱ֬ೝͰ͖Δ 

autocompleteͷ࢖༻ͷྫ • ৽͍͠ΞΧ΢ϯτΛ࡞੒͢Δࡍɺొ࿥͢ΔϢʔβʔωʔϜͱύεϫʔυΛύε ϫʔυϚωδϟʔ (Keychainɺ1PasswordͳͲ) ʹఏڙ͢Δ • ϩάΠϯ͢Δ࣌ʹɺϢʔβʔωʔϜͱύεϫʔυΛࣗಈͰೖྗ͞ΕΔ • ΫϨδοτΧʔυͷ৘ใ͕อଘ͞Ε͍ͯΔ৔߹ɺࢧ෷͍ϑΥʔϜͳͲʹΧʔυ ͷ৘ใΛࣗಈͰೖྗ͞ΕΔ 

Ϣʔβʔొ࿥ϑΥʔϜͷautocompleteͷ஋

Sign up

Email New password Register Account Ϧϙ͸ͪ͜Β: https://github.com/ivanova-marina/autocomplete-sample 

ϩάΠϯϑΥʔϜͷautocompleteͷ஋

Sign in

Email Password Sign in Ϧϙ͸ͪ͜Β: https://github.com/ivanova-marina/autocomplete-sample 

·ͱΊ w BVUPDPNQMFUFͷ঺հͯ͠ɺొ࿥ϑΥʔϜ΍ΫϨδοτΧʔυೖྗϑΥʔϜʹ࢖͑Δ
w ొ࿥͢ΔϢʔβʔωʔϜͱύεϫʔυΛอଘ͞ΕɺϩάΠϯ͢Δ࣌ʹɺϢʔβʔωʔϜͱύεϫʔυ ΛࣗಈͰೖྗ͞ΕΔ
w ొ࿥ϑΥʔϜʹɺϢʔβʔωʔϜʹ
BVUPDPNQMFUFlVTFSOBNFz
ϝʔϧΛొ࿥ͯ͠΋
ɺύεϫʔυ ʹBVUPDPNQMFUFlOFXQBTTXPSEz
Λࢦఆ
w ϩάΠϯϑΥʔϜʹ
ϢʔβʔωʔϜʹ
BVUPDPNQMFUFlVTFSOBNFzɺύεϫʔυʹ BVUPDPNQMFUFlDVSSFOUQBTTXPSE
Λࢦఆͨ͠ΒɺϓεϫʔυϚωʔδϟʔ͔Βਖ਼͘͠औಘࣗ͠ಈ Ͱೖྗ͞ΕΔ 

ࣗݾ঺հ • ϚϦφɾΠϫϊϫ • גࣜձࣾΏΊΈͰϑϩϯτΤϯυΤϯδχΞ ͱͯ͠ॴଐ • ϞεΫϫग़਎ɺژ౎ࡏॅ • ࠷ۙ͸՛ࢠ࡞ΓʹϋϚ͍ͬͯ·͢ @qcapy_frontend @[email protected]