最初に ゲームのリセット機能を作ったのですが、誰でも使えるのではなく、キーワードを知っている人だけ許可しようと実装しました。その際に詰まったのが、$deleteする時にデータを送る方法。 ググれば出てきますが、英語の質問サイトが多く出てきたので、こちらに日本語で投稿しときます。 $postの場合 $axios.$post()では、中身に「url」と「引数(データ)」と「コンテントタイプヘッダー」を入れれば大丈夫です。 $deleteの場合 しかし、$axios.$deleteの場合はそれだけではうまく行きませんでした。 例)引数に送りたいデータだけを入れる → 失敗。。。。 調べてみると そこで調べてみると、$deleteの際は引数で**「data(データ)オブジェクト」を定義**する必要があるようです。 参考:https://github.com/axios/axios/issues/7
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 社内のフロントエンド、マークアップエンジニア向けに話をしそうなので、そのメモ。 なんとなくで読んでください。 Index 「Webサイト用」モダン開発環境 パフォーマンス施策 「Webサイト用」モダン開発環境 Webサイト制作において必要な条件 モダンな技術を採用しつつ、今までの案件で使える SPAではなくWebサイトに対応 HTMLファイルが各ページで存在している head内の情報が直接書かれている きれいなHTML minifyされていない Nuxt.jsのgenerateみたいに、最適化されすぎていない 変えたいもの 脱Gulp
はじめに JavaScriptによってコンテンツが生成されるサイトは、よく使用されるBeautifulSoup4だけではスクレイピングできません。 例えば「最後までスクロールすると次のコンテンツが表示される」といったサイトです。 URLが変化するわけでもないし、どうすればいいのでしょうか…。 そんなときに登場するのがSelenium+PhantomJSです。 背景 さまざまなケースでWebスクレイピングができるようになりたいという想いのもと、今回も『Pythonクローリング&スクレイピング』という本を参考に実践していきます。 単純に、Webスクレイピングは楽しいです。 やること 「note」というサイトのスクレイピングを行います。 トップページに表示される投稿の タイトル URL 概要 を抽出し、MongoDBやcsv、RSSで保存します。 何ができるのか 以下のようなページからスクレイピ
Chart.js は、JavaScriptで利用できるメジャーなチャート(グラフ)描画ライブラリーの1つですが、HTML DOM、より正確に言えば HTML5 Canvas API に依存しているため、Node.jsの環境では動作できません。 しかし、Canvas以外への依存は殆ど無いので、Canvas APIさえ用意できれば、サーバーサイド・レンダリング (SSR) が可能となります。 今回は私自作のCanvas API互換ライブラリー red-agate-svg-canvas を使用して、Node.js上でSVGにレンダリングしたいと思います。 今回の全ソースは こちら にあります。 追記 (2018/9/18) 今回説明する以外にchartjs-node等のパッケージを用いてもサーバーサイドでChart.jsを使うことができます。 chartjs-nodeのメリットは、jpegやpn
背景 現在とあるスクールで出会ったメンターの下で、 「無限オセロゲーム」を作っています。 その過程でGitを学び、 サーバーサイドをNode.js、 フロントをVue.jsで進めています。 プログラミング歴5ヶ月のぺいぺいです。 「何も考えずに手を動かすと死んじゃうよ」という話。 やったこと 「テスト駆動開発」なるものにチャレンジしていまして、 実装する前にテストコードを書く習慣をつけることをしています。 全くもって初心者である私には、意味プーなのですが、 なんとかひとまずついて行くことに。 課題の一環として、「オセロの駒を置く判定処理」を書いていました。 課題提出も近づき、その日は徹夜で作業。夜中2時を回ったくらいでしょうか、 ひとまず駒を挟んでめくる処理を実装してテスト通ったので、 一度git commitして、プルリク出そうとしました。 Gitなんて昨日めちゃくちゃ勉強したし、 手を
概要 react-blessedは、Reactのblessed.js向けのrendererです。 blessed.jsのウィジェットを、Reactのコンポーネントを使用して描画することができます。 ターミナル上で動作するアプリを作成する際に便利そうだったため、使ってみました。 動作環境 Ubuntu 18.04 Node.js 8.11.4 blessed 0.18.1 react-blessed 0.3.0 Babel 7 インストール $ yarn add blessed react react-blessed $ yarn add @babel/cli @babel/core @babel/plugin-transform-react-jsx @babel/plugin-transform-modules-commonjs @babel/plugin-proposal-class-p
const cluster = require('cluster') // CPUの数が上限である必要はある? これ以上なら動かないというわけでもないけど const numCPUs = require('os').cpus().length const masterFnc = () => { // 初期準備 処理対象 const target = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] // 各コアの処理数が均等になるように渡す数を分割する (ただしこのやり方は最後が楽になる) const slicedTarget = [] const bundle = Math.ceil(target.length / numCPUs) for (i = 0; i < target.length; i += bundle) { slicedTarget.push(target.
はじめに 前回、elm0.19の開発環境を構築したので、 elmを試すために、Elm 0.18で作るTodoアプリ(1)を試してみる。 ElmをSPAではなく一部適用にしたいので調整する。 開発環境 Windows 10 Vagrant 2.1.5 Virtualbox 5.2.18 Ubuntu 18.04 LTS (Bionic Beaver) Docker version 18.06.0-ce, build 0ffa825 docker-compose version 1.22.0, build f46880fe ファイル構成イメージ 以下のようなファイル構成としたい。 const path = require("path"); const webpack = require("webpack"); const merge = require("webpack-merge"); co
自分で作っているプロダクトで、一部他のサイトからスクレイピングをする必要があったものの、JSで動的に生成されている要素だったため、スクレイピングができませんでした。 そのため調べてヘッドレスブラウザを使うことにしたのですが、いろいろあってスクレイピングする必要がなくなり、調べた時間を無駄にしたくないと思いまとめました。。 ヘッドレスブラウザとは 調べてみるとGUIのないブラウザと説明をよく見ます。 ヘッドレス Chrome ことはじめによると下記のような説明がありました。 ヘッドレスブラウザは、GUI を持つ必要のない自動テスト環境やサーバー環境にとてもよいツールです。例としては、実際のウェブページに対してなにかテストを実行する、そのページの PDF を生成する、またはただ、そのページがどう表示されるかを検証するなどが挙げられるでしょうか。 GUIはないけどブラウザが行ってくれている処理を
概要 Webpack 4を利用した開発に便利な webpack-dev-server の設定メモです。 webpack-dev-serverのソースコードと公式wiki、公式Docを参考に実動確認した結果を書きます。 HMR等オートリロード系の設定(--hotとかとか--inlineとか)やよく使いそうなCLIオプションなど理解しておくためのメモです。 環境 本投稿で使っている環境は以下の通り。 webpack-dev-server:3.1.7 webpack:4.17.1 webpack-cli:3.1.0 webpack-dev-server とは webpack-dev-serverはwebpackを用いたフロントエンド開発のときに利用できる開発用のwebサーバー。 *.jsファイルやリソースファイルを更新すると即座に反映してくれる機能をもっている。 webpack-dev-serv
スクレイプ対象 英語の学習にも役立てたいのでスクレイプ対象は購読しているThe Economist。 The EconomistのPuppeteerによるスクレイピングなので、作ったライブラリの名前はPuppenomist。良いもじりだと思っている。 学び ログイン処理 ログイン処理を行なっているPuppeteerの例は少ないので実例として参考になるのでは。 マナーを守ったスクレイピング The Economistのrobots.txtに「5秒ごとのアクセス」とあるので、割りに時間がかかる。1冊分で5,6分、一年分だと数時間になる。数時間だと1回では無理なので、ログを残して途中から再開できるようにした。 RECAPTCHA サイト側ではgoogleのRECAPTCHAが設置されている。 詳しくは書かないけど、RECAPTCHAに引っかかりやすいページや挙動というものがある。 挙動に関しては
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く