Web Tips:デバッグ

スマートフォンサイトの開発環境としてEdge Inspectを利用する

Adobe Edge Inspectは、PCに表示しているWebページを、LANに接続しているスマートフォンに同期して表示するツールです。スマートフォンの操作なしでWebページの表示確認が行えるため、効率的にデバッグできる開発環境が構築できます。

XAMPP環境でLAN内の他PCからWordPressサイトにアクセスする

XAMPPでローカルに開発環境を構築している場合、LAN内の他のPCからWordPressで作ったWebサイトにアクセスする方法を解説します。これによりWi-Fiで同じネットワークに接続したスマートフォンなどからもサイトを閲覧できるので、デバッグする時に便利です。

Android 開発環境として Android SDK Tools を利用する

スマートフォンサイトの制作で、Android での表示を確認したい場合は、Android SDK に含まれているエミュレータを利用できます。Android SDK は、Windows/Mac OS/Linux の各プラットフォーム向けに提供されています。

Windowsで使えるiPhone/iPadシミュレータ「iBBDemo3」

iPhoneやiPadに搭載されているiOS用シミュレータとして、MacであればXcodeがありますが、Windowsの場合は「iBBDemo3」を使うことができます。また古いMac OSではXcodeをインストールできませんので、iBBDemo3 を代わりに使うことができます。

Webサイトのリンク切れチェックソフト「LinkCheker」

Webページ制作完了時には必ずリンク切れをチェックします。外部リンクもありますので、サイト運用でも定期的にリンク切れをチェックしなければなりません。
そんな時に便利なソフト「LinkCheker」を紹介します。

Eclipse+XdebugによるPHPのデバッグ方法

Eclipse+Xdebugを使って、PHPプログラムのデバッグをする方法を解説します。
EclipseとXdebugは個別にインストールすることもできるのですが、Pleiades All in Oneで、XAMPPとともにローカル環境にまとめてインストールしている前提で解説します。

スマートフォン画面と外観を表示するツール「Mobilizer」

Mobilizerは、スマートフォン画面をPCで表示するための無料のアプリケーションソフトです。iPhoneやGalaxyの外観がそのまま表示されますので、プレゼンテーションなどに活躍します。

Chromeデベロッパーツールでモバイルをエミュレートする

Chromeに標準搭載されているデベロッパーツールには、モバイルをエミュレートする機能が豊富に備わっています。デバイス、ユーザーエージェント、画面解像度の指定ができるだけでなく、タッチスクリーンのエミュレートも可能です。

Firefoxのユーザーエージェント切替えによるスマホサイト表示

スマートフォンサイトのデバッグをする際、Firefoxのユーザーエージェント切替えを使って、開発PC上で表示確認する方法を解説します。

PayPalテストサイト Sandboxで決済処理を検証する

PayPalの決済サービスを利用して商品を販売する際、決済処理が正しく動作するか確認する手段として、Sandboxというテストサイトが用意されています。ここにテスト用アカウントを作成すれば、実際のお金のやりとりなしに決済処理を検証することができます。

正規表現によるフォーム入力データの妥当性確認

正規表現とは文字列の形式を表現するための表記方法で、Webページではメールフォームなどでユーザーが入力した文字列の検証によく使われます。ここでは、お問い合わせや登録フォームに入力してもらう文字列の妥当性確認をする正規表現例を示します。

オンライン講座

Webの基礎マスター講座ページへのリンク


連載講座:WordPressで作る簡単Webサイトページへのリンク

提供しているサービス

WordPressサイト制作出張講座ページへのリンク

WordPress を利用した Webサイト制作の方法を、
あなたのオフィスにうかがいご説明いたします。
料金:¥28,000

サービス詳細ページ >>

申し込みフォーム >>


Webサイト1日公開サービスページへのリンク

一刻も早く Webサイトが必要な方のために、
一緒に作業し1日で公開までもっていきます。
料金:¥28,000

サービス詳細ページ >>

申し込みフォーム >>

特集記事

  • jQuery Mobile Image

    jQuery Mobile を基本から覚える
    スマホサイト制作に最適なフレームワークの利用方法を解説。DEMOページ・サンプルコードで動作を確認できます。

スポンサーリンク

ページの先頭へ