WebEngine

だらだらと綴る技術系メモ

Milkcocoaを使って簡易チャットを制作

前提 Google Chromeでしかテストしていません Milkcocoaってなに? Uhuru社から提供されているBaaS(Backend as a Service)です。 Baasというのは、「自分でサーバを用意して、データベースを入れて〜」というような一連の環境構築をする必要がなく、さらに…

内部結合と外部結合[SQL]

前提 環境:MySQLを使います(mysql Ver 14.14 Distrib 5.7.18) 結合とは 結合とは、複数のテーブルを特定のキーで結びつけて処理することです。 DBを使ったシステムやアプリケーションの多くは、1つのテーブルだけで実装されていることは少なく、 何枚かの…

PHPのforeachの罠

php

foreachの$valueは参照渡しではない $arrayに格納されている要素を、すべて空文字列に置き換えたいとします。 方法はいろいろありますが、今回はforeachの話なので、foreachを使います。 string(3) "php" [1]=> string(6) "python…

PDOのfetch系メソッド

前提 PHP 5.6 mysql Ver 14.14 Distrib 5.7.18 Google Chromeでしかテストしていません PDOのfetch系メソッドをまとめただけです テストデータを用意 ※ fetch系メソッドだけ調べたい方は下の方まで飛ばしてください ターミナルでMySQLを起動。それから以下の…

値が重複することを考えて連想配列をソート[PHP]

php

2017.5.9修正 この記事のタイトルは「キーに優先順位をつけて連想配列をソート」というものでしたが、読み返したところ誤解を招く表現であると考え、「値が重複することを考えて連想配列をソート」というものに変更させていただきました。(ソースコード内の…

ComposerでSmartyを入れて遊ぶだけ

php

Composer 最近のPHPerには必須のツール。PHP系ライブラリをインストールする際、依存関係を標準的に管理してくれる。(ある ライブラリをインストールした際、あのライブラリも要るのかあ、という状況を解決してくれる) Smarty PHPのテンプレートエンジン。…

jQueryでAjaxを扱う

前提 Google Chromeでしか検証していません Ajaxを使うメリット 非同期通信ができることです。 具体例を挙げると ユーザのストレスを軽減できる サーバへの負荷を軽減できる というメリットがあります。もちろんデメリットもありますが、ほかのサイトでいろ…

Node.jsでいろんな形式のデータを扱う

注意事項 以下のファイルの文字コードはすべてUTF-8で実装しているので、Windows環境などでは、日本語が 文字化けする可能性があります。それらを踏まえた上で、テスト用のテキストなどに日本語 を使うことは避けていますが、やはり、環境によっては上手くい…

Node.jsでSQLite3を使ってみる

環境 Ubuntu16.04 Node.js v7.7.1 npm 4.1.2 SQLite3をnpmでインストール node.jsはサーバサイドでjavascriptを扱えるようにしたもの。当然、データベースも扱うことが できます。 今回はSQLiteというデータベースを使ってみます。ほかの選択肢としてはmongo…

Expressを使ってみる

Expressってなに Node.jsのウェブアプリケーションフレームワークです。Node.jsのフレームワークはKoaや RailsライクなSailsなんかがありますが、おそらくExpressがもっとも有名ではないかと 思います。 準備 環境:macOS Sierra10.12.3 とりあえず本家サイ…

MacにNode.jsをインストールする

前提条件 2017.2.19現在の情報 homebrewインストール済み 現在node.jsが入っていない 黒い画面を操作できる 手法 node.jsをインストールする方法はいろいろあるのですが、今回はnodebrew というものを使います。nodebrewでは複数のnode.jsを切り替えたりして…

vimのカラースキーマをMolokaiにしただけ

vim

Molokaiが結構良いみたいなので Macのターミナルのvimでやっています(Windowsだとおそらくキツイ) 今までデフォルトのカラースキーマで満足していたのですが、ほかの人のvimを見て「いいな」と思い導入することにしました。 続きを見てもいいですが、僕が…

今さらながら == と === の挙動の違いをチェック

そもそもコレなんて呼ぶ PHP、javaScriptで、いつも使っているけど、何て言うのか 覚えていますか? ネット上とかで毎回見ているけど、意外とスルーしていたりします。 正解は == 等価演算子 === 厳密等価演算子 うーん、会話で使うには長いんですよね。普段…

javaScriptのthis

thisイコール「自分自身」からの脱却 以下のコードはGoogle ChromeとFireFoxでしかテストしていません コードにはjQueryを使用しています 先にコードとコンソール(開発者ツール)での結果を出します。 <div id="test_zone"> <button id="test_button">テストボタン</button> </div> $(function() { "use strict"; console.l…

CSS3で光沢を表現する

ナビゲーションをつくる 今回は以下のナビゲーションにlinear-gradientを施す形で光沢を表現します。 コードは以下の通り。 <html lang="ja"> <head> <meta charset="utf-8"> <title>DEMO</title> <link rel="stylesheet" href="style.css"> </head> <body> <nav> <ul> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Works<…</a></li></ul></nav></body></html>

よく使うdisplayプロパティまとめ

displayプロパティとは? displayプロパティはCSS3において、要素の表示特性を操作するものです。たとえば、ブロック要素をインライン要素に 変更したり、その逆にしたりすることが可能です。(HTML5ではブロック要素やインライン要素といった分類は廃止されま…

JavaScriptでオブジェクト指向プログラミング

JavaScriptの特徴 JavaScriptは立派なオブジェクト指向言語です。ただし、Javaなんかのオブジェクト指向言語とは かなり異なる部分があり、オブジェクト指向を知らない初心者がJavaScriptから勉強しはじめると 混乱に陥ります。 まず、JavaScriptにはクラス…

PHPでJSONを扱う

php

JSONってなに? JSON(JavaScript Object Notation)は、テキストフォーマットの一種です。シンプルで 開発者が理解しやすい構造をしており、コンピュータにとっては高速で処理しやすいというすぐれもの。 WebAPIなどを使って引っ張ってくる形式のファイルはCS…

パスワードをデータベースに保存するときは、一緒に塩を入れよう

セキュアに保存する -> 漏れた場合を想定する データベース(以下DB)にパスワードを保存するとき、そのまま (平文で)保存してはいけません。データが漏れた場合に、パスワードが 見た瞬間わかってしまうからです。 パスワードを保存する場合、暗号化してからD…

strictモードで厳格なjavaScriptを書こう

strictモードとは? 近頃見られるようになった下記のような記述。javaScriptを書く際、必須になりつつあります。 (function() { 'use strict'; // 処理 })(); jsファイルの先頭に 'use strict'; と記述することにより、strictモードを 宣言することができま…

Vagrant + CentOS6.4 + rbenv でRuby環境構築

Step.0 前提条件 VirtualBoxインストール済み Vagrantインストール済み WindowsならばPuTTY or TeraTermインストール済み Step.1 Vagrant上CentOSを導入 ターミナルから作業ディレクトリに移動。なければmkdirでつくります。 Vagrantbox.esから 使えそうなCe…

gitを使ってみよう(共同作業編)

git

チーム作業を想定 共有リポジトリ(share.git) Aさんの環境(dir_a) Bさんの環境(dir_b) の3つがあると想定します。 共有リポジトリの作成 リモートサーバやネット上に存在するものです。 共有リポジトリの初期化は(share.git下で) git init --bare というコマ…

Vagrant + Ubuntu14.04 でLAMP環境構築

追記(2017.1.7) 久々に見直したところ、step.5の工程が必要ないことに気づきました。必要ない方は飛ばしてもらって結構です。 Step.0 前提条件 VirtualBoxインストール済み Vagrantインストール済み WindowsならばPuTTY or TeraTermインストール済み Step.1 …

プログラミング初心者こそVagrantを使うべきではないのか、と一瞬思ったけど・・・

Vagrant(ベイグラント)ってなに? 仮想環境をすごく簡単に構築できるソフトウェア VirtualBox、VMWare Playerをターミナルから扱える 破棄もコマンド一発でできるので、開発サイクルが速い現場で重宝される vagrantup.com(公式サイト) なぜ仮想環境を構築す…

jQueryでボタンの連続クリック防止策

やりたいこと ボタンの2度押しを防止する 処理されていることがわかりやすいようにユーザに伝える 実装例 <html lang="ja"> <head> <meta charset="utf-8"> <title>連続クリック防止策テスト</title> </meta></head></html>

PHPでクロスサイトリクエストフォージェリ対策を実装

php

クロスサイトリクエストフォージェリ(CSRF)とは? ユーザの意図しない操作を、そのユーザの権限で実行させてしまうという恐ろしい攻撃です。CSRFと略称で呼ばれること が多いです。 たとえば、情報発信系サービスであれば、AさんがログインすればAさんしか…

PHP簡易カレンダー作成

php

DateTimeクラスで簡易カレンダーを実装 date()関数で書いても良いのですが、サンプルがインターネット上に結構あったので、今回はDateTimeクラスで実装してみようと思います。DateTimeクラスは日付をオブジェクトとして扱うことのできるクラスです。個人的に…

gitを使ってみよう(実践編)

git

gitの流れ 前回、testというディレクトリを作業ディレクトリ として初期化しました。今回は、このディレクトリ内でgitコマンド を使っていきたいと思います。 とりあえずtest.txtなどのなにかしらのファイルをつくってみましょう。 Hello,Git!! 作成できたら…

gitを使ってみよう(設定編)

git

初期設定 ターミナル(Git Bash)を開いて、以下のコマンドを入力します。 git config –-global user.name “username” git config –-global user.email “email@example.com” 以下の設定でディレクトリ下に.gitconfigという設定ファイル が作成されます。エディ…

filter_input関数を使って簡潔なコードを書こう

php

filter_input関数ってなに? (HTMLフォームのinputタグなどから)外部変数を受け取り、フィルタリングする関数。 一般的には、ユーザが入力した値などが妥当であるか調べたりするのに使います。 利点 通常フォームなどから値を受けとるとき、以下のように書く…

SQLインジェクション対策の一歩としてプレースホルダを利用する

そもそもSQLインジェクションとは? 悪意を持ったユーザが入力フォームなどにSQLを打ち込んで、不正に データベース(以下DB)にアクセスすること。XSS(クロスサイトスクリプティング)に次いで 有名な攻撃手法とも言われます。 この攻撃を受けると・・・ D…

MySQLで大容量のデータを挿入する前に

MySQLに大容量の画像を挿入する前に確認したいこと ちょっとした画像アップローダをPHP+MySQLで実装したのですが、下記のようなエラー を吐きました。 Row size too large (> 8126). Changing some columns to TEXT or BLOB or using ROW_FORMAT=DYNAMIC o…

emptyとisset

php

emptyとissetの違い ※ここに書いてあるのは、PHP5以上のバージョン話になります。 過去のバージョンでは仕様が若干違うようです。 empty -> 変数が空かチェックする isset -> 変数がセットされているかチェックする この2つ、よく使うわりにバグの温床になり…

inputタグのvalueにPHPを組み込む

php

inputタグのvalueにPHPを組み込む 初心者は意外なところでつまずいたりします。たとえば、プログラミング初心者が コード内に全角スペースを入力してしまうのは王道的なミスでしょう。この記事の 内容も若干それに近いです。熟練のPHPerの方はもっと有益なサ…

Markdown表記メモ

Markdown表記 はてなブログでどこまでのMarkdownが反映されるのか、まだ調査中ですが、一般的な記法をメモしておこうと思います。 段落・改行 次のような仕様になっているようです。 段落内の改行は無視される 段落内で改行したいときは、行末に2つ以上の半…

はてなブログにコードを載せる

ブログにコードを載せる プログラミング関係の記事を書いていこうと考えているので、こういうことは先に調べておこう と思いました。忘れそうなのでメモしておくことにします。 Gistを利用する方法もありますが、せっかくMarkdownを使っているので、しばらく…

はてなブログでMarkdown表記

はじめての投稿になります。HTMLについての知識はある程度あるので、流行りの(?)Markdown表記でブログを書いていくことにしてみました。