1
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

WEB制作最新技術まとめ

Last updated at Posted at 2021-05-27

WEB制作でモダーンなホームページ制作を目指して、
いろんなライブラリーを使ってみました。
せっかくなのでその感想と今後使ってみたいライブラリの紹介をしたいと思います。

最近マスターした技術:

  1. アニメーション(SVGやDOMなど割となんでも)
    https://greensock.com/gsap/
    :clap_tone2: パフォーマンス!なんでもできる
    :thumbsdown_tone2: 慣れるまで時間かかる、覚えないといけないことが多いい

  2. 慣性スクロール
    https://locomotivemtl.github.io/locomotive-scroll/
    :clap_tone2: パフォーマンス!カスタマイズ性が高い。
    :thumbsdown_tone2: ピードやラープなどの設定が可能ですが、ブラウザーによってスUXが大きく変わります。チェックしながら調整しないといけない。

  3. 非同期画面遷移 : https://barba.js.org/
    :clap_tone2: ページ遷移までアニメーションかけられる、ページ遷移がかなり軽くなる。vueやreactなどの知識がなくてもモダーンなWEBサイトが作れる。
    :thumbsdown_tone2: ちょっと複雑、いろいろ気をつけないといけないことがある。Nuxtなどの方が開発スピードが速いかも。

もっと使いたい、絶対マスターしたいライブラリー

  1. WEBGL経由で3Dコンテンツを制作できる
    https://threejs.org/

  2. WEBGL経由でVRコンテンツを制作できる
    https://aframe.io/

さらに試したいライブラリー

  1. CANVASのためのライブラリー
    https://www.createjs.com/

  2. 慣性スクロール(&カスタムバーLOCOMOTIVEより機能が少なくてシンプルかも)
    https://idiotwu.github.io/smooth-scrollbar/

以上です!

1
6
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?