Angularを採用したプロダクトで表記ゆれを撲滅したはなし

Startup Angular #1
Angularを採用しているスタートアップの裏側を徹底公開
LTタイム 3人目
https://voicy.connpass.com/event/220158/

Transcript

1. 表 記 ゆ れ を
   撲 滅 し た は な し
   ⼀ ノ 瀬 翔 吾 ( 友 利 奈 緒 )
   2021.08.27
   

   View Slide

2. ⾃⼰紹介
   atama plus株式会社
   Product Engineer
   ⾃称 CDO (Chief Design System Development Officer)
   Angular歴 4-5年ぐらい
   友利奈緒@rettar5
   2
   ⼀ ノ 瀬 翔 吾
   

   View Slide

3. atama plus
   

   View Slide

4. 教育に、⼈に、社会に、
   次の可能性を。
   教育を新しくすること。それは、社会のまんなかを新しくする
   こと。私たちは学びのあり⽅を進化させます。
   学習を⼀⼈ひとり最適化し、「基礎学⼒」を最短で⾝につける。
   そのぶん増える時間で、「社会でいきる⼒」を伸ばす。
   それが私たちの⽬指すもの。⾃分の⼈⽣を⽣きる⼈を増やし、
   これからの社会をつくっていきます。
   M i s s i o n
   atama plus
   

   View Slide

5. ⓒ 2021 atama plus Inc. 5
   従来の勉強だけではない学びを提供する
   基礎学⼒ いきる⼒
   

   View Slide

6. ⓒ 2021 atama plus Inc.
   atama plusのミッション
   6
   atama plus
   「基礎学⼒」の習得
   「基礎学⼒」の習得 「社会でいきる⼒」の習得
   

   View Slide

7. AI先⽣「atama＋」を
   全国の塾・予備校にSaaSモデルで提供しています。
   atama＋は、⼀⼈ひとりの得意、苦⼿、伸び、
   つまずき、忘却度などの情報を収集・分析して、
   ⼀⼈ひとりに合った「⾃分専⽤カリキュラム」を提供します。
   学習をPersonalize「atama＋」
   

   View Slide

8. ⓒ 2021 atama plus Inc.
   atama plusのプロダクト
   8
   表記ゆれを撲滅したはなし
   Aurora/S3/CloudFront etc
   Hug+Zappa
   AWS Lambda
   Cloud Functions
   オンライン模試 / API server
   contents editor micro service dev tool
   

   View Slide

9. ⓒ 2021 atama plus Inc.
   atama plusのプロダクト
   9
   表記ゆれを撲滅したはなし
   atama plusでは創業(2017年)から
   Angularを採⽤
   

   View Slide

10. 表記ゆれの撲滅
    

    View Slide

11. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    11
    表記ゆれを撲滅したはなし
    表記ゆれの修正を
    コミットしたことありますよね？
    

    View Slide

12. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    12
    表記ゆれを撲滅したはなし
    atama plusにも
    いくつか表記のルールがあります
    

    View Slide

13. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    13
    表記ゆれを撲滅したはなし
    atama＋
    ↑プラスは全⾓
    

    View Slide

14. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    14
    表記ゆれを撲滅したはなし
    atama＋ ID
    ↑プラスは全⾓
    ↑プラスとIDの間は半⾓スペース
    

    View Slide

15. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    15
    表記ゆれを撲滅したはなし
    atama＋ Web版
    ↑プラスは全⾓
    ↑プラスとIDの間は半⾓スペース
    ↑WebはWのみ⼤⽂字
    

    View Slide

16. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    16
    表記ゆれを撲滅したはなし
    既修
    ↑既習ではなく既修
    

    View Slide

17. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    17
    表記ゆれを撲滅したはなし
    つまずき
    ↑「づ」ではなく「ず」
    

    View Slide

18. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    18
    表記ゆれを撲滅したはなし
    社会でいきる⼒
    ↑いきるはひらがな
    

    View Slide

19. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    19
    表記ゆれを撲滅したはなし
    ください
    ↑漢字ではなくひらがな
    

    View Slide

20. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    20
    表記ゆれを撲滅したはなし
    めざす
    ↑漢字ではなくひらがな
    

    View Slide

21. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅
    21
    表記ゆれを撲滅したはなし
    表記ゆれが残ったまま
    プロダクトがリリースされてしまう…！
    

    View Slide

22. 表記ゆれの撲滅の仕組み化
    

    View Slide

23. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    23
    表記ゆれを撲滅したはなし
    huskyとlint-stagedとtextlintを
    組み合わせて
    コミット時に表記ゆれを検知する
    

    View Slide

24. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    24
    表記ゆれを撲滅したはなし
    husky
    gitコマンド実⾏時に
    任意の処理を実⾏できるツール
    

    View Slide

25. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    25
    表記ゆれを撲滅したはなし
    lint-staged
    コミットしようとしているファイルに
    任意の処理を実⾏できるツール
    

    View Slide

26. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    26
    表記ゆれを撲滅したはなし
    textlint
    Markdownやテキストファイルを
    Lintするツール
    

    View Slide

27. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    27
    表記ゆれを撲滅したはなし
    textlintはruleやpluginなど
    組み合わせて⽂章の校正ができる
    

    View Slide

28. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    28
    表記ゆれを撲滅したはなし
    atama＋向けの辞書を作り
    誤った表記を含んでいたら
    正しい表記を教えるルールを実装
    

    View Slide

29. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    29
    表記ゆれを撲滅したはなし
    

    View Slide

30. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    30
    表記ゆれを撲滅したはなし
    

    View Slide

31. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    31
    表記ゆれを撲滅したはなし
    

    View Slide

32. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    32
    表記ゆれを撲滅したはなし
    これで.mdファイルの
    表記ゆれは撲滅完了！
    

    View Slide

33. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    33
    表記ゆれを撲滅したはなし
    表記ゆれを撲滅したいのは
    ⽣徒や先⽣が使うプロダクト
    

    View Slide

34. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    34
    表記ゆれを撲滅したはなし
    textlint単体では.htmlファイルが
    チェックできないので
    textlint-plugin-html
    を追加する
    

    View Slide

35. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    35
    表記ゆれを撲滅したはなし
    

    View Slide

36. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    36
    表記ゆれを撲滅したはなし
    

    View Slide

37. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    37
    表記ゆれを撲滅したはなし
    これで.htmlファイルの
    表記ゆれは撲滅完了！
    

    View Slide

38. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    38
    表記ゆれを撲滅したはなし
    .tsファイルでも
    表記ゆれ発⽣しますよね…？
    

    View Slide

39. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    39
    表記ゆれを撲滅したはなし
    プラグインが存在しないので
    .js / .tsファイルのプラグイン
    textlint-plugin-babel-parser
    を実装しました
    

    View Slide

40. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    40
    表記ゆれを撲滅したはなし
    

    View Slide

41. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    41
    表記ゆれを撲滅したはなし
    

    View Slide

42. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    42
    表記ゆれを撲滅したはなし
    これで.tsファイルの
    表記ゆれも撲滅完了！
    

    View Slide

43. ⓒ 2021 atama plus Inc.
    表記ゆれの撲滅の仕組み化
    43
    表記ゆれを撲滅したはなし
    表記ゆれが残ったまま
    プロダクトがリリースされなくなった！
    

    View Slide

44. 告知
    

    View Slide

45. ⓒ 2021 atama plus Inc.
    告知
    45
    表記ゆれを撲滅したはなし
    https://atama-plus.connpass.com/event/219479/
    

    View Slide

46. © atama plus Inc.
    atama plusは、Mission driven company.
    ミッションの実現に向けて、常識にとらわれずに考え、議論し、
    互いを尊重しながら楽しむ集団です。
    ⼈が全てなので、採⽤にはとてもとてもこだわってきました。
    開発チームはもとより、ビジネスチームもコーポレートチームも、
    全員で良いプロダクトを創る。
    ⼀つの⼤きなチームとして意⾒をぶつけあいながら
    ⽣徒が熱狂する学びを創っていく。
    そんな想いの船に⼀緒に乗って、
    新しい教育を創り、社会を変えていく仲間を募集しています。
    We are hiring !
    参考リンク
    3 分 で わ か る
    a t a m a
    p l u s
    求 ⼈ ⼀ 覧
    

    View Slide