rabbit-slide-Piro-presentation-vanilla-js-library-topics 2024.5.24.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 9982f56f316f7a4998e095b4951f057dadfe17162265c8d06b098e188dc31ab3
+  data.tar.gz: c781139d3b1e60add64654ae1ca2f9ee5ede7ab33ecf7f1c840f5a3f72650d76
+SHA512:
+  metadata.gz: 341f40a3e3df2f4591aee60d32783275bac06d16f885a4991b00e7c40b15e1daf683185c335cb948b97b48e81e9f62419c0587a30881a8f6eef6c0de5ee7cc98
+  data.tar.gz: 7c92a6f0df619dfeb6857b65a48ce6dabe14c122f190a8b463a65b38ff5acd2f5a654e887ebc929d18e06d8c50e31450c02b4af63f1ac9f6d4475f69734618ec

data/.rabbit

@@ -0,0 +1 @@
+scenario.rab

data/LICENSE

@@ -0,0 +1,11 @@
+CC BY-SA 4.0 International
+
+Copyright 2015-2016 (C) 株式会社クリアコード
+Copyright 2016-2017 (C) Kouhei Sutou <kou@clear-code.com>
+Copyright 2016 (C) Yasunori Goto <ygotopersonal@gmail.com>
+Copyright 2016 (C) TADA, Tadashi <t@tdtds.jp>
+Copyright 2017 (C) Kimiaki Kuno <knokmki612@gmail.com>
+Copyright 2017 (C) Yoichi Nakayama <yoichi.nakayama@gmail.com>
+Copyright 2017 (C) Toshihiko Osawa <tshkh8@gmail.com>
+
+http://creativecommons.org/licenses/by-sa/4.0/

data/README.md

@@ -0,0 +1,23 @@
+# バニラJS開発ライブラリー事情
+
+[Nextbeat Tech Bar：第一回ライブラリ開発について考える会](https://nextbeat.connpass.com/event/312789/)での発表資料です。
+
+## ライセンス
+
+CC BY-SA 4.0
+
+詳細は[LICENSE](./LICENSE)を確認してください。
+
+## スライド
+
+### 表示
+
+```console
+% rake
+```
+
+### 公開
+
+```console
+% rake publish
+```

data/Rakefile

@@ -0,0 +1,28 @@
+require "rabbit/task/slide"
+
+# Edit ./config.yaml to customize meta data
+
+Dir.glob("../{LICENSE,images/**/*.*}") do |shared_file|
+  relative_path = shared_file.gsub(/\A\.\.\//, "")
+  file relative_path => shared_file do
+    mkdir_p(File.dirname(relative_path))
+    cp(shared_file, relative_path)
+  end
+end
+
+spec = nil
+Rabbit::Task::Slide.new do |task|
+  spec = task.spec
+  task.spec.files += ["LICENSE"]
+  task.spec.files += Dir.glob("../images/**/*.*").collect do |path|
+    path.gsub(/\A\.\.\//, "")
+  end
+  # task.spec.files -= Dir.glob("private/**/*.*")
+  task.spec.add_runtime_dependency("rabbit-theme-clear-code")
+end
+
+desc "Tag #{spec.version}"
+task :tag do
+  sh("git", "tag", "-a", spec.version.to_s, "-m", "Publish #{spec.version}")
+  sh("git", "push", "--tags")
+end

data/config.yaml

@@ -0,0 +1,24 @@
+---
+id: presentation-vanilla-js-library-topics
+base_name: scenario
+tags:
+- rabbit
+- oss_gate
+- workshop
+presentation_date: 2024-05-24
+version: 2024.5.24.0
+licenses:
+- CC-BY-SA-4.0
+slideshare_id: 
+speaker_deck_id: 
+ustream_id: 
+vimeo_id: 
+youtube_id: 
+source_code_uri: https://gitlab.com/clear-code/presentation-vanilla-js-library-topics
+author:
+  markup_language: :rd
+  name: YUKI Hiroshi
+  email: yuki@clear-code.com
+  rubygems_user: Piro
+  slideshare_user: 
+  speaker_deck_user: 

data/scenario.rab

@@ -0,0 +1,131 @@
+= バニラJS開発\nライブラリー事情
+
+: theme
+   clear-code
+
+: author
+   結城洋志 aka Piro
+
+: institution
+    株式会社クリアコード
+
+: allotted_time
+    5m
+
+= 活動1：シェルコマンド解説漫画
+
+  # image
+  # src = ./images/systemadmingirl.jpg
+  # relative_width = 40
+
+== プロパティー
+
+: enable-title-on-image
+   false
+
+= 活動2：Firefoxアドオン\nTree Style Tabなど
+
+  # image
+  # src = ./images/tst.png
+  # relative_width = 70
+
+== プロパティー
+
+: enable-title-on-image
+   false
+
+= Firefox\nアドオンを\nバニラJSで
+
+= なんでバニラJS？
+
+(('wait'))昔のFirefoxアドオンは\n
+「動的なパッチ」だった
+
+* (('wait'))Firefox本体のスクリプトの\n
+  名前空間に変数や関数を注入
+* (('wait'))静的解析しにくい
+* (('wait'))下手にライブラリーを使うと\n
+  名前空間汚染でFirefoxが壊れる
+
+= なぜライブラリー自作？
+
+* (('wait'))ニッチすぎて既存の物が無い
+  * Firefoxの内部実装に強く依存
+  * 設定読み書き, UIの多言語対応, etc.
+* (('wait'))既製UIライブラリーは\n
+  自我が強すぎる
+  * メニューUIなど
+  * FirefoxのUI＝ネイティブUIに\n
+    馴染むUIウィジェットが欲しい
+
+= ライブラリーができるまでの流れ
+
+* (('wait'))複数アドオンで共通して\n
+  実現したい機能が出てくる
+* (('wait'))→関数やクラスを\n
+  　単体のファイルに切り出す
+* (('wait'))→README, LICENSEを付けて\n
+  　GitHubで公開
+
+= できるもの
+
+* (('wait'))数十～数百行程度
+* (('wait'))他のライブラリーに非依存
+  * Firefox専用だからpolyfillも不要
+* (('wait'))パッケージマネージャーの\n
+  必要性が薄い
+
+= ていうか……
+
+  # image
+  # src = ./images/lifetime.png
+  # relative_width = 90
+
+早死にされそうで不安
+
+== プロパティー
+
+: enable-title-on-image
+   false
+
+= そんなライブラリーの使い方
+
+* (('wait'))Gitのサブモジュール
+    git submodule add <URL> submodules/<name>
+
+= ビルド・パッケージング時
+
+* (('wait'))Makefileのmale rule中で\n
+  ファイルをコピーするだけ
+    xpi:
+      cp submodules/webextensions-lib-configs/Configs.js extlib/
+      zip -r -9 treestyletab.xpi manifest.json ... extlib
+* (('wait'))コピー後のファイルは\n
+  .gitignore、.eslintignoreで\n
+  除外
+
+= ライブラリーのロード
+
+* (('wait'))<script src="..."> で\n
+  同じ名前空間にロード
+* (('wait'))ES Modulesのimport
+* (('wait'))コピー後に小加工して
+  両対応
+    xpi:
+      cp submodules/webextensions-lib-configs/Configs.js extlib/
+      echo 'export default Configs;' >> extlib/Configs.js
+      ...
+
+= 何が正解なんだろう？
+
+
+= ちなみに、今の\nFirefoxアドオン開発
+
+* Chromiumと同様のモデル\n
+  （WebExtensions）
+  * 名前空間が完全に分離された
+  * ライブラリも安全に読み込める
+  * みんなTypeScriptで書いてる
+
+今さらバニラJSの必要性は皆無\n
+（オチ）

metadata

@@ -0,0 +1,82 @@
+--- !ruby/object:Gem::Specification
+name: rabbit-slide-Piro-presentation-vanilla-js-library-topics
+version: !ruby/object:Gem::Version
+  version: 2024.5.24.0
+platform: ruby
+authors:
+- YUKI Hiroshi
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2024-05-20 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: rabbit
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 2.0.2
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: 2.0.2
+- !ruby/object:Gem::Dependency
+  name: rabbit-theme-clear-code
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description: "[Nextbeat Tech Bar：第一回ライブラリ開発について考える会](https://nextbeat.connpass.com/event/312789/)での発表資料です。"
+email:
+- yuki@clear-code.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".rabbit"
+- LICENSE
+- README.md
+- Rakefile
+- config.yaml
+- images/lifetime.png
+- images/systemadmingirl.jpg
+- images/tst.png
+- pdf/presentation-vanilla-js-library-topics-scenario.pdf
+- scenario.rab
+homepage: https://slide.rabbit-shocker.org/authors/Piro/presentation-vanilla-js-library-topics/
+licenses:
+- CC-BY-SA-4.0
+metadata:
+  source_code_uri: https://gitlab.com/clear-code/presentation-vanilla-js-library-topics
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.3.5
+signing_key: 
+specification_version: 4
+summary: バニラJS開発ライブラリー事情
+test_files: []