mermaid.jsが素晴らしいけどなかなか使ってる人見かけないので実例晒す(追記あり) - Qiita
mermaid.jsとは JavaScriptのチャート作成ライブラリです。他にも似たようなのは色々ありますが、これ一本でフローチャート、シーケンス、ガントに対応してるので、個人的にお気に入り。 http://knsv.github.io/mermaid/ サイトの各チャートのページ見ると書き方と何ができるかはわかるので、ご覧あれ。 僕の使い方 JSのライブラリを自分でインポートして何かすることはほとんど無くて(後述の理由からガントだけJSで使ってるけど)、基本的には以下の2つの方法で使ってる。 Haroopad フリーでクロスプラットフォーム(OS X, Win, Linux)なMarkdownエディタ。 v0.13からmermaid.jsがインテグされているので、何もしなくてもそのまま使える。 mermaid.jsのグラフの書き方は、コード表記で、言語をmermaidにしてあげるだけ。
名刺の代わりにCLIアプリを書く - Qiita
すると自己紹介CLIアプリが起動。 ``` $ npx sindresorhus ```https://t.co/QO3ogKmu1d pic.twitter.com/xZdQSzFLAq — Sindre Sorhus (@sindresorhus) May 9, 2018 基本的には、このレポジトリを適当に書き換えれば簡単にできる。 はじめてのnpmライブラリにちょうどいいかも知れない。 また、使っている技術がちょっとおもしろくて、inkを使っている。 これは何かとCLIのためのReactだ。 普通にReactでCLIを書くことができる。 なお、ｖ０．５がちょっと壊れている雰囲気あってエラーが出るのでv0.4推奨です。 const {h, render, Component, Color } = require('ink'); class Counter extends Compone
WarriorJS Docs
Write JavaScript to teach your warrior what to do depending on the situation. Select abilities to customize how your warrior plays.
melonJSで始めるゲーム開発入門 - Qiita
melonJS 公式サイト JavaScript製のゲームエンジン！ 2Dゲームの開発に適している！ HTML5が動作するブラウザでゲームが動く！軽い！ こんなのが作れちゃう！！ 筆者の作品 github => mqtsuo02/melonjs-town-sample 公式には色んなサンプルが公開されてるよ => made-with-melonJS いますぐ始めたい！！ その情熱、メロンにぶつけろ！！ 必要なものは2つだけ！ nodeの開発環境 Tiled Map Editor（無料） まずは土台を作るよ〜 だまってコマンドを打て！！ ブラウザからhttp://localhost:8000/にアクセスして黒い画面が見えればOK！！ ちなみにhttp://localhost:8000/#debugとアクセスすればデバッグモードでみれるよ！！ ビルドコマンドその他はmelonjs/boiler
JavaScriptだけでTrello風タスク管理ボードを開発できるライブラリ「jKanban」を使ってみた！ -
どうも、まさとらん（@0310lan）です！ 今回は、簡単なJavaScriptコードだけでTrello風の「タスク管理ボード」を開発することができるライブラリのご紹介です！ 非常にカスタマイズ性が高く、自分好みのタスク管理アプリを構築したい人などには最適でしょう。 コードも簡単で初心者の方もすぐに理解できると思うので、ぜひ参考にしてみてください！ 【 jKanban 】 ■「jKanban」の使い方 それでは、まず最初に「jKanban」を利用するための準備から始めていきましょう！ 必要になるのは専用の「JS / CSS」ライブラリで、GitHubからそれぞれ取得して読み込むだけなのでお手軽です。 これらのライブラリは次のようにHTMLへ追記しておけば準備完了です。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>j
Developer's Guide - Google Chart API - Google Code
Discover the resources for adding interactive charts for browsers and mobile devices.
ブラウザからBluetoothが使える！ JSでWeb Bluetooth APIを使ってBLE機器を操作する方法[Lチカ・温湿度センサー編] - ICS MEDIA
Speculation Rules APIでウェブサイトのページ遷移を速くする - クリック前にプリレンダリングする実装手法 4月15日 公開楢山 哲弘♥ 40
![ブラウザからBluetoothが使える！ JSでWeb Bluetooth APIを使ってBLE機器を操作する方法[Lチカ・温湿度センサー編] - ICS MEDIA](https://cdn-ak-scissors.b.st-hatena.com/image/square/3c93f2c97c7352b355f91e8dfd9bbcdc2fc9697b/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fics.media%2F_assets%2Ftop%2Ffacebook_opg_image.png)
2018年の”JavaScript” 再入門/re-learning-about-js-in-2018
KMC春合宿2018での発表資料です
JavaScriptのクロージャはメモリーリークをちゃんと理解して使おう - Qiita
はじめに 前にブログで書いた記事なのですが、せっかくなのでQiitaにも投稿します。 脱初級者の壁として君臨しているクロージャ。クロージャの使い方はわかったけど、いろんな記事を見るとクロージャは問題点もあるみたい。それに、そもそもクロージャの使い所がいまいちわかんないと思ってクロージャに再度立ち向かおうと思った次第です。同じような悩みを抱えているデザイナーさん、コーダーさん、フロントエンドエンジニアさんの参考になれば嬉しいです。 クロージャとは とりあえずおさらい & 補足をします。 よく見かけるクロージャの見本がこちら。 ここで簡単にクロージャについて説明します。ちなみに、最近読んだ本で何となくJavaScriptを書いていた人が一歩先に進むための本が説明としてわかりやすかったので、そちらを引用させていただきながら。 まずクロージャとは ローカル変数を参照している、関数の中に定義している
Eloquent JavaScript
This is a book about JavaScript, programming, and the wonders of the digital. You can read it online here, or buy your own paperback copy. Written by Marijn Haverbeke. Licensed under a Creative Commons attribution-noncommercial license. All code in this book may also be considered licensed under an MIT license. Illustrations by various artists: Cover by Péchane Sumi-e. Chapter illustrations by Mad
ブラウザ上にAngular,React,Vue等の環境を一発構築＆開発できる「CodeSandbox」を使ってみた！ -
どうも、まさとらん（@0310lan）です！ 今回は、面倒な開発環境を一瞬で構築してブラウザ上からWebアプリを気軽に開発＆公開できる無料のWebサービスをご紹介します！ 完全なオープンソースで開発が進められており、React / Angular / Vueなどのプロジェクトを誰でも簡単にプログラミングできる高度なエディタを搭載しているのが特徴です。 【 CodeSandbox 】 ■「CodeSandbox」の使い方 それでは、まず最初に「CodeSandbox」の使い方から見ていきましょう！ サイトにアクセスしたら、画面右上にあるボタンをクリックします。 次に、「React」「Vue」「Angular」などのプロジェクトを選択する画面が開きます。 ここで好きなフレームワークを選んだり、素のJavaScript（Vanilla JS）やCLIツール、GitHubからリポジトリを読み込んだ
JavascriptBattleのルールを日本語訳してみた - Qiita
ミラー JavascriptBattle という AI を作って戦わせる系のゲームを発見して、結構面白そうだったので遊んでみている。 参加するのは簡単で、Javascript Battle から Github のアカウントで Join できる。Join したら、JavascriptBattle/hero-starter を fork して、hero.js を書き換えて push すれば OK。 最初は hero.js でコメントアウトされている移動関数を書き換えて試していくとなんとなく掴める。とはいえ、ルールをちゃんと分かってないと AI つくるもなにもないので、ちゃんと読むついでに日本語訳してみることにした。合ってるか分からないので誰かチェックしてもらえると嬉しい。いつでも PR あげてください。 ルールとしては結構単純で、自分がなるべくダメージくらわないように敵ヒーローを殴るプレイか、
誰でも簡単にバーチャルユーチューバー！FaceVTuberとdynamic import - Qiita
FaceVTuberをリリースしました！！ 追記：続編を書きました！！ バーチャルYoutuberになれる！FaceVTuberの定性的で定量的なUX改善 3/12にGoogleChromeとWebカメラさえあれば，バーチャルユーチューバーになれるFaceVTuberをリリースいたしました． 「最近流行のバーチャルユーチューバーになりたい！！」 でも，特別なハードウェアが必要だったり，ソフトウェアの設定が大変だったり，難しい!! そんな悩みを解決するのがFaceVTuber!! ブラウザで動く，簡単バーチャルユーチューバー体験をみんなでしよう！！ https://t.co/bcTbdr36UR#FaceVTuber pic.twitter.com/NCyxe31oK3 — FaceVTuberOfficial (@FaceVTuber) 2018年3月12日 最近，キズナアイさんを筆頭とし
[JS]その美しさ、一度見たら絶対忘れない！スゴ技のアニメーションを使った画像切り換えのテクニック
繊細で美しく、ダイナミックなアニメーションで画像を切り換えるスクリプトを使ったテクニックを紹介します。 2016年のインパクトのある成果物ベスト10には間違いなく入りますね。
![[JS]その美しさ、一度見たら絶対忘れない！スゴ技のアニメーションを使った画像切り換えのテクニック](https://cdn-ak-scissors.b.st-hatena.com/image/square/9f60b014d78b0b7bf305383f5f154f990c3f25b5/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201602%2F2016052601.png)
2018年のフロントエンドエンジニアならこの程度は知ってて当然だよな？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 可及的速やかにReactが絶滅しますように。 以下はFront-End Developer Handbook 2018の第三部、Front-end Developer Toolsからリンクされているツールと、その簡単な紹介です。 ドキュメントツール 開発者向けドキュメント、APIリファレンス Dash 200以上のAPIリファレンス、100以上のチートシートを一括ダウンロードできる。有料、Mac用。 DevDocs 200以上のライブラリをオンラインで検索できる。無料。 Velocity 中身はDashと同じ。有料、Windows用。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Promise と async/await の理解度をもう1段階上げる - Qiita
ウェブフォントのエモい話
GitHub - getify/You-Dont-Know-JS: A book series (2 published editions) on the JS language.
The Modern JavaScript Tutorial
https://www.freecodecamp.org/
