k01ken’s b10g

He110 W0r1d!

Reactで詰まったポイントの解決メモ

開発環境は、Windows10 64bit(Pro) + react@16.8.6。 ■ライフサイクルメソッドについて ・stateが変更されるたびに、componentWillUpdate,componentDidUpdateメソッドがそれぞれ呼び出される。 ■componentWillMountを使用すると、querySelectorAllでは、まだ…

Reactで親コンポーネントから子コンポーネントへstateを渡す

親コンポーネントのstateの状態に応じて、子コンポーネントの状態を切り替えたいと思います。 今回はサンプルプログラムとして、clickボタンを押すたびに、ONとOFFの表示が交互に切り替わるプログラムを書いてみたいと思います。親コンポーネントのstateの状…

JavaScriptで何番目のclass属性でイベントが発生したのかインデックスを取得する

開発環境は、Windows 10 Pro(64bit)。例えば、いいねボタンなどの複数のclass属性(今回はlike_btn)がある中で実際にクリックしたボタンのみを、色づけしたい、あるいは色づけを解除したい場合、jQueryのindexメソッドのようなものを、生のJavaScriptで行うに…

ReactでFontAwesomeを使う

開発環境は、Windows 10 Pro(64bit) + npm 6.4.1。www.npmjs.com

ReactでBootstrapを使う

開発環境は、Windows 10 Pro(64bit) + npm 6.4.1。https://react-bootstrap.github.io/ npm install react-bootstrap bootstraphtmlファイルのheadタグ部分に、

CakePHP3でReactを利用する

開発環境は、Windows 10 Pro(64bit) + CakePHP 3.7.8。qiita.com ここの記事を参考にして、CakePHPのルートディレクトリにて、 必要なモジュールをインストールしたが、bundle.jsを作成する段階でエラーが発生した。そこで、エラーメッセージに書いてある通…

ffmpegを利用する

開発環境は、Windows10 Pro(64bit)。動画から一部のフレームのサムネイル画像を作成したくて、ffmpegを利用してみることにしました。1.公式サイトへアクセスする https://www.ffmpeg.org/2.左サイドバーのDownloadと書かれたリンクをクリック 3.Get the pack…

Windows10でAnacondaを使ってみる

開発環境は、Windows 10 Pro(64bit)。1.公式サイトへアクセスする Anaconda https://www.anaconda.com/ 2.右上のDownloadボタンをクリック 3.Downloadボタンをクリック 4.Windowsアイコンをクリックし、Python 3.7 versionのDownloadボタンをクリック。イン…

Windows10にてAndroid Studioを使ってみる

開発環境は、Windows 10 Pro(64bit)。1.公式サイトへアクセスし、DOWNLOAD ANDROID STUDIOボタンをクリック 2.I have read and agree~にチェックボックスを入れて、 DOWNLOAD ANDROID STUDIO~ボタンをクリック 3.ダウンロードしたファイルを実行する4.Next…

Windows 10でSourcetreeを使う

開発環境は、Windows 10 Pro(64bit)。GUIで、Gitが使用できるSourcetreeをインストールする手順のメモ。1.公式サイトへアクセスする https://ja.atlassian.com/software/sourcetree2.Windows向けダウンロードボタンをクリック 3.Atlassian Softwareライセン…

Windows 10でcurlを使う

開発環境は、Windows 10 Pro(64bit)。curlはLinuxやMacでは最初からインストールされていますが、Windowsにはないので、Windowsでcurlを使いたい場合は、chocolateyというものを使います。 The package manager for Windows https://chocolatey.org/ 1.公式…

『電卓アプリで学ぶReact/Redux入門(実装編)』をやって詰まったところ

開発環境は、Windows 10 Pro(64bit) + node 10.15.0 + npm 6.4.1。下記のReact/Reduxの実装編をやっていて、途中で詰まったところをメモしておく。電卓アプリで学ぶReact/Redux入門(基礎知識編) https://qiita.com/nishina555/items/affcb3684e67cd0ee897 電…

Windows10(64bit)にDockerをインストールする

開発環境は、Windows10 Pro(64bit)。 1.公式サイトへアクセスする Enterprise Application Container Platform | Docker2.右上のGet Startボタンをクリック 3.ちょっとスクロールして、Download for Windowsボタンをクリック 4. Please Login To Downloadボ…

CakesのUI

CakesへTwitterのリンク経由で個別記事にアクセスした時に、なぜか、タイトルはあるけれど、記事の中身のないページに飛ばされる。 リロードすると、変わるかな?と思って、リロードしても変わらない。 だから、1回その連載のトップページ(目次ページ)へアク…

Candy Crash FriendsのUI

Candy Cransh Friendsというゲームをやっていて、ゲームに失敗すると、出現する画面で、自分では、ギブアップを選択しようとしたが、間違えて、アイテムの金塊を10個支払って、続けるボタンを押してしまった。一度、押してしまうと、キャンセルができない。…

CakePHP3でルーティングを行う

開発環境は、Windows 10 Pro(64bit) + PHP 7.2.12 + CakePHP 3.7.2 + XAMPP Control Panel v3.2.2。今回は具体的な事例として、トップページを、PostsController内のindexアクションにしたい場合の書き方を説明。1. /config/routes.phpを開く2.以下の部分を…

Windows10にBlenderを使う

開発環境は、Windows 10 Pro(64bit)。1.公式サイトへアクセスし、画面をクリック blender.org - Home of the Blender project - Free and Open 3D Creation Software 2.Download Blender 2.8 Beta(現時点)と書かれたボタンをクリック 3. 2.80 Beta Windows 6…

PHPでarray_searchを使用する際の注意点

PHP

開発環境は、PHP 7.2.12。 条件文の中で使用する際に注意すべき部分 array_search関数は、配列の中に指定の値があれば、その値のキーを、指定の値がなければ、falseを返す関数なのですが、例えば、以下のコードのように、返り値としてインデックス番号の0が…

ImagicKを使って色々と画像を加工してみる

PHP

開発環境は、PHP 7.2.12 + ImageMagicK ImageMagick 7.0.7-11 Q16 x86 2017-11-23 + XAMPP Control Panel v3.2.2。 新しく画像を作成する 新しく画像を作成し、png画像のフォーマットとして、表示させます。 newImage(100, 100, new ImagickPixel('red')); $…

Windows10にてプログラミング言語Goをインストールする

Go

開発環境はWindows10 Pro(64bit)。1.公式サイトへアクセスする https://golang.org/2.Download Goボタンをクリック 3.Microsoft Windowsのgo1.11.5.windows-amd64.msiのリンクをクリックし、インストーラをダウンロード。 4.ダウンロードしたインストーラを…

CakePHP3にてシェルとタスクを利用してコマンドラインからデータベースのデータを操作する

開発環境は、Windows 10 Pro(64bit) + PHP 7.2.12 + CakePHP 3.6.14 + XAMPP Control Panel v3.2.2。 基本的な操作 以下のプログラムをHelloShell.phpの名前でsrc/Shellディレクトリ内に保存する。 out(__('Hello world.')); } } ?> コマンドライン…

ロリポップのcronでプログラムを定期実行してみる

プランによってcronの使用制限があります。自分の場合はスタンダードなので、 10個までcronが登録できて、1分毎に作動できます。 cron設定 / サーバー・プログラム / マニュアル - レンタルサーバーならロリポップ!今回はテストとしてサンプルプログラムを1…

CakePHP3でPHPUnitを使ってテストを行う

開発環境は、Windows 10 Pro(64bit) + PHP 7.2.12 + CakePHP 3.6.14 + XAMPP Control Panel v3.2.2。前提として、 ・CakePHPの組み込みサーバー ・XAMPPのApache ・XAMPPのMySQL が起動しています。今回は、初めてなので公式ドキュメントに基づいて書いてお…

CakePHP3でプラグイン(FriendsOfCake/bootstrap-ui)を用いてBootstrapを使う

開発環境は、Windows 10 Pro(64bit) + PHP 7.2.12 + CakePHP 3.6.14。1.composer.jsonを開いて、requireの中に以下を追加 "friendsofcake/bootstrap-ui": "^1.4",2.コマンドプロンプトからcomposer updateでプラグインをインストール3.config/bootstrap.php…

Windows10にてロリポップへGit BashのSSLでアクセスする

開発環境はWindows10 Pro(64bit)。ローカル環境から本番環境へアップロードするだけじゃなくて、本番環境上にて、プログラムを直接インストールしてみたいと思いやってみました。1.Git Bashを起動する2.以下の形式通りにコマンドを入力する ssh アカウント@…

Sass(SCSS)を使ってみる

開発環境は、Windows 10 Pro(64bit) + node v10.15.0。Sass(SCSS)はCSSをより短い入力で書いて、そのままではきちんと動作しないので、変換して、CSSファイルを作成する仕組みです。すでにnode.js(npm)をインストールしている前提で書いています。以下の公式…

PHPUnitを使う

PHP

開発環境はWindows 10 Pro(64bit) + PHP 7.2.12。PHPでテストを行うパッケージであるPHPUnitを利用してみたいと思います。1.カレントディレクトリをxampp内のhtdocsディレクトリへ移動し、そこで、phpunitというディレクトリを作成して、カレントディレクト…

Bootstrap4の使い方まとめ

事前に、タグの直前に、scriptタグで、jquery.js popper.js、bootstrap.jsの順番に読み込めるようにして、その後に自分独自のJavaScriptが読み込まれるようにする。 Modal ■クリックした時にモーダルを表示する 任意のボタンをクリックした時に、モーダルが…

Firefoxにて音声プレーヤーが再生されない問題を解決する

TBSラジオのサイトの音声プレーヤーで何度プレーヤーを再生しても、再生されないので、それを再生する方法を調べた。1.privacy.resistFingerprinting.block_mozAddonManager(なければ、privacy.resistFingerprinting)をtrueにする 2.extensions.webextension…

CakePHP3のバリデーションでフィールドの値がユニークなものかチェックする

開発環境は、Windows 10 Pro(64bit) + PHP 7.2.12 + CakePHP 3.6.13。Railsだと簡単にバリデーションできるんですが、CakePHPには、なぜか公式のドキュメントには専用メソッドが書いていなくて、ネットを検索したらありました。モデルのTable内にて、 add('…