サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
やる気の出し方
www-creators.com
正規表現において、特定の文字やパターンの繰り返しを記述するには、しばしば特殊文字「量指定子」を利用します。 今回、量指定子を使った、文字の繰り返しの正規表現についてまとめました。 繰り返しを表現する「量指定子」 直前の文字やパターンの繰り返し(連続)を表現する特殊文字を「量指定子」と呼びます。「何回繰り返すのか」について、回数か、または範囲を指定する記述となります。 0回以上の繰り返し「*(アスタリスク)」 代表的な量指定子の1つが「*(アスタリスク)」です。これを使って「直前のパターンの0回以上の繰り返し」を表現できます。 // 正規表現 /あぁ*、青春の日々。/ // マッチする文字列の例 あ、青春の日々。 あぁ、青春の日々。 あぁぁぁぁぁぁ、青春の日々。 1回以上の繰り返し「+(プラス)」 アスタリスクによく似た繰り返し表現が「+(プラス)」です。これは、「直前のパターンの1回以上の
行頭(行の先頭)を表す正規表現 正規表現において、行頭(行の先頭)は「^」によって、その位置をマッチできます。「^」はキャレット、または、ハットと読みます。 「^(ハット、キャレット)」を使った正規表現の例 例えば下記は、行頭が「ラーメン」で始まる文字列全体をマッチします。 // 行頭が「ラーメン」で始まる文字列にマッチする正規表現 /^ラーメン.*/ // マッチする文字列 ラーメン大好き小池さん。 「^」は何らかの文字をマッチするのではなく「位置」をマッチする点に注意して下さい。正規表現では、このような位置を表す表現は、「位置指定子」や「アンカー」などと呼ばれます。 上記の例では、「.(ドット)」は「改行以外の1文字」を表し、また「*」は、直前のパターンの0回以上の連続(上記の例では「.」の連続)を表します。このような正規表現のメタ文字の一覧はこちらの記事に詳しくまとめました。 正規表
Git を使った開発で最もよく利用するコマンドの一つ「git push」。基本動作のおさらいと、よく利用するオプションをまとめました。 git push コマンドの概要 git push はリモートレポジトリのブランチ履歴を更新するための Git コマンドです。 ローカル環境にあるブランチ上で作成されたコミット履歴と関連連する参照(e.g ブランチ名、タグ)を任意のリモートレポジトリに送信することで、そのリモート上でのコミット履歴を更新できます。 下記は git push origin master を実行した際のイメージです。origin レポジトリに、ローカルのmaster ブランチを送信します。origin 上の、同名のブランチ(ここでは master ブランチ)が更新されます。 それでは、git push コマンドの具体的な使い方を見ていきます。git push は引数の特別な指定
WordPressで、投稿のアイキャッチ画像のURL(文字列)を一発で取得する関数「get_the_post_thumbnail_url」が、Wordpress version4.4 でついにリリースされました!(2017年12月) やった〜。逆になんでいままでなかったのでしょうか。 胸のつかえが取れた気分です。 アイキャッチ画像のURLを出力する関数 まずは関数です。ズバリ:the_post_thumbnail_url() // アイキャッチ画像のURL文字列を出力する the_post_thumbnail_url( 'medium' ); サイズは、’thumbnail’, ‘medium’, ‘large’, ‘full’, の中から好きにしてください。 引数で投稿IDを渡せないのは、不便ですが、the_xxxxの、theで始まる関数は、メインループ内での利用を意図されているというこ
UbuntuなどのLinux系OSで、ユーザの追加、ユーザの一覧、ユーザグループの確認、などユーザ関連の編集作業に関するコマンドの紹介です。 サーバーを飛び回る昨今のエンジニア。「あれ、いまユーザどうなってんだっけ?」という確認と編集作業は非常によく発生するかと思います。私は、なんかだかそのたびに毎回ググっている気もするので・・、自分用の意味も含めてメモりました。 Ubuntuに、新規ユーザを追加する Ubuntuで誰もが実行する最初のコマンド。それが「ユーザ追加」です。 // 新規ユーザを追加するUbuntuコマンド $ sudo adduser USER_NAME 「useradd」じゃなくて「adduser」ですね。useradd は、ユーザ追加だけして、/home/配下のユーザディレクトリを作ってくれません。 一度覚えたつもりでも・・、時間がたつと、adduser, useradd
この記事では、3つのJavascript関数による高さの取得方法をまとめていきます。 とりわけ、モバイル環境における、ブラウザー(iOS Safari や Chrome)での高さの取得方法、ややトリッキーです。 詳しく見ていきます。 Javacscript でブラウザーの高さを取得 ブラウザーのウィンドウに高さをフィットさせるには、下記の2種類のアプローチがあります。 [A] Javascriptでウィンドウ高さを取得して、所望の要素を高さにぴったりフィットさせる[B] (Javascriptを使わずに)CSSでぴったりフィットさせる 今回、Javascript、もしくは、JQueryでの高さの方法を詳しく見ていきます。 ブラウザウィンドウの高さの取得 ブラウザーウィンドウの高さは、Javascript のdocumentオブジェクトのプロパティから、もしくは、jQueryを使って取得でき
git commit により、すでに作成したコミットのコメント(コミットメッセージ)を修正する方法についてです。 直前のコミットコメントの修正「git commit --amend」 Git で、コミットログ(コミットメッセージ、コミットログとも言います)を修正したいときは、非常にシンプルです。 git commit の「--amend」オプションを使います。 // 直前のコミットコメントを修正する $ git commit --amend 実際は、--amend オプションは直前のコミットを「置き換える」コマンドです。コマンド実行時インデックスに変更が含まれていれば、新しいコミットにその変更を取り込み、直前のコミットを置き換えます。 git commit の詳しい仕様は、こちらの記事も合わせてご覧ください。 git commit �の仕様と、主要オプションのまとめ 過去のコミットコメント
「前方一致」の正規表現 正規表現にける文の先頭を一致させる「前方一致」の表現です。 文の最初にマッチさせるためには、位置指定子(アンカー)の「^」を使って、行の先頭位置を指定することで実現できます。 前方一致の正規表現の例 // 先頭の「東京」に前方一致 ^東京.*$ // マッチする文字列 東京 東京タワー 東京三丁目の夕日 「.(ドット)」は「(空白文字以外の)なんでもよい文字」、「*」は「直前のパターンの00回以上の繰り返し」ですので、文字列が後に続くことを意味しています。 特殊文字については、詳しく触れませんが、こちらをご覧くださいね: 正規表現とは?基本構文とメタ文字一覧(サンプル付) また「.(ドット)」が改行コードを含むかどうかの取り扱いが、使用言語によって異なる場合がありますので、ご注意下さい。 正規表現:ドット「.」の意味と使い方。 「後方一致」の正規表現 同様に、後方一
ワードプレスでテーマ開発をしていると、本番データと同期した開発環境や、テスト環境がだいたい欲しくなります。 「そうだ、ステージング環境を作ろう!」 そんな時がステージング(staging)環境の出番です。後回しにしてしまいがちですが、重い腰をあげて、ステージング環境を作ってみます。 今回、最も本番環境に近いテスト環境」として、本番のデータベースを直接参照しながら、新しく変更を加えたテーマのソースコードをさくっとテストできる環境を用意します。そもそも、「ステージング環境って?」という方はまず「開発・検証・ステージング。それぞれの環境の違いと役割」をご覧下さい。 設置する環境の概念図 ワードプレス開発において、多くの場合はワードプレスの「テーマ」を開発していると思います。いまから作るのは「テーマ開発」におけるステージング環境です。具体的には、以下のような環境です。 Thmemに関するコードセッ
マルチサイト機能を利用せずとも、WordPress では、複数ドメインでの運用を実現できます。簡単なのに意外と知られていないようです。 WordPress 複数ドメインの運用。マルチサイト以外の方法。 「WordPress 複数ドメイン」と検索すると、やたらとマルチサイトを進める記事がたくさんでてきますが、マルチサイトって それなりに重厚な作りなので、結構めんどくさいのです。また、そもそもマルチドメインは「複数のWordPressサイトを運用する」には適しているのですが、「同一のサイトに複数ドメインを割り当てる」といった目的に利用するものではありません。 こちらの記事では、マルチサイト以外の方法で、複数ドメインを同一のWordPressサイトに割り当てる方法をご紹介します。 1ドメインの向き先を、該当サーバに向ける 当たり前ですが、ドメインの向き先を、該当サーバーに向けて下さい。ネームサー
もしどうしてもドルーを消したい時、下記の方法で消すことができます。 ドルーをクリックします。ドルーがびっくりして震えます。 もう一度ドルーをクリックします。震え方が変わってきます。 しばらくクリックし続けると、ドルーが薄くなってきます。 ドルーが十分薄くなると、閉じるボタンが回転し始めます。 回転する閉じるボタンをクリックすれば、ドルーを消すことができます。
正規表現における「否定先読み(Negative lookahead)」とは、メインのマッチング処理とは独立したサブパターンのマッチングの吟味(テスト)の事です。「(?!」と「)」で、サブパターンを囲み、このような記述を用います。 ここでいう「吟味(テスト)」とは、通常の「(」「)」で囲むようなサブパターンのマッチングと異なり、もしそのサブパターンのマッチが見かっても、マッチした文字列は「消費(Consume)」されず、同時に格納(Capture)されません。 これはすなわち、下記を意味します。 その後に実行されるマッチング処理の位置に影響しない。 サブパターンにマッチした文字列を後方参照するできない。 「処理位置の前方を吟味して、元の位置に戻ってきて処理を再開する。」これが先読みという由縁です。このようなテストを「言明(Assertion)」と言います。このような言明の表現は、否定/肯定の
何が正しいのか、よくわからない・・、となりがちな、HTMLのおけるviewport の書き方についてです。 viewport はこう書くのが正解 先にまず結論から。viewportはこのように書くのが正解です。当然ですが、HEADタグの中に記載してくださいね。 <meta name="viewport" content="width=device-width"> ただし、これはページを「レスポンシブ」に設計した場合に限ります。 モバイル端末への対応を行わず、PCレイアウトのみで表示させたい場合は、この限りではありません。(詳しくは後述) モバイル端末ブラウザーで、タップの反応速度が早くなる! 上記のviewport指定方法「width=device-width 」に関する、意外で最も重要なポイントは、モバイル端末では、この記述によってタップの応答が早くなるという点です。 Googleの文献
git pull して、リモートブランチの最新に合わせようとしたら・・、あれ?コンフリクト・・?なにこれ、うまくいかない!「git push -f origin masterして強制Pushはできたのに。git pull -f origin master的な強制コマンドはないの?!」 とにかくリモートに合わせたい。そんなあなたのための、解決方法と解説です。 「git pull --force」は存在しない・・。 「git push --force」というコマンドがあるので、そこから連想してしまいますが、「git pull --force」というオプションは存在しません。 git pull の強制的に実行するには、別のコマンドが必要になりますので、見ていきましょう。 git pull で、ローカルを強制上書きする方法 ローカルのmasterを、強制的にリモートのmasterに合わせる //
あ、間違って push しちゃった・・・ Git を使っていると、間違ってgit pushしてしまって、それを取り消したくなるようなケースは、時々あります。 間違えて master ブランチで作業して、中途半端なコミットを作ってしまった。しかもなぜか、間違って push してしまった・・・。 チームで共有しているリモートレポジトリに push したが、テスト不足で思いっきりバグを含んでいたので、いったん取り消したい。 間違いは、誰にでもあります。間違ったらやり直せば良いのです。 git push したコミットを取り消す それでは取り消しの方法です。解決の方針ですが、大きく2つの方針があります。 git push したコミットの取り消し方法の選択肢 ?過ちを隠す :push した、コミットを取り消し、リモートから削除。無かったことにする。 ?過ちを認める:間違いコミットを打ち消す「rever
URLの「パラメータ(クエリ文字列)」とは? URLパラメータ、クエリ文字列とも呼ばれますが、例えば、 「http://www.example.com?lib=jquery&ver=3」 における「?lib=jquery&ver=3」の部分を指します。 Javascript(jQuery)でURLのパラメータ(クエリ文字列)を取得する方法 jQueryと書きましたが、Javascriptに、クエリ文字列を取得する方法がすでに用意されています。location オブジェクトの「.search」プロパティにクエリ文字列(パラメータ)の値が格納されています。 // URLパラメータ文字列を取得する var param = location.search alert(param) // 「?lib=jquery&ver=3」が出力 極めてシンプルな変数ですので、jQueryに同じ機能の関数は存在し
正規表現での、数字に桁数に関する方法に関してです。また、これを応用して、数字の大きさの範囲を指定します。 数字の正規表現 正規表現で「数字」を表現するとき、下記のように文字クラス」を利用するか、数字を表す「エスケープシーケンス」で表現できるのでした。下記はそれぞれ1文字半角数字、すなわち、一桁の数値を表します。 //1文字の数字(文字クラス。0,1,2,...9のいずれもマッチする) [0-9] // 1文字の数字(エスケープシーケンス) \d 数字の「桁数」を指定する正規表現 この表現に、量指定子「{n}」とを組み合わせると、特定の桁数の数字を表すことができます。(Vimでの量指定子は記法が異なりますので、こちら「正規表現:特殊文字(メタ文字)の一覧」を御覧ください) ◯桁の数字 文字クラスを利用して「半角数字のいずれか」、また、量指定子「{N}」で具体的な繰り返しの数を指定して、桁数を
HTMLにおいて、フォーム要素のテキストエリア(textarea)の領域の拡大、縮小などのリサイズを禁止したり、サイズ変更に関する振る舞いを制限する方法についてです。 textarea の拡大機能について HTMLフォームのテキストエリア(textarea)要素は、デフォルトで下記のような「つまみ」が存在し、ドラッグすることで拡大することが可能になっています。 ユーザの操作によって、エリアの大きさが勝手に変わってしまい、予期せぬレイアウト乱れが発生してしまったりします。このようなリサイズを禁止し、サイズを固定するように対策します。 拡大・縮小を禁止し、サイズを固定する 下記のように、CSSのリサイズを制御するプロパティ(resize)を使って禁止し、サイズを固定することができます。 resizeプロパティを「none」に指定する事により完全に大きさを固定できます。 textarea { r
正規表現にいて、複数のパターンのうち「いずれか、または」を意味する「OR」を表現する方法についてです。 正規表現での「OR(または)」の記述方法 正規表現で「複数のパターンのうち、いずれか」といった論理和を表す「OR(または)」を記述するには、大きく2つの方法があります。 「|(パイプ)」を利用した OR の表現 文字クラスを利用した OR の表現 それでは、順番に詳しく見ていきます。 1「|(パイプ)」を利用した OR の表現 もっとも基本的な OR の表現は、メタ文字「|(パイプ)」を利用した表現です。候補となる複数の正規表現パターン同士を「|」でつなぎます。| で並列された、それぞれの正規表現パターンのいずれかが一致すれば、マッチングが成立します。 // 「Now」or「Never」のいずれか Now|Never // 「そば」or「うどん」or 「ラーメン」のいずれか そば|うどん
「上流ブランチ」とは? 「上流ブランチ(Upstream branch)」とは、あるローカルブランチが、履歴を追跡するように設定したリモートブランチの事を指します。 「追跡する」とは、そのブランチ上で発生したすべての更新をそのまま取り込む事を前提とする、という意味で、上流ブランチを設定することにより Git 自身もそのような動作をする事になります。 上流ブランチの設定値 厳密には、ローカルブランチに対する下記の設定値によって定義されます。これらの設定値は git config コマンドからは、下記の値で参照することができます。 レポジトリ:branch.<ブランチ名>.remote ブランチ :branch.<ブランチ名>.merge ですので、「上流ブランチ」は、これらリモートレポジトリとそこにあるブランチ名の設定値の組み合わせによって、一意に決まるリモートブランチと言えます。 設定値の
class TodoApp extends React.Component { constructor(props) { super(props); this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); this.state = {items: [], text: ''}; } render() { return (); } handleChange(e) { this.setState({text: e.target.value}); } handleSubmit(e) { e.preventDefault(); var newItem = { text: this.state.text, id: Date.now() }; this.setS
git pull の取り消し方法です。勢い余って pull してしまったが、やばい、コンフリクトしてしまった・・。一回やり直したい!そんなときの方法です。 それでは、git pull の取消方法に関して、2つのパターンについて、それぞれ解説していきます。 git pull したブランチが、現在のローカルブランチにマージされた場合 git pull したブランチが、現在のローカルのブランチとコンフリクトした場合 さっそく見ていきましょう。 Case 1マージが成功した時の取り消し まず、基本のおさらいですが、 git pull は「git fetch」と「git merge FETCH_HEAD」のショートハンドなのでした。詳しくはこちら: git pull コマンドの使い方と、主要オプションまとめ git pull の取り消しとは、要は pull したリモートブランチのマージを取り消しすれ
Linux やMacなどでも、ファイル転送に便利な「rsync」。でも、SSHで接続する際オプションを忘れて、何回もぐぐってしまうので、こちらに網羅的にまとめます。 rsync で SSH 接続するオプション「-e ‘ssh ‘ 」 rsync といえば、SSH接続ですが、書式がやや覚えにくいです。ssh 接続には、「-e」もしくは 「-rsh」というオプションから、SSH接続コマンドを追加することで、リモート接続前に指定したコマンドを行ってくれます。 SSH プライベートキーを指定する rsync コマンド 当然ですが、リモート側にSSHが起動している、かつSSH接続できる状態に準備が整っている事が前提です。SSHのプライベートキーを直接指定します。まだ SSH config を設定してないとき時はこれが必要ですが、普通は config を設定した利用が多いと思います。 SSHでは、キ
1点、注意が必要なのが、「テスト環境と本番環境で必ずホスト名(ドメイン、URL)が異なる」という点です。これはどうあがいても一致させる事はできません。(できなくは無いですが、やりたくない・・) こちらはあとで対応方法を記載します。一つづつ見ていきます。 SQLを同期する 最初にSQLですが、実際はこれが一番厄介です。 WordPressのデータには、何故かホスト名が紛れ込んでいます。ホスト名が紛れ込むのは(特殊なプラグインの事を忘れれば)以下のような値です。 optionsテーブル:home、siturl postテーブル:post_content postテーブル:GUID その他の値 基本的にはすべて、DBを操作して<ドメインA>文字列を<ドメインB>に置換してやれば大丈夫な気がしてしまますが、そうも行きません。補足していきます。 Wordrpessの知っておくべきSQLのフィールド
ステージング環境という言葉は、ソフトウェア開発に携わっていてもあまり聞き慣れない方もいるかもしれません。この記事では、ソフトウェア開発プロセスにおける、各種の環境(≒多くの場合、独立したサーバー環境)の違いについて触れてみます。 システム開発において、「ステージング環境」とは、本番環境に条件を限りなく近づけた「最終テスト用に用いる、本番環境と類似のテスト環境」を指します。 特に、ウェブシステムなどの継続的な保守・改修が行われるシステムにおいては、本番環境へデプロイ(リリース)直前に、その最終検証をできるだけ精密に、慎重行うため、本番環境の類似環境を用意し、実際の本番デプロイ作業やデプロイ後の状態を検証します。このような環境が「ステージング環境」と呼ばれ、しばしば以下のような目的で利用します。 本番デプロイ作業をシミュレーションする 環境設定やデータの違いによる検証漏れを洗い出す 類似の環境
Git における、git commit の取り消し方法や、やり直し操作に関する方法をまとめました。Git はどんなコミットでもすべてを記録していますので、一度間違えたとしても、いつでも昔の記録からもとに戻せ事が保証されています。 取り消しや、やり直し方法をマスターすれば、バージョン管理ツールとしてのメリットを最大限享受することができます。 git commit の取り消し方法、6選 コミットした直後に「あっ、この変更入れ忘れた!」「あっ、いらないファイルを混ぜてコミットしちゃった!」など、確認不足による間違いは、時間に追われるエンジニアに非常にしばしば発生します。そのような間違いコミットは、まだpushしていなければ、容易に取り消したり、その後コミットをやり直すことができます。 コミットの取り消しにまつわるケースを、下記の6種類に分けてご紹介します。 直前の git commit 実行を取
正規表現の「AND(かつ)」の表現 正規表現において、複数のパターンの論理積「AND」、すなわち「A、かつB」といったパターンの並列表現はややトリッキーです。初学者にはややハードルが高いかもしれませんが、記事後半に解説を加えておきましたので、よくわからない方はご一読下さい。 〇〇を含む、AND(かつ)、〇〇を含む AND(かつ)条件の例として、リテラル(=ただの文字)のマッチを考えてみます。下記は、「ラーメンを含む、かつ、カレーを含む」という、お子様も大好きなメニューの定番をマッチングする正規表現です。 // ラーメンを含み、かつ、カレーを含む文字列の表現 ^(?=.*ラーメン)(?=.*カレー).*$ 注目すべきは、「(?=」「)」の括弧です。これは肯定先読みを言いますが、こちらについては、追って解説します。 〇〇を含む、AND(かつ)、〇〇を含むまない 同様に、否定先読みを組み合わせて
Google Chrome(グーグルクローム)に保存されたキャッシュを完全に削除する方法をまとめました。また、CSSなどの外部ファイルキャッシュ、またキャッシュ削除に関連する種々の操作方法についても網羅しました。 Chrome のキャッシュクリア 通常のリロードと、キャッシュによる問題 Google Chrome にはリロード(再読み込み)ボタンや、リロードのショートカットキー(Command + R )が用意されています。 このリロードによって、Webページ自体は再読み込みで更新されるのですが、そのページ内で読み込まれているCSSや画像などの外部ファイルは、多くの場合、Chromeが保存した複製ファイル(=ブラウザーキャッシュ)を利用し続けてしまいます。 この状態では、仮にCSSなどの外部ファイルが配信サーバー上で更新されても、ブラウザは以前の複製、すなわちブラウザキャッシュを使い続けて
「〜を含まない」といった、否定の意味を持つ正規表現を記述する場合、下記のように、大きく分けて2種類のケースがあります。 「特定の1文字を含まない」といった否定表現か、もしくは「正規表現パターンを含まない」といった表現かで、大きく解決の方針が異なる点に注意して下さい。 特定の1文字だけを否定したい場合は非常にシンプルです。この場合、「文字クラス」、もしくはエスケープシーケンスで表される文字型を利用する事で表現できます。 一方で、特定の正規表現パターンを否定したい場合、少し記述が複雑になります。今回は「否定先読み」を利用した表現を、この記事の後半にご紹介します。 基本的な正規表現の記法はこの記事では触れませんので、不安な方はこちらの記事も合わせてご参照下さい: 正規表現とは?基本構文とメタ文字一覧(サンプル付) それでは、順番に詳しく見ていきます。 任意の一文字を含まない文字列の正規表現 a「
次のページ
このページを最初にブックマークしてみませんか?
『WWWクリエイターズ | ウェブと開発をもっと楽しむ情報サイト』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く