atomicbox

Macでウェブ制作するための開発関連メモを残していきます。(html/JavaScript/jQuery など)

Category: ウェブサイト (page 1 of 4)

【CakePHP3】WEBアプリ開発・開発環境の準備メモ

久しぶりにまっさらな状態からWEBアプリ(PHP7、CakePHP3.4、MySQL5.5)を作っていくので過程をメモ。
かなり個人的な備忘録になりそうだけど紙に書くとすぐ紛失するので・・・

ソースのバージョン管理・リポジトリの作成、CakePHPのインストール&データベース設定など最初の一回しかやらないからよく忘れるポイントメモ。

Continue reading

【WordPress】サーバーをPHP5.3→PHP5.6へバージョンアップ&WordPress4.7.2に更新する

久々にWordPressを色々触ってます。
クライアントさんのサーバーのPHPが5.3なので、PHP5.6にバージョンアップすることに。

サーバーは、ロリポップのライトプラン。
サーバーにもデータベースにも別々のサイトのデータやテーブルが混在していてぐちゃぐちゃです。
触るのがちょっと怖いな〜と思いつつ実施した記録です。

Continue reading

【CSS3】角丸・ドロップシャドウ・グラデーション・背景の透明化。よく使う効果のベンダープレフィックス付きまとめ

古いIEが次々と息絶えていった2016年、WEBサイトのコーディングで非常に出番の多い定番効果の「角丸・ドロップシャドウ・グラデーション・背景の透明化」、この辺りがCSS3を使ってキレイにマークアップできるようになってきました。

4つの角丸をいちいち画像にして複雑なスタイルシートを記述・・・立体感を出すためにドロップシャドウをつけたくて影だけの画像素材を作ってスタイルシートでリピート・・・そんな不毛な時代はようやく終わったのです!

あと、透明な背景とかもIEでは苦しみましたね。
半調な透明度のあるベタの背景も、IEが透明度のopacityにきっちり対応していなかった時代は大変でした。
「ただの単色で、ほんのちょっと透けてるだけでいいのに!」・・・これが通用しない。
半透明なpng画像を作り、背景画像に指定。おまけにフェードアニメを作ろうとしたらIEで画像の半調な部分が漆黒にチカチカしたりして。自分はなぜ残業してるのか?、自分はいったい誰なのか?・・・よく自問自答したものです。

opacityはもうベンダープレフィックスも必要なくなってるし、いったい僕らはいったい何に苦しめられていたんだろう?っていう時代はすでに到来しているのです。素晴らしい。

あ、あとちょっと外れますが何かと便利な「透明色」キーワードの「transparent」も、綴りを(自分が)よく忘れるので一緒に載せときます。

Continue reading

QRコード・二次元バーコードの作り方

WEBサイトを制作していると、作ったページのQRコードの作成を依頼されることがあります。
別のWEBページに張り付けたり、カタログやリーフレットなどの印刷物に貼ったりするのに使えますね。

無料ツールで簡単に作れるので、今回はQRコードの作り方を紹介します。

Continue reading

【CakePHP3】Twitter API ライブラリTwitterOAuthをComposerでインストール

Twitter APIの人気PHPライブラリーTwitterOAuthを、CakePHP3に入れてみました。
CakePHP3もTwitterOAuthもComposerに対応しているので、Composerを利用してインストールしてみました。

Composerの使い方がそもそもそんなにわかっていないので、Composerの使い方みたいな内容になってます。

Continue reading

【html5】HTML5の基本タグと、HTML5対応リセットCSS「sanitize.css」使い方サンプル

2016年1月、ついに世界のWEBデザイナーが切望していたIE8のサポートが実質終了しました。
ようやく大手を降ってhtml5に移行できるよねということで、html5の基本タグを再確認しながらソースサンプルというかデモページを作りました。

HTMLの基本を見直す良いタイミングだったので、ついでにリセットCSSも見直すことに。
HTML5に対応していて、Normalize.css系の、「オールリセットじゃなくて、ブラウザ間の差をなくす」タイプのCSS、「sanitize.css」を使ってみたので合わせてまとめておきます。

Continue reading

【html5】AMP HTML(Accelerated Mobile Pages HTML)作ってみた

2015年10月にGoogle公式で発表された、モバイルWEB高速化の新しい技術、The Accelerated Mobile Pages(AMP)について色々と調べてみました。

Official Google Blog: Introducing the Accelerated Mobile Pages Project, for a faster, open mobile web

モバイルからのアクセスに対して、予めキャッシュしておいたページデータをプロキシサーバーから応答させることで、まるで読み込み時間がゼロであるかのようにWEBページが閲覧できる、という感じの技術です。
今回はそのAMP HTMLを実際に使ってみた感じをレポートします。

Continue reading

【MAMP】CakePHP3のインストール方法

CakePHP3が登場しましたが、CakePHP3ではCakePHP2系からインストール方法やフォルダ構造などが大きく変更されました。
ギタドラ検索 beatpoolはCakePHP2系で作っているので、CakePHP3を触る口実にCakePHP3へのアップデートを検討中です。

アップデートによる恩恵があるかわかりませんが、とりあえず開発環境に入れて触ってみよっかな〜ということでCakePHP3のインストールメモです。
開発環境にはMAMPを使っているので、本記事はMAMP + CakePHP3の情報になります。

Continue reading

【CakePHP】CakePHPの構成(MVCモデル)について

CakePHPを使ったウェブアプリケーション一つ目として、(ギタドラ検索 beatpool)をとりあえず完成させました。

とりあえず動かせるレベルの内容がわかるようになったところで、改めて見直しているんですがひとつ大きな勘違いをしていたのでメモ。CakePHPにかぎらず、MVCモデルの理解がまちがってたという感じですが…

Continue reading

【Mac】YosemiteにアップグレードしたらApacheとSVNが動かなくなった

Yosemiteリリースから1年以上たったのもあり、Mac miniをYosemiteにアップグレード。
主にSVN利用のために使っていたサーバーなのですが、アップグレードしたらSVNがつながらなくなってしまいました。
最終的にはApacheを再構築するはめになったのですが、色々ややこしいこともあったので記事にしておきます。

2016/4/26 追記: SVNバックアップに使っていた「svn-backup-dumps.py」が使えなくなっていたので、使えるようにする方法を追記しました。

Continue reading

Older posts

© 2017 atomicbox

Theme by Anders NorenUp ↑