- 1. plunkerでvue その52
- 2. AWS Kinesis Video StreamsでMMDをWebRTCで配信する
- 3. JavaScriptで比較的安全にeval()する
- 4. Kintoneのトップページのポータルをタブ化しオリジナルのポータルとアプリ一覧を表示する
- 5. Javascriptでバッチを作って実行する（Node.js）
- 6. cypress アロー関数と通常の関数の書き方で挙動が異なる件について
- 7. JSONデータへのアクセス方法
- 8. JavaScriptでcsvダウンロードを実装する方法
- 9. javascriptで自分のQiita記事一覧を得る(2)
- 10. Javascriptメモ：BootstrapのCollapseのトランジションを、async/awaitで待つ
- 11. JavaScript: parseInt(n, 10)の振る舞いを40の具体例から確認してみた
- 12. plunkerでvue その51
- 13. QuizKnockの「サマーウォーズの暗号、ガチで解けるかやってみた」の第一問の解読機を作ってみた
- 14. 徳丸本メモ #1(同一オリジンポリシー)
- 15. javascriptで自分のQiita記事一覧を得る(1)
- 16. JavaScriptを基本からまとめてみた【ラジオボタンが選択か非選択かを取得】【随時更新】
- 17. GASでお手軽なAPIを作ってJSで叩いてみる
- 18. 鶏(async)と卵(await)、どちらが先か？
- 19. plunkerでvue その50
- 20. JavaScriptを基本からまとめてみた【ラジオボタンの値を取得・設定】【随時更新】
plunkerでvue その52
#概要
plunkerでvueやってみた。
box2dwebやってみた。
エレベーター書いてみた。#写真
#サンプルコード
“`
new Vue({
el: ‘#app’,
data: {
},
mounted () {
this.init()
this.createWorld()
this.loop()
},
methods: {
init () {
this.canvas = document.getElementById(‘c’)
this.canvas.width = 456
this.canvas.height = 456
this.b2Vec2 = Box2D.Common.Math.b2Vec2
this.b2BodyDef =
AWS Kinesis Video StreamsでMMDをWebRTCで配信する
以前、MMDをThree.jsでブラウザから参照するようにしました。
（[「原神」がMMDモデルを配信してくれたので、JavascriptでMMDビューアを作った](https://qiita.com/poruruba/items/35085f3ab3db3fa17d2d)）今回は、さらに進めて、MMDで踊っているさまをWebRTCで配信したいと思います。
WebRTCをするために、いろいろ準備が必要だったりするのですが、AWSのKinesis Video Streamsを使えば、必要な環境をそろえてくれているので、手軽に始めることができそうです。
ソースコードもろもろを以下に置きました。
poruruba/AWSKVS_WebRTC
https://github.com/poruruba/AWSKVS_WebRTC
今回の投稿では、まず使ってみていただけるように、構築方法から実際に配信してみるところを説明します。Webサイトを公開してありますので、まずは動きを確認してみてください。
次回は、具体的なソースコードの説明をする予定です。今回、実際に触ってみていただくWe
JavaScriptで比較的安全にeval()する
## evalって？
文字列をJavaScriptのコードとして評価してくれます。
一見便利だけど、めっちゃ危険だから通常使うことはありません。
使ったらESLintにも怒られます。でも、外部からコードを注入できるのはとても拡張性が高いので、クローズドなBotとかの開発に使いたい場面はあります。
## eval的なやつ
`eval()`が一番有名だと思うけど、実は他にも同じようなことができる方法があります。
具体的には、グローバルオブジェクトの`Function()`と、Node.jsのVMです。> * [eval ( )](https://developer.mozilla.org/ja/docs/orphaned/Web/JavaScript/Reference/Global_Objects/eval)
* [Function ( )](https://developer.mozilla.org/ja/docs/orphaned/Web/JavaScript/Reference/Global_Objects/Function)
* [Node.js VM](https:/
Kintoneのトップページのポータルをタブ化しオリジナルのポータルとアプリ一覧を表示する
## きっかけ
* 昨日[こんな記事](https://qiita.com/ricorico/items/da106730355450b35116)を書いたのに、やっぱり新しいアプリを作るごとにポータル管理アプリをメンテするのはしんどいなと思い、**ポータルを開くごとに最新のアプリ一覧を取得してスペースごとに表示する**JSを作ろうと決意しました。https://qiita.com/ricorico/items/da106730355450b35116
* 上記プラス、アプリが増えてきて自分が使いたいアプリを選ぶときにポータルの「さらにに表示」を何回か押して開いて、ってやるのがちょっとしんどくなってきたのでアプリ一覧がほしいなと思いました。
## 作ったもの
https://github.com/erikoono/kintone-portal-tab-custom/blob/master/Portal/Portal.js
## 使い方
* 使い方はREADME.mdにも書きましたが、以下のとおりです。1. ソース（“Portal.js“と“Portal.css`
Javascriptでバッチを作って実行する（Node.js）
知っている人には当たり前過ぎる情報なので、素通りいただければです。
思い返すと2年前はこれ全然知らなかったなー、、、とふと思ったので参考になる人がいるかもということで記事にしました。
個人的には、お手軽にプログラミングできるのでお勧めです。
# 前提
mac（Windowsでも環境構築すれば問題なく実行できます）# 用語
## Node.js
– JavaScriptの実行環境
– `node test.js`とかで、JavaScriptをターミナルで実行可能になる
– 例えると`php test.php`のphpに当たるもので良いと思う
– メジャーバージョンよく更新されている=モダン？
– 更新多いのでバージョン管理ツールを使うと便利（nodebrew, nodenv, anyenv 色々あります。)
– 最近だとasdfを使って構築する記事をよく見ます## npm
– Node.jsのライブラリのパッケージ管理ツール
– `npm install {パッケージ名}`とかで、カレントディレクトリに.node_modulesというディレクトリが
cypress アロー関数と通常の関数の書き方で挙動が異なる件について
最近cypressを使い始めてアロー関数と通常の関数の書き方で挙動が異なる件で少しハマってしまったので一応メモ。
# 失敗例
以下が自分の失敗してたサンプルの書き方になります。“`cypress/integration/sample.js
describe(‘詳細ページのテスト’, () => {
beforeEach(() => {
cy.fixture(‘users’).as(‘users’)
})it(‘モーダルのテスト’, () => {
//モーダルを開くボタンをクリック
cy.get(‘[data-testid=modal_open_btn]’).click()
//モーダルを開いた後メールアドレスを入力欄に記入
cy.get(‘[data-testid=modal_input]’).click()
.click()
.type(this.users.email) //ここでなぜかメールアドレスを取得できない
JSONデータへのアクセス方法
JSONデータへのアクセス方法
“`javascript
const jsonData = { firstName: ‘Tanaka’ };
console.log(‘OK:’, jsonData.firstName) //OK: Tanaka
console.log(‘OK:’, jsonData.age) //OK: undefined
console.log(‘OK:’, jsonData[‘firstName’]) //OK: Tanaka
console.log(‘OK:’, jsonData[‘age’]) //OK: undefined
console.log(‘NG:’, jsonData.age.year) //TypeError: Cannot read property ‘year’ of undefined
console.log(‘NG:’, jsonData[‘age’].year) //TypeError: Cannot read property ‘year’ of undefined“`
APIのレスポンス
JavaScriptでcsvダウンロードを実装する方法
#はじめに
フロント(React)でcsvダウンロードを実装する機会があったため、備忘録です。
どうぞご活用ください。#実装
“`javascript
const handleDLcsv = async () => {
//アイテムの定義
const download_items = [
{‘id’: 1, ‘name’: ‘apple’, ‘price’: 100},
{‘id’: 2, ‘name’: ‘orange’, ‘price’: 120},
{‘id’: 3, ‘name’: ‘melon’, ‘price’: 800}
];
//csvヘッダー
const array_data = [[‘id’, ‘name’, ‘price’]];//文字コード
const bom = new Uint8Array([0xEF, 0xBB, 0xBF]);//csv用データ作成
download_items.map((
javascriptで自分のQiita記事一覧を得る(2)
[前回の記事](https://qiita.com/ELIXIR/items/c4453c1c68741679e877)のアップデートです。
指定したタグを含む記事だけを表示できるようにしました。[動作デモ](https://elix.jp/app/tools/qiita_index.html?uuid=ELIXIR)
前回同様ローカル環境でも動作します。結果：
タグを細かくつけすぎたことが仇になってタグを見つけにくいという結果に。。
タグがわかっている場合はブラウザ上でCtrl+Fでタグを検索してボタンを探すということで・・・。“`[myindex.html]
user