概要 WebComponentsって何か聞いたことあるけど部品の再利用でしょ?UIライブラリで良くない?って人向けのざっくりまとめ。深いところはあまり書かずにざーっと流して「何となくわかった気になった」感じになってもらえたら良いなと思います。結構長くなる(と思う)ので、気楽に「にゃーん」とか言いながら流し読んでください。 まず試してみたいんだ!という方は「実際に使ってみよう」まで飛んで頂ければと思います。 今までのWebにおける部品再利用のアプローチ WebComponentsという言葉自体位は数年前から小耳に挟むことはありましたが、ここ最近は比較的良く聞く単語になりました。それはそれとして、今までWebにおける部品の再利用はライブラリやフレームワークに依存していました。依存していると言うことは依存しているものに準じる必要があり、そこから別のライブラリやフレームワークに移行するのであれば、
![初心者向けWebComponentsまとめ - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/fed28e340a36927aec355954f919a45ff8d990db/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUU1JTg4JTlEJUU1JUJGJTgzJUU4JTgwJTg1JUU1JTkwJTkxJUUzJTgxJTkxV2ViQ29tcG9uZW50cyVFMyU4MSVCRSVFMyU4MSVBOCVFMyU4MiU4MSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9YTAzNWFkNzQ4MjA3YmExYmViNGM2NmZjMGQ2ZDgzNjM%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBzLXlvc2hpZGEmdHh0LWNvbG9yPSUyMzIxMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTFkMjQyM2RjNDBhMDNhMjM5ZmQyZjZhNzRkNDIyNjg1%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D38bddd60c04f3568ed06f0a9d9f35428)