ScrollReveal.jsを使ってスクロールしたらふわっと表示される動きを作ってみよう | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
JavaScript library to animate elements as they scroll into view. スクロールして表示される要素をアニメーション化するJavaScriptライブラリ 要素が画面に表示されたら、指定したアニメーションを実行してくれる優れものです。 「ふわっと表示」「下から表示」「遅れて表示」など簡単に実装することができます。 公式サイト：https://scrollrevealjs.org/ ScrollRevealの使い方 ライブラリ読み込み 使い方は簡単。ライブラリをscriptタグで読み込み、対象の要素にクラスを与えてJavaScriptからアニメーションを指定するだけです。 CDNは公式サイトのインストールから読み込みます。 // 最新バージョンの場合 <script src="https://unpkg.com/scrollreveal
NativeScript-Vue - A NativeScript plugin for building truly native applications using Vue.js
Truly native apps using Vue.js and NativeScriptWant to release that app you've been dreaming about without the hassle of learning new languages? NativeScript-Vue is the right choice for you! Get Started Easy to get started with.NativeScript-Vue is easy to get started with, it is a single dependency that you can install through npm.
仕事ですぐに使えるTypeScript — 仕事ですぐに使えるTypeScript ドキュメント
注釈 本ドキュメントは、まだ未完成ですが、ウェブフロントエンドの開発を学ぶときに、JavaScriptを経由せずに、最初からTypeScriptで学んでいく社内向けコンテンツとして作成されはじめました。基本の文法部分以外はまだ執筆されていない章もいくつもあります。書かれている章もまだまだ内容が追加される可能性がありますし、環境の変化で内容の変更が入る可能性もあります。 書籍の原稿はGitHub上で管理しております。もしTypoを見つけてくださった方がいらっしゃいましたら、 GitHub上で連絡 をお願いします 1 。reSTファイルだけ修正してもらえれば、HTML/PDFの生成までは不要です。フィードバックなども歓迎しております。 1 https://github.com/future-architect/typescript-guide/pulls
それっぽい名前ジェネレータ - 西洋ファンタジー用語ナナメ読み辞典「Tiny Tales」
ランダムでそれっぽい名前を生成します。ご利用にはIE4以降のjavascriptが必要です。 作りたい系統の名前を一覧から選んで、[作成]ボタンを押してください。 仕様上5文字のものが多くなってしまいますので、適当に加工して創作物等にお使いください。 参考までに地名の意味一覧を併せて掲載しておきます。
JavaScriptのWeb Audio APIで録音してみる - saitodev.co
先日、 パソコンの前で手を叩いたら、その音をキッカケにして動作するアプリは作れないかな？ という意見が挙がった。 というわけで、早速調べてみたところ、 HTML5のAPIでWeb Audio APIをいう仕様を見つけた。 Web Audio API - Web API インターフェイス | MDN というわけで、 早速、上記のURLと下記のURLを参考にして録音アプリを作ってみた。 ユーザーから音声データを取得する | Web | Google Developers 実際に書いたコードは下記の通り <h1>Web Audio APIのサンプル</h1> <p>実行と同時に録音がはじまり、10秒後に音声データを生成します</p> <a id="dl">ダウンロード</a> <script> //様々なブラウザでマイクへのアクセス権を取得する navigator.getUserMedia
GrapesJS
Free and Open Source Web Builder FrameworkNext generation tool for building templates without coding Sorry but your device is too small for the editor. See below for more information GrapesJS is an open-source, multi-purpose, Web Builder Framework which combines different tools and features with the goal to help you (or users of your application) to build HTML templates without any knowledge of co
vis.js
vis.js community edition * A dynamic, browser based visualization library. The library is designed to be easy to use, to handle large amounts of dynamic data, and to enable manipulation of and interaction with the data. The library consists of the components DataSet, Timeline, Network, Graph2d and Graph3d.
Gridsome - Build blazing fast websites with Vue.js and GraphQL
A Jamstack framework for Vue.js Gridsome makes it easy for developers to build static generated websites & apps that are fast by default 🚀 Get started Open-source MIT Licensed. GitHub (v0.7.23) CMSsAny Headless CMS, Contentful, WordPress, Drupal, Sanity.io, etc. DataAny APIs, Databases, AirTable, YAML, CSV, JSON, etc. MarkdownAny Git-based CMS, Forestry, Netlify CMS, Blogs, Documentation.
Webpack (v4) で複数のJavaScriptファイル、CSSファイルを分けてビルドする - Make組ブログ
webpackは便利ですが設定などは慣れが必要です。 僕は面倒なので、毎度自分の過去のプロジェクトからコピーして使っています。 その内容から抜粋してブログの記事にしています。 想定としてはSinglePageApplicationとしてはアプリを作らずに、フレームワークからJSを配布するWebアプリの構成です。 すべてのページをJSで作るならよいですが、一部のみアプリケーションとしたい場合はこの記事で説明されている設定を参考にしてください。 僕の考えですが、管理用のページや設定画面など一般的なWeb+DBの画面であれば、SPAとして作るのは手間が無駄に多いと考えています。 モデル定義+フォームの自動生成や、一般的なWeb+DBの画面構成はDjangoなどのWebフレームワークをそのまま使うほうが扱いやすいと思っています。 そのうえで、CSSはビルドしたい、Web画面で共通に使うJSをビルド
シャニマスのコード読んだ - mizchi's blog
ライセンス表記みるぐらいで深掘りはしてない シャニマスのコード読むか— human eslint --fix (@mizchi) 2018年4月24日 シャニマス、pixijs ですね— human eslint --fix (@mizchi) 2018年4月24日 pixi-ae.min.js たぶん after affect のコンバータなんだろうけどググっても引っかかんないな、内製かな— human eslint --fix (@mizchi) 2018年4月24日 s/after-affect/after-effect After effects to pixi.js | CodeSeek なら見つかったが、該当のライブラリ名で探してるが見つからず パーティクルはこれ https://t.co/NtIqPBBq7n— human eslint --fix (@mizchi) 201
AG Grid: High-Performance React Grid, Angular Grid, JavaScript Grid
Used by 90% of the Fortune 500 Trusted by the finest teams globally, an unmatched experience for developers and users alike. There are a lot of component-based table libraries out there, but I believe AG Grid is the gold standard and is by far my favourite. AG Grid is perfect for building Enterprise Applications. Tanner Linsley I've been impressed with AG Grid. Not only is it incredibly feature-ri
ESDoc - A Documentation Generator For JavaScript(ES6)
ESDoc is a good documentation generator for JavaScript. Features Generates good documentation. Measures documentation coverage. Integrate test codes into documentation. Integrate manual into documentation. Parse ECMAScript proposals. Add custom features by plugin architecture ESDoc Hosting Service Users ESDoc (self-hosting 😄) RxJS Sketch API And more. Quick Start# move to a your project directory
Vue.jsで汎用ウインドウコンポーネントをつくってみた - Qiita
GMOペパボ新卒エンジニアの@gatchanです。 @sunecosuriさんの「Nuxt.jsでlocalStorageを用いる際のTipsとハマったこと」につづき、Vue.jsな内容です。 最近作っている趣味プログラミングで必要だったので、Vue.jsで汎用的なウインドウコンポーネントをつくってみました。 （ここでいうウインドウとは、各種OSのGUIに採用されているウインドウシステムのようなものです） あくまでウインドウ画面実装の一例ですが、参考になればうれしいです。 （こういうものをつくりました） 詳細な実装は、githubに公開したソースコードを参照していただければと思います。 https://github.com/piyoppi/vue_window_sample ウインドウの要件 私が求めるウインドウの要件は、以下の通りでした。 ドラッグアンドドロップで移動できる テキストや画
Python Django チュートリアル SPA編(3) - Qiita
勉強会用の資料です． 今回の記事ではフロント側のデザインを整えていきます． また，最初のチュートリアルで作成したAPIを修正し，質問一覧を取得，表示させます． このチュートリアルから始めるかたは以下のリンクからソースコードをダウンロードするか， tutorial3-start のタグが付いているリビジョン(96ab6f4)をチェックアウトしてください． https://github.com/usa-mimi/tutorial-spa/tree/tutorial3-start コンポーネントの話 コードを書いていく前に，Vueの コンポーネント について説明していきます． コンポーネントについて ページを作っていく前に，コンポーネントについて公式のドキュメントを読んでおくことをおすすめします． コンポーネントについて公式の説明 Vueではページの部分部分をコンポーネントという単位で分割してお
W3Schools.com
W3Schools offers a wide range of services and products for beginners and professionals, helping millions of people everyday to learn and master new skills. Free Tutorials Enjoy our free tutorials like millions of other internet users since 1999
ES2016 / ES2017の最新動向を追ってみた - Qiita
今回はES2016で実装された2つの仕様と、ES2017以降で実装されるであろうStage 4の仕様の紹介をしていきたいと思います。 Array.prototype.includes() 配列内に求めている値が入っているかをtrue or falseで返しています。 今までの値チェックの方法はindexOf()とか使って値が入っているかどうかを確認していましたが、正直-1を返すとかが若干ややこしかったので返ってくる値がboolean型なのは可読性がぐっと上がるだろうなと感じたので、今後はこれを使っていこうと思いました。 const arr = ['hoge', 'fuga', 'piyo']; console.log(arr.includes('hoge')); // true console.log(arr.includes('hogera')); // false
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Element
GitHub - iamkun/dayjs: ⏰ Day.js 2kB immutable date-time library alternative to Moment.js with the same modern API
https://vuetifyjs.com/ja/
GitHub - axios/moxios: Mock axios requests for testing