【jQuery】Webページにおける縦方向の現在位置を示すインジケーターをjQueryで実装する

この記事では,Webページにおける縦方向の現在位置を示すインジケーターをjQueryで実装します.ウィンドウのスクロール量に応じてインジケータが指し示す点も上下に移動します.また現在のインジケーター以外のインジケーターをクリックすることで,その高さのウィンドウまで自動スクロールするように実装します.Webページ全長がとても長い場合等に有効な方法です.それではインジケーターの作り方を見ていきましょう.

続きを読む

コピペで実装!jQueryでレスポンシブなハンバーガーメニューを実装する

ハンバーガーメニューとは,三本線のボタンのことです.クリックまたは,タップするとメニューが表示されます.一般的にはスマートフォン用のデザインで採用されることが多く,画面領域の有効活用ができます.もちろんPC等の画面が広いデバイスでも使用されることはありますが,今回はスマホ用の画面で,ハンバーガーメニューを表示し,大きい画面ではメニューを横並びにヘッダーに表示させます.これはCSSのみでは難しいので,jQueryを交えて実装していきます.

続きを読む

SNSアイコンのレイヤー展開するマウスオーバーアニメーションをjQueryで作る

この記事ではSNSアイコンのホバーエフェクトを作っていきます.CSSだけでも実装することはできるのですが,CSSが冗長になってしまうので,アニメーションはjQueryで作成していきます.今回は複数のレイヤーがマウスオーバー時に縦に展開するアニメーションを作成します.単純なボタンにするより,おしゃれでモダンなサイトに近づくことでしょう!

続きを読む

Node.jsのテンプレートエンジン「 EJS 」を使用してページを生成する

この記事ではNode.jsのテンプレートエンジン「EJS」を使用して,Webページを生成します.テンプレートエンジンとは,Webページを構成するHTMLを生成するための型のようなものです.HTMLだけでは毎回同じページしか表示できません.HTMLに独自機能を組み込んだテンプレートエンジンを使用することで,出力をNode.jsで書き換えることができる動的なWebページを作成できます.今回使用するテンプレートエンジンはjavascriptで利用される「EJS」を使用します.それでは解説していきます.

続きを読む

Expressで用いるプロセスマネージャー Forever & PM2

Node.jsの実行環境やクラスタリングの他にもう一つ押さえとかなければならないことがあります.それはプロセスマネージャーです.Node.jsを起動するとフォアグラウンドプロセスとなり,プロセスが異常終了した場合,アプリケーションが落ちたままとなってしまいます.そこでプロセスマネージャーを使用して,プロセスの監視を常駐で行うバックグランドプロセスとして実行することで,異常終了時に再起動してくれます.これをNode.jsのデーモン化といいます.この記事ではnodeアプリのデーモン化を行うための2つの方法を解説します.

続きを読む

Node.jsにおけるCPUを有効活用するクラスタリング

Node.jsはシングルプロセスがシングルスレッドで実行されます.基本的にスレッドは一つのCPUで動作します.もしサーバーに4コアCPUが備わっている場合,シングルスレッドでは3つのCPUコアが使われないことになってしまいます.これはCPUを有効活用できていなく,多数のリクエストが来た場合でもCPUをフル活用できません.本記事はNode.jsでマルチプロセス化する方法を解説していきます.

続きを読む

サーバーを構築するNode.js シングルスレッド&シングルプロセス

Node.jsはスケーラブルなWebアプリケーションを作成するために設計された非同期イベント駆動型のJavaScript環境です.主にはサーバーを構築することが多い言語です.

Node.jsでサーバーを構築するのはかなり簡単です.わずか数行でサーバーを作成できます.さらにNode.jsのフレームワーク「Express」を使用するとさらに楽にサーバーを構築できます.

続きを読む