Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Why does LINE run the Japanese Bootstrap5 site?

Why does LINE run the Japanese Bootstrap5 site?

Eebedc2ee7ff95ffb9d9102c6d4a065c?s=128

LINE DevDay 2020

November 26, 2020
Tweet

Transcript

  1. None
  2. About me 2014 joined LINE as web director 2018 converted

    to front-end engineer Familiar Vue.js & Bootstrap Favorite Beer & Yokohama F Marinos
  3. Agenda › LINE interacts with front-end OSS › Why does

    LINE run the documentation site? › How to build? › Trade-off › Looking back
  4. LINE interacts with front-end OSS Publicly available source code Front-end

    meetup Front-end podcast Documentation site Contribution to source code etc.
  5. LINE interacts with front-end OSS etc. Publicly available source code

    Front-end meetup Front-end podcast Documentation site Contribution to source code
  6. Bootstrap Japanese site v5.getbootstrap.jp v5.getbootstrap.com

  7. Monthly data Users 40,000 Sessions 100,000 Pageviews 400,000 As of

    2020/09
  8. Search results for “bootstrap”

  9. Agenda › LINE interacts with front-end OSS › Why does

    LINE run the documentation site? › How to build? › Trade-off › Looking back
  10. npm trends “Bootstrap”

  11. Most frequently used CSS frameworks 2018 World 42% 35% https://ashleynolan.co.uk/

    Bootstrap Bootstrap LINE
  12. LINE CSS toolkit

  13. LINE CSS toolkit › Based on Bootstrap4

  14. LINE CSS toolkit › Based on Bootstrap4 › Deployed in

    30+ services
  15. LINE CSS toolkit › Based on Bootstrap4 › Deployed in

    30+ services › Always follow the latest version
  16. Information gathering

  17. Translations

  18. Pull request

  19. Translations

  20. Agenda › LINE interacts with front-end OSS › Why does

    LINE run the documentation site? › How to build? › Trade-off › Looking back
  21. How to build? Plan › Translation schedule

  22. Translation schedule 10 mins × 60 pages ÷ 2 members

  23. Translation schedule 5 hours 10 mins × 60 pages ÷

    2 members
  24. Translation schedule 1 week 5 hours 10 mins × 60

    pages ÷ 2 members
  25. How to build? › Build the site › Translation Do

    Plan › Translation schedule
  26. Build the site Git clone from original repository

  27. Build the site Git clone from original repository Translate markdown

    files
  28. Build the site Git clone from original repository Translate markdown

    files Generate HTML files with Jekyll
  29. Build the site Git clone from original repository Translate markdown

    files Generate HTML files with Jekyll Publish on GitHub pages
  30. Translation

  31. Translation Remains heading in English

  32. Translation Remains heading in English English (日本語)

  33. Translation 10 mins

  34. Translation 30 mins 10 mins

  35. Priority Won't Won't

  36. How to build? › Build the site › Translation Do

    Action › Access analysis › SEO Plan › Translation schedule
  37. Pageview As of 2018/11

  38. Pageview As of 2018/11

  39. Pageview As of 2018/11

  40. Pageview As of 2018/11

  41. Referrer 84% Google search As of 2020/09

  42. Search query

  43. Search query 4.2 4.3

  44. Search query 4.2 4.2 4.3

  45. Search query

  46. 2018/11 2019/1 2020/1 2020/9 User growth 40k

  47. Agenda › LINE interacts with front-end OSS › Why does

    LINE run the documentation site? › How to build? › Trade-off › Looking back
  48. Output first 70 % Completeness

  49. Output first 70 % TTypo ! Completeness

  50. Output first 70 % Typo Completeness

  51. Focus on high priority v4.5 < v5.0

  52. Focus on high priority Big impact or not? v4.5 <

    v5.0
  53. Agenda › LINE interacts with front-end OSS › Why does

    LINE run the documentation site? › How to build? › Trade-off › Looking back
  54. Looking back › Can do everything

  55. Looking back › Can do everything › Get a lot

    of knowledges
  56. Looking back › Can do everything › Get a lot

    of knowledges › Get a lot of good opportunities
  57. Let’s try

  58. Thank you