学科 サーバーサイドプログラム基礎

-本日のアジェンダ-

1限目
学科 サーバーサイドプログラム基礎
サーバーサイドプログラムについて

2限目
学科 サーバーサイドプログラム基礎
サーバーサイドプログラムについて

3限目
学科 サーバーサイドプログラム基礎
作品制作

4限目
学科 サーバーサイドプログラム基礎
作品制作

5限目
学科 サーバーサイドプログラム基礎
作品制作

本日のテーマ

WordPressをインストールしてみます。

サーバサイドスクリプト

PHPやPerlといったプログラミング言語があります。
これらの言語はWebサーバ上で動作します。このことから、これらの言語を「サーバサイドスクリプト」と呼びます。
何らかの操作を実行すると、Webサーバにデータが送信され、サーバの中のプログラムが処理を行い、結果をブラウザに返します。

クライアントサイドスクリプト

一方、JavaScriptでは、記述したHTMLファイルはWebサーバ上でも公開されますが、ブラウザさえあれば実行することが可能です。
Webサーバは必須ではありません。
これは、Webブラウザ内でプログラムが実行されるためです。
このようなスクリプトのことを「クライアントサイドスクリプト」と呼びます。

必要な知識として

合わせて(更に上級編)

それを整理すると

  • 1.まずプログラムが動くサーバーを用意
  • 2.PHPやCGIのプログラムファイルを用意
  • 3.HTML・CSS (JavaScriptで動作) でデザインをカスタマイズする

参考サイト

WordPressとは

WordPress(ワードプレス)は、ブログやサイト(ホームページ)を作成できるソフトです。今や、世界中のサイトの約3分の1はWordPressで作られていると言われています。日本国内でも、個人ブログだけでなく、企業や公共機関のサイトなどに幅広く利用されています。

参考サイト

インストールしてみましょう。

PHPとは

PHPとは動的にWebページを生成することができるサーバーサイドのスクリプト言語です。他のプログラミング言語と比較して仕様や文法が簡単なため習得しやすいと言われています。またMySQLなどのデータベースとの連携が容易なことなどから、WordPressを含めたWebアプリケーションの開発にもよく使われる有名なスクリプト言語でもあります。

参考サイト

ワードプレスのファイル構造

Contact Form 7

Classic Editor

参考サイト

参考サイト

ワードプレスのサーバー移転とバックアップについて

参考サイト

実技 JavaScript(jQuery)実習②

本日のアジェンダ-

1限目
実技 JavaScript(jQuery)実習②
jQueryプラグイン(カルーセル)の利用

2限目
実技 JavaScript(jQuery)実習②
jQueryプラグイン (カルーセル) の利用

3限目
実技 JavaScript(jQuery)実習②
jQueryの利用

4限目
実技 JavaScript(jQuery)実習②
作品制作

5限目
実技 JavaScript(jQuery)実習②
作品制作

本日のテーマ

jQueryプラグインを自分のサイトに導入してみましょう。

jQueryとは

JavaScript初心者のためのjQuery入門

jQuery
jQuery公式サイト
jQuery日本語リファレンスの例
jQuery リファレンス

参考サイト

例:フェード

例:ハンバーガーメニュー+ナビゲーションドロワー


例:カルーセル(スライダー)

参考

カルーセルUIは使いやすい?デザインの観点から影響を考察してみました
カルーセルUI例:
 東リファブリックフロア | TOP
 東リファブリックフロア | GALLERY | 施工例