Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
ϑϩϯτΤϯυ։ൃʹtextlin t Λಋೖͯ͠ӡ༻͍ͯ͠Δ 2021.07.13 Tue. SaaSϓϩμΫτͷϑϩϯτΤϯυ࠷લઢ@ΦϯϥΠϯ @diescake SmartHR ϓϩμΫτΤϯδχΞ
Slide 2
Slide 2 text
ۙ౻ େհ SmartHR ϓϩμΫτΤϯδχΞ ʗௐνʔϜʗओʹWebϑϩϯτΤϯυʢReact + TypeScriptʣ ● 20201݄SmartHRೖࣾ ● SmartHRௐνʔϜΛॅॲʹͯ͠ɺ2020ͷௐ ͷཧը໘ϦχϡʔΞϧ͔Β࢟Λݱ͢ ● ΫϥϑτϏʔϧΛϙνͬͯྫྷଂݿʹੵΉशੑΛ࣋ͭ @diescake
Slide 3
Slide 3 text
No content
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
ܦҢɾϞνϕʔγϣϯ
Slide 6
Slide 6 text
SmartHRͷ։ൃάϧʔϓɺ ϑΟʔνϟʔνʔϜߏΛܝ͛ɺ ΫϩεϑΝϯΫγϣφϧԽͷऔΓΈΛਐΊ͍ͯ·͢
Slide 7
Slide 7 text
SmartHRຊମ։ൃͷϑΟʔνϟʔνʔϜʢLeSSʣ σβΠϯ ΤϯδχΞϦϯά QA ϓϩμΫτϚωδϝϯτ UXϥΠςΟϯά ΧελϚʔαϙʔτ ਓࣄDB͍͖ͬͯνʔϜ ࿈ܞ͍͖ͬͯνʔϜ ڊେاۀαΫηενʔϜ ैۀһαΫηενʔϜ ࿈ܞ͍͖ͬͯνʔϜ
Slide 8
Slide 8 text
SmartHRຊମ։ൃͷϑΟʔνϟʔνʔϜʢLeSSʣ
Slide 9
Slide 9 text
ΫϩεϑΝϯΫγϣφϧԽͷҰͰ จݴʢUXϥΠςΟϯάʣͱ͖߹͍࢝Ίͨdiescake Ͱ͕͋ͬͨ…
Slide 10
Slide 10 text
ΫϩεϑΝϯΫγϣφϧԽͷҰͰ จݴʢUXϥΠςΟϯάʣͱ͖߹͍࢝Ίͨdiescake Ͱ͕͋ͬͨ…
Slide 11
Slide 11 text
ΫϩεϑΝϯΫγϣφϧԽͷҰͰ จݴʢUXϥΠςΟϯάʣͱ͖߹͍࢝Ίͨdiescake Ͱ͕͋ͬͨ…
Slide 12
Slide 12 text
ΫϩεϑΝϯΫγϣφϧԽͷҰͰ จݴʢUXϥΠςΟϯάʣͱ͖߹͍࢝Ίͨdiescake Ͱ͕͋ͬͨ…
Slide 13
Slide 13 text
ΫϩεϑΝϯΫγϣφϧԽͷҰͰ จݴʢUXϥΠςΟϯάʣͱ͖߹͍࢝Ίͨdiescake Ͱ͕͋ͬͨ… ʻ ѱ͍ ͬͺͭΕ͐Θ…
Slide 14
Slide 14 text
- ୯७ͳදه༳ΕɾϧʔϧʹىҼ͢ΔෆඋΛҰ͍ͨ͠ - PRͰSuggested changes͕ඈͼަ͏ - ݸʑ୯ޠͷදهΛ͖֮͑Εͳ͍ - SmartHRͷจݴΨΠυϥΠϯࡦఆҎલͷจݴ͋Θ͍ͤͨ - ਓ͕ؒຊʹΉ͖ʹྗ͍ͨ͠ Ϟνϕʔγϣϯɾղܾ͍ͨ͠՝
Slide 15
Slide 15 text
- ୯७ͳදه༳ΕɾϧʔϧʹىҼ͢ΔෆඋΛҰ͍ͨ͠ - PRͰSuggested changes͕ඈͼަ͏ - ݸʑ୯ޠͷදهΛ͖֮͑Εͳ͍ - SmartHRͷจݴΨΠυϥΠϯࡦఆҎલͷจݴ͋Θ͍ͤͨ - ਓ͕ؒຊʹΉ͖ʹྗ͍ͨ͠ Ϟνϕʔγϣϯɾղܾ͍ͨ͠՝ ʻ ͪΌΜͱݴ͑ͨ͡ΌͶ͔͑
Slide 16
Slide 16 text
textlintͱʁ
Slide 17
Slide 17 text
- ࣗવݴޠʹର͢Δ੩తνΣοΫπʔϧʢlinterʣ - σϑΥϧτͰplain textɾMarkdownΛαϙʔτ - ϧʔϧɾରϑΝΠϧछผΛϥΠϒϥϦͰ֦ுՄೳ - GitHub্ʹ200Ҏ্ͷϧʔϧ͕ެ։͞Ε͍ͯΔ - author: @azu_re͞Μ textlintͱʁ
Slide 18
Slide 18 text
textlint͕ݒ໋ʹಇ͍͍ͯΔ༷ࢠ
Slide 19
Slide 19 text
textlintͱϧʔϧɾϓϥάΠϯͱͷؔ 🔌 ϓϥάΠϯ - ରϑΝΠϧΛՃʢparser࣮ʣ - ϥΠϒϥϦ໊ textlint-plugin-* ✅ ϧʔϧ - จݴʹର͢ΔϧʔϧΛՃ - ϥΠϒϥϦ໊ textlint-rule-* textlintຊମ - plain text parser - Markdown parser ઃఆϑΝΠϧͰ Πϯϙʔτ ઃఆϑΝΠϧͰ Πϯϙʔτ
Slide 20
Slide 20 text
textlintͱϧʔϧɾϓϥάΠϯͱͷؔʢReal-worldʣ textlintຊମ - plain text parser - Markdown parser ✅ ϧʔϧAɿ textlint-rule-hoge ઃఆϑΝΠϧͰ Πϯϙʔτ ✅ ϧʔϧBɿ textlint-rule-foo ✅ ϧʔϧCɿ textlint-rule-piyo ✅ ϧʔϧDɿ textlint-rule-buz … 🔌 ϓϥάΠϯAɿ textlint-plugin-waga 🔌 ϓϥάΠϯBɿ textlint-plugin-hai 🔌 ϓϥάΠϯCɿ textlint-plugin-neko 🔌 ϓϥάΠϯDɿ textlint-plugin-dayo … … …
Slide 21
Slide 21 text
textlintͱϧʔϧɾϓϥάΠϯͱͷؔʢReal-worldʣ textlintຊମ - plain text parser - Markdown parser ✅ ϧʔϧAɿ textlint-rule-hoge ઃఆϑΝΠϧͰ Πϯϙʔτ ✅ ϧʔϧBɿ textlint-rule-foo ✅ ϧʔϧCɿ textlint-rule-piyo ✅ ϧʔϧDɿ textlint-rule-buz … 🔌 ϓϥάΠϯAɿ textlint-plugin-waga 🔌 ϓϥάΠϯBɿ textlint-plugin-hai 🔌 ϓϥάΠϯCɿ textlint-plugin-neko 🔌 ϓϥάΠϯDɿ textlint-plugin-dayo … … …
Slide 22
Slide 22 text
textlint-rule-preset-smarthr 🎉🎉 - kufu/textlint-rule-preset-smarthr - textlint-rule-preset-smarthr
Slide 23
Slide 23 text
textlintͱϧʔϧɾϓϥάΠϯͱͷؔʢReal-worldʣ textlintຊମ - plain text parser - Markdown parser ઃఆϑΝΠϧͰ Πϯϙʔτ ✅ ϧʔϧηοτɿ textlint-rule-preset-smarthr 🔌 ϓϥάΠϯAɿ textlint-plugin-waga 🔌 ϓϥάΠϯBɿ textlint-plugin-hai 🔌 ϓϥάΠϯCɿ textlint-plugin-neko 🔌 ϓϥάΠϯDɿ textlint-plugin-dayo … … 🤗
Slide 24
Slide 24 text
- SmartHRͷจݴΨΠυϥΠϯʹ४ڌͨ͠ϧʔϧΛ·ͱΊͨϓ Ϧηοτ - textlintΛಋೖ͢ΔϓϩμΫτଆͰݸʑͷϧʔϧΛҙࣝͤͣ textlint-rule-preset-smarthrΛΠϯϙʔτ͢ΕΑ͍ - ৳ͼ͠Ζʹຬͪ͋;Ε͍ͯ·͢😌 textlint-rule-preset-smarthrͱʁ
Slide 25
Slide 25 text
- textlint-rule-ja-no-redundant-expression - ʮ͢Δ͜ͱ͕Ͱ͖Δʯ➔ʮͰ͖ΔʯͷΑ͏ʹɺͳ͍͍ͯ͘ɾͳ͍΄͏͕ ಡΈ͍͢දݱΛݕग़͢Δ - textlint-rule-preset-ja-spacing - ӳޠɾຊޠؒͷεϖʔε༗ແΛݕग़͢Δ - SmartHRͷจݴΨΠυϥΠϯͰɺ֯ӳࣈͱຊޠͷؒʹεϖʔε ΛೖΕͳ͍ϧʔϧΛ࠾༻͍ͯ͠Δ - textlint-rule-ja-hiragana-keishikimeishi - ͻΒ͕ͳͰදهͨ͠΄͏͕ಡΈ͍͢ܗ໊ࣜࢺΛݕग़͢Δ - ex.) ໌Δ͜ͱɺ໌Δࣄ ✅ ࠾༻͍ͯ͠Δදతͳϧʔϧ
Slide 26
Slide 26 text
- textlint-rule-prh - ࣙॻΛ࣋ͪɺ୯ޠͷظΛొ͢Δ͜ͱͰΏΒ͗Λݕग़͢Δ - ਖ਼نදݱʹΑΔ୯ޠొΛαϙʔτ ✅ ࠾༻͍ͯ͠Δදతͳϧʔϧ
Slide 27
Slide 27 text
✅ ࠾༻͍ͯ͠Δදతͳϧʔϧ - textlint-rule-prh - ࣙॻΛ࣋ͪɺ୯ޠදهͷΏΒ͗Λݕग़͢Δ - ਖ਼نදݱʹΑΔ୯ޠొΛαϙʔτ
Slide 28
Slide 28 text
textlintΛ ϓϩμΫτʹಋೖ͢Δ
Slide 29
Slide 29 text
ʢ࠶ܝʣtextlintͱϧʔϧɾϓϥάΠϯͱͷؔʢReal-worldʣ textlintຊମ - plain text parser - Markdown parser ઃఆϑΝΠϧͰ Πϯϙʔτ ✅ ϧʔϧηοτɿ textlint-rule-preset-smarthr 🔌 ϓϥάΠϯAɿ textlint-plugin-waga 🔌 ϓϥάΠϯBɿ textlint-plugin-hai 🔌 ϓϥάΠϯCɿ textlint-plugin-neko 🔌 ϓϥάΠϯDɿ textlint-plugin-dayo … …
Slide 30
Slide 30 text
textlintͱϓϩμΫτͱͷؔ ✅ ϧʔϧηοτɿ textlint-rule-preset-smarthr 🔌 ϓϥάΠϯAɿ textlint-plugin-waga 🔌 ϓϥάΠϯBɿ textlint-plugin-hai 🔌 ϓϥάΠϯCɿ textlint-plugin-neko 🔌 ϓϥάΠϯDɿ textlint-plugin-dayo … … textlintຊମ package.json ϓϩμΫτʢΣϒϑϩϯτΤϯυɾSlackbotɾChrome Extension ͳͲʣ
Slide 31
Slide 31 text
- textlintຊମɾϧʔϧɾϓϥάΠϯྨΛΠϯετʔϧ - ৄ͘͠ɺެࣜυΩϡϝϯτࢀর
Slide 32
Slide 32 text
- textlintͷରϑΝΠϧʹϑϩϯτΤϯυͷιʔείʔυΛՃ ͢Δʢ*.js, *.ts, *.jsx, *.tsxʣ - ϓϥάΠϯ໊ͦ͜jsxͰ͋Δ͕ɺೖྗϑΝΠϧΛtypescriptͷ parserΛར༻ͯ͠ASTʹม͍ͯ͠ΔͷͰTypeScriptαϙʔτ 🔌 textlint-plugin-jsx
Slide 33
Slide 33 text
- textlintͷઃఆϑΝΠϧʹΤϥʔΛڐ༰͢ΔจݴΛՃͰ͖Δ - ਖ਼نදݱͷهड़͕Մೳ - 💡 ಋೖɾӡ༻ͷཁʢޙड़ʣ ✅ textlint-filter-rule-allowlist
Slide 34
Slide 34 text
https://textlint.github.io/docs/configuring.htmlΑΓҾ༻ ⚙ textlintͷઃఆϑΝΠϧΛهड़͢Δ
Slide 35
Slide 35 text
- ઃఆϑΝΠϧ.textlintrcਪͱ͞Ε͍ͯΔ͕.textlintrc.ymlΛ࠾ ༻ͨ͠ - 👍 ֦ுࢠ͕໌ࣔ͞Ε͍ͯΔͱsyntax highlightinglintingɺΦʔ τϑΥʔϚοτ͕ޮ͘ʢେࣄʣ - 👍 YAMLίϝϯτ͕ॻ͚Δʢେࣄʣ ⚙ textlintͷઃఆϑΝΠϧΛهड़͢Δ
Slide 36
Slide 36 text
- Πϯετʔϧͨ͠ϧʔϧͱϓϥάΠϯΛ༗ޮԽ - ৄ͘͠ɺެࣜυΩϡϝϯτࢀর .textlintrc.ymlͷૉͳઃఆ
Slide 37
Slide 37 text
textlintΛ ϓϩμΫτ։ൃͰӡ༻͢Δ
Slide 38
Slide 38 text
≒ textlintΛCIʹࡌͤΔ͜ͱ
Slide 39
Slide 39 text
➔ textlintΛ௨͍ͨ͠…ʂ
Slide 40
Slide 40 text
- textlintΛطଘϓϩμΫτʹಋೖͨ͠ޙେྔͷΤϥʔ͕Ͱ Δͣ 🐛🐛🐛 - ϧʔϧΛ؇ΊͨΓରϑΝΠϧΛݶఆͯ͠Α͍ͷͰɺCIʹࡌ ͤͯάϦʔϯʹͳΔ͜ͱΛඪʹͯ͠मਖ਼͍ͯ͘͠ - CIͰtextlint͕௨ΔڥΛ࡞͔ͬͯΒɺஈ֊తʹ͍͛ͯ͘ - small startͰfalse-negativeͳӡ༻͕େࣄ 💪 textlintΛ௨͍ͨ͠…ʂ
Slide 41
Slide 41 text
- ϧʔϧηοτͷΠϯϙʔτଆͰɺ෦తʹϧʔϧΛΦʔόʔϥΠυͰ͖Δ - ແޮԽͨ͠ཧ༝Λίϝϯτͱ͓ͯͯ͘͠͠ͱهԱࣦʹͳͬͯେৎ textlint-rule-preset-smarthrͷҰ෦ͷϧʔϧΛແޮԽ
Slide 42
Slide 42 text
- ςετίʔυϞοΫͷμϛʔσʔλ͕ΤϥʔʹͳΔ߹ আ֎͓ͯ͘͠ɺΈ͍ͨͳ͍ํ͕Ͱ͖Δ .textlintignoreͰରσΟϨΫτϦɾϑΝΠϧΛݶఆ͢Δ
Slide 43
Slide 43 text
- ͋Γ;Εͨํ๏Ͱ͋Δ͕୭ͷʹΘ͔Γ͘͢༗ޮ npm scriptsͰରσΟϨΫτϦɾϑΝΠϧΛݶఆ͢Δ
Slide 44
Slide 44 text
- ϧʔϧҧͱͳΔݻ༗໊ࢺΛొͯ͠ΤϥʔΛճආ - textlintͷϧʔϧෆඋʹΑΔΤϥʔҰ࣌తͳΤϥʔճආͱͯ͠׆༻Ͱ͖Δ allowlistʹ୯ޠΛొͯ͠Τϥʔճආ
Slide 45
Slide 45 text
No content
Slide 46
Slide 46 text
ࠔͬͨΒallowlist 😌
Slide 47
Slide 47 text
- ࣗવݴޠΛѻ͏ͨΊɺ༧ظͤ͵ޡݕ͕ൃੜ͍͢͠ - ͔͠͠ɺڞ௨ϧʔϧηοτͷमਖ਼➔ϦϦʔεʹϦʔυλΠ Ϝ͕͔͔Δ - ޡݕ͞ΕͨจݴallowlistʹՃ͢Δ͜ͱͰCIͷάϦʔϯ ΛΩʔϓͯ͠࡞ۀΛܧଓͰ͖Δ - ֤ϦϙδτϦͷallowlistΛࢹ͢Δͱϧʔϧͷ͕ूΊ ΒΕͦ͏ 💡 textlintͷϧʔϧޡݕճආͷͨΊͷallowlist
Slide 48
Slide 48 text
VSCode࿈ܞ
Slide 49
Slide 49 text
VSCode্Ͱtextlint͕ϦΞϧλΠϜʹ࣮ߦ͞Ε͍ͯΔ༷ࢠ
Slide 50
Slide 50 text
- taichi.vscode-textlintΛΠϯετʔϧ͢Δ - VSCodeͷઃఆʢsettings.jsonʣʹvscode-textlintͷରͱ͢Δ ݴޠΛՃ͢Δ - σϑΥϧτͰ*.js, *.jsx, *.ts, *.tsxରʹͳΒͳ͍ VSCode Extensionͷvscode-textlintΛΠϯετʔϧ
Slide 51
Slide 51 text
ৼΓฦͬͯΈΔ
Slide 52
Slide 52 text
- ୯७ͳදه༳ΕɾϧʔϧʹىҼ͢ΔෆඋΛҰ͍ͨ͠ - PRͰSuggested changes͕ඈͼަ͏ - ݸʑ୯ޠͷදهΛ͖֮͑Εͳ͍ - SmartHRͷจݴΨΠυϥΠϯࡦఆҎલͷจݴ͋Θ͍ͤͨ - ਓ͕ؒຊʹΉ͖ʹྗ͍ͨ͠ ʢ࠶ܝʣϞνϕʔγϣϯɾղܾ͍ͨ͠՝
Slide 53
Slide 53 text
- ୯७ͳදه༳ΕɾϧʔϧʹىҼ͢ΔෆඋΛҰ͍ͨ͠ - PRͰSuggested changes͕ඈͼަ͏ - ݸʑ୯ޠͷදهΛ͖֮͑Εͳ͍ - SmartHRͷจݴΨΠυϥΠϯࡦఆҎલͷจݴ͋Θ͍ͤͨ - ਓ͕ؒຊʹΉ͖ʹྗ͍ͨ͠ ʢ࠶ܝʣϞνϕʔγϣϯɾղܾ͍ͨ͠՝ ׂͱLGTM 🎉🎉
Slide 54
Slide 54 text
- ୯७ͳදه༳ΕɾϧʔϧʹىҼ͢ΔෆඋΛҰ͍ͨ͠ - PRͰSuggested changes͕ඈͼަ͏ - ݸʑ୯ޠͷදهΛ͖֮͑Εͳ͍ - SmartHRͷจݴΨΠυϥΠϯࡦఆҎલͷจݴ͋Θ͍ͤͨ - ਓ͕ؒຊʹΉ͖ʹྗ͍ͨ͠ ʢ࠶ܝʣϞνϕʔγϣϯɾղܾ͍ͨ͠՝ ʻ ΦϨ ͷ͜ͱ͖ͩΘ
Slide 55
Slide 55 text
- ׂΕ૭Λ࡞Βͳ͍ܧଓతͳӡ༻ - ΧδϡΞϧʹallowlistʹಥͬࠐΉӡ༻ͰेޮՌಘΒΕ Δ - จݴΨΠυϥΠϯͷϧʔϧΛεϜʔζʹϓϩμΫτʹө͞ ͤΔͨΊͷ࡞Γ - ΦϯϘʔσΟϯάίετͷݮ - ਫ਼ਆӴੜͷ্ 🤗 👍 Α͔ͬͨ͜ͱɾ࣮ݱͰ͖ͨ͜ͱ
Slide 56
Slide 56 text
- ϧʔϧΛ֦ॆͤͯ͞ɺจݴΨΠυϥΠϯͷΧόϨοδΛ্͢ Δ - จݴΛ࣋ͭͷϑϩϯτΤϯυͷιʔείʔυ͚ͩͰͳ͍ ʢ*.rb, *.erb ʣ - ϑΝΠϧʹରԠ͢Δtextlint pluginͷ࣮͕ඞཁʹͳΔ - จݴΨΠυϥΠϯ͔ΒtextlintͷϧʔϧΛߋ৽͢Δϑϩʔͷඋ - ޡݕͱͳͬͨ୯ޠɾεςʔτϝϯτͷࠜຊղܾ 🤔 ՝ɾ͍͖͍ͬͯͨ͜ͱ
Slide 57
Slide 57 text
- ࠓճɺϓϩμΫτͷϑϩϯτΤϯυʹϑΥʔΧεͨ͠Λ ͕ͨ͠ɺαϙʔταΠτɺΦϯυϝσΟΞͳͲϢʔβͱ ͷλονϙΠϯτͨ͘͞Μ͋Δ - ଞ৬ೳͷϝϯόʔΛר͖ࠐΈͳ͕ΒɺΫϩεϑΝϯΫγϣφ ϧʹ׆༻ͷ෯͍͖͍͛ͯͨ…ʂ 🤔 ՝ɾ͍͖͍ͬͯͨ͜ͱ
Slide 58
Slide 58 text
https://hello-world.smarthr.co.jp/ ϑϩϯτΤϯυΤϯδχΞੵۃ࠾༻த…ʂʂ 🙏