2025/12/15 学科・サーバーサイドプログラム基礎【オンライン】

-本日のアジェンダ-



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

・Wordpressとは?
WordPressは、オープンソースのブログソフトウェアである。
PHPで開発されており、データベース管理システムとしてMySQLを利用している。
単なるブログではなくコンテンツ管理システム としてもしばしば利用されている。

・CMSとは?
コンテンツマネージメントシステム

・WordPressの仕組みについて
サイトを作成するにはサーバーが必要。
このサーバーは自作することも可能ですが、それには専門的な技術が必要でサーバー構築の知識がない方はレンタルサーバーを利用するのが基本。

サーバー:土地
Webサイト:家
ドメイン:住所


・MySQLとは?
「SQL」は「データ操作言語」
データベースサーバーの中に入っているデータを取り出したり、データを書き込んだりと言った処理は、
SQLによって制御。

・PHPとは? Hypertext Preprocessor(ピーエィチピー・ハイパーテキスト・プリプロセッサ)
PHPはHTMLに埋め込むことができるため、Web開発でよく使用されるスクリプト言語です。
PHPとJavaScriptの大きな違いは、そのコードがどこで実行されるかにあります。
JavaScriptは、クライアントサイド(Webサイトを閲覧しているブラウザ)がコードを受け取り、そこで動作します。
そのため、どのようなコードが書かれているのか、誰でも見ることができてしまいます。
一方、PHPはサーバーサイドでコードを実行します。クライアントサイドはその結果のみを受け取るため、
どのようなコードで導き出された結果なのか見ることができません。

調べてみた:
C言語やJavaなどと比べて、書いて動かすまでが簡単。PHPは主にWebサーバ(ホームページやWebサービスを置くサーバ)上で動くプログラムを作るためのプログラミング言語です。バッチ処理もできるが他に得意な言語があるので推奨はされていない。

HTML:文章構造
CSS:見た目
Javascript:動きの補足
PHP:データとの連携

※PHPは橋渡し的な役割も行う

・具体的にWordPressが扱える必要なスキルレベルとは?
主に3段階
①日々の運用更新(投稿ページ・固定ページの編集)
②デザインの変更(HTML・CSS)の編集レベル
phpの編集は必要になるがHTML・CSSの編集が出来れば対応可能なレベルのお仕事
※実績が必要な部分。先生は実務5年経ってできるようになったとのこと。
③オリジナルテーマ作成を含むシステム開発要素を含む制作
phpを利用して管理画面を含むシステム開発要素も含む箇所の編集が必要なお仕事

・PHP詳細について
PHP どういう時に使う?
PHPは、Web系のプログラミング言語の中で最も使われている言語のひとつです。 シンプルかつ手軽なコーディングで動的なサイトを作ることができるた め、CMSやECサイト、SNSなどさまざまなジャンルのWebサイトに用いられています。

PHPとは何でしょう?
PHP ( PHP: Hypertext Preprocessor を再帰的に略したものです) は、広く使われているオープンソースの汎用スクリプト言語です。 PHP は、特に Web 開発に適しており、HTML に埋め込むことができます。
書くときはPHPだがサーバーサイドがHTMLに置き換えられるので見れなくなってる。

PHP HTML どこに書く?
PHPコードをHTML内に記述するには、PHPコードを記述する箇所を開始タグ:「 」 で囲みます。 開始タグと終了タグで囲 まれた中にPHPコードを記述するとサーバーがPHPコードとして実行します。 つまり、「ここからここまでPHPで記述しますよ」という宣言になります。

PHPファイルの拡張子は何か?
PHPプログラムの拡張子は「.php」です。
WordPressとPHPの関係性 実は、WordPressというシステム(CMS、Contents Management System)は、PHPによって構築されているのです。 そのため、WordPressを利用す るということは必ずPHPもついて回るということになります。

◎ポイント
PHPはHTMLの延長と考えて、WordPressの利用でよく見かける技術として今後に備えておきましょう。
まずは、しっかりとHTML・CSSを理解しましょう。

2限目
学科 サーバーサイドプログラム基礎
WordPressのPHPでの役割について

・インターネットの仕組み
インターネットは、家や会社、学校などの単位ごとに作られた1つ1つのネットワークが、さらに外のネットワークともつながる
ようにした仕組みです。
ネットワーク上で、情報やサービスを他のコンピュータに提供するコンピュータをサーバ、サーバから提供された情報やサービスを利用するコンピュータをクライアントと呼びます。
私たちが普段使うパソコンや携帯電話、スマートフォンなどは、クライアントにあたります。

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

・サーバーサイドプログラムとは?
サーバーサイド言語とはサーバー内部で動くもので、フロントエンドのプログラムからの指示を受けることで複雑またはデータベース依存の処理を行う仕組みを作るプログラミング言語です。
サーバーサイド言語は一言で表すと『フロントエンドに必要な情報を送るためのプログラミング言語』といえます。このサーバーサイドはバックエンドと呼ばれることもあります。
サーバサイドが存在することでユーザーが目に見えるフロントエンドに適切な情報が反映されてサービスが利用できるようになっております。

・プログラミング言語
Webエンジニアになるためには、どのようなタイプのWebエンジニアであるかに応じて、さまざまなプログ
ラミング言語を知っておく必要があります。よく使用される言語の例としては、次のようなものがあります。
フロントエンド:HyperText Markup Language(HTML)、Cascading Style Sheets(CSS)、JavaScript
バックエンド:Java、PHP、Ruby on Rails、Python、ASP.NET、Golang、SQL、Node.js

・フロントエンド開発とバックエンド開発の違いとは?
フロントエンドエンジニア
・プログラミング言語
Webエンジニアになるためには、どのようなタイプのWebエンジニアであるかに応じて、さまざまなプログ
ラミング言語を知っておく必要があります。よく使用される言語の例としては、次のようなものがあります。
フロントエンド:HyperText Markup Language(HTML)、Cascading Style Sheets(CSS)、JavaScript
バックエンド:Java、PHP、Ruby on Rails、Python、ASP.NET、Golang、SQL、Node.js

・フロントエンド開発とバックエンド開発の違いとは?
フロントエンドエンジニア
・プログラミング言語
Webエンジニアになるためには、どのようなタイプのWebエンジニアであるかに応じて、さまざまなプログ
ラミング言語を知っておく必要があります。よく使用される言語の例としては、次のようなものがあります。
フロントエンド:HyperText Markup Language(HTML)、Cascading Style Sheets(CSS)、JavaScript
バックエンド:Java、PHP、Ruby on Rails、Python、ASP.NET、Golang、SQL、Node.js

・フロントエンド開発とバックエンド開発の違いとは?
フロントエンドエンジニア
・プログラミング言語
Webエンジニアになるためには、どのようなタイプのWebエンジニアであるかに応じて、さまざまなプログ
ラミング言語を知っておく必要があります。よく使用される言語の例としては、次のようなものがあります。
フロントエンド:HyperText Markup Language(HTML)、Cascading Style Sheets(CSS)、JavaScript
バックエンド:Java、PHP、Ruby on Rails、Python、ASP.NET、Golang、SQL、Node.js

・フロントエンド開発とバックエンド開発の違いとは?
フロントエンドエンジニア
・プログラミング言語
Webエンジニアになるためには、どのようなタイプのWebエンジニアであるかに応じて、さまざまなプログ
ラミング言語を知っておく必要があります。よく使用される言語の例としては、次のようなものがあります。
フロントエンド:HyperText Markup Language(HTML)、Cascading Style Sheets(CSS)、JavaScript
バックエンド:Java、PHP、Ruby on Rails、Python、ASP.NET、Golang、SQL、Node.js

・フロントエンド開発とバックエンド開発の違いとは?
フロントエンドエンジニア
・プログラミング言語
Webエンジニアになるためには、どのようなタイプのWebエンジニアであるかに応じて、さまざまなプログ
ラミング言語を知っておく必要があります。よく使用される言語の例としては、次のようなものがあります。
フロントエンド:HyperText Markup Language(HTML)、Cascading Style Sheets(CSS)、JavaScript
バックエンド:Java、PHP、Ruby on Rails、Python、ASP.NET、Golang、SQL、Node.js

●フロントエンド開発とバックエンド開発の違いとは?
フロントエンドエンジニア
・HTML、CSS、JavaScriptなどのフロントエンド開発向け言語の知識
・Webフレームワークの知識
・レスポンシブデザインの知識
・テストやデバッグの能力
・問題解決能力
・コミュニケーション能力
・Webブラウザの理解
・UIデザイン能力

※WEBデザイナーはこちら側

バックエンドエンジニア
・コード作成と編集能力
・SQLなどのデータベース技術の知識
・バックエンドフレームワークとプログラミング言語の知識
・セキュリティコンプライアンスの知識
・問題解決能力
・コミュニケーション能力
・モバイルWeb開発の知識
・情報整理力

●レンタルサーバについて
レンタルサーバーの特徴として、1台のサーバーを複数人が共用利用している事によって比較的安価で利用
できる点、サーバーの管理は提供元が行うといった点が挙げられます。

・ドメインとレンタルサーバーの関係
サーバー:システムファイルやデータを配置するための領域です。また、複数のユーザーが訪問した際にリクエストに応じて、必要な情報の提供や処理を行う役目を担っています。

ドメイン:レンタルサーバーを契約するのとは別に、ドメイン業者から独自ドメインを取得する契約をします。ドメインはその場所を特定するための住所の役割を果たします。

メールサーバーとは?
レンタルサーバーには、Web サイトを運営するための「 Web サーバー」の他に、メールの送受信やメールアドレスの運用ができる「メールサーバー」と呼ばれる機能も付随しています。
この機能で作成したメールアドレスのドメインは、 Web サイトの URL に使っているドメインと同じものになります。
例えば Web サイトのユーザーとメールでやり取りする際、ドメイン名と同じメールアドレスで送信ができれば、ユーザーは安心して内容を確認できるでしょう。

・簡単インストールの機能について
国内の主要なレンタルサーバーには、WordPressなどの外部プログラムを自動でインストールできる機能が用意されています。簡単インストール機能を利用すると、手動でインストール作業を行う手間を省くことができ、ブログの構築にかかる作業時間を短縮できます。

・主なレンタルサーバーと各社 基本は有料(年間1万円以内)
エックスサーバー エックスサーバー株式会社 ※訓練校で使用
ConoHa WING GMOインターネット株式会社
お名前.comサーバー GMOインターネット株式会社
コアサーバー GMOデジロック株式会社
ヘテムル GMOペパボ株式会社
ロリポップ GMOペパボ株式会社
mixhost アズポケット株式会社
カラフルボックス 株式会社カラフルラボ
さくらのレンタルサーバ さくらインターネット株式会社
スターサーバー ネットオウル株式会社

・ドメイン
サーバーを借りるとだいたいフリードメインがついている
独自ドメインになると値段が別で年間1万円ほどかかる

・ワンポイント「サーバー選びは最初に行いましょう!
お仕事時に一番最初に確認すべき事として
◎どのサーバーを利用しているか?
◎どのサーバーを利用するか?

これは、企画初期に確認を行いましょう。
後から、出来る出来ない問題が発生してしまいます。

例:ワードプレスを使って作ってほしいのに使用しているサーバーではワードプレスが使えないなどのとき、サーバーはどうするか?という相談から始まる。

4限目
学科 サーバーサイドプログラム基礎
課題作成

      ftp
ローカル内 → サーバー
HTML,CSS    HTML,CSS

5限目
学科 サーバーサイドプログラム基礎
課題作成


本日のテーマ

WordPressはphpで出来ています。

ワンポイントアドバイス

PHPはHTMLの延長と考えて、Wordpressの利用でよく見かける技術として今後に備えておきましょう。まずは、しっかりとHTML・CSSを理解しましょう。
PHPのファイルにHTMLを記述できるわけですから 必要性と使いどころをまずは理解して、一つ一つ理解してい くのが良いでしょう。

本日の課題

提出課題はありません。
就職活動に応じた作品制作、ポートフォリオのまとめやコーディングの続きを進めましょう。

本日学んだこと

WordPressの仕組みについて
JavaScriptはクライアントサイド、PHPはサーバーサイドで動く言語でデータとの連携で使われること
JavaScriptは検証ツールでコードが読めるがPHPはHTMLに変換されてでてきているので検証ツールで読めないこと
フロントエンド開発とバックエンド開発があり、WEBデザイナーは主にフロントエンド開発を行うことが多いが人によってバックエンド開発まで入ることもある。
レンタルサーバーを使用するには今は簡単インストールなどもある。またドメインをどうするかによっても値段が変わる。
WEBデザイナーになったとき最初にクライアントにサーバーは今何を使っているか、今後何を使うかを相談することが大切

ポートフォリオメモ:
企業向け固定ページはメニューに出しても出さなくてもよい。
AIなどに相談しつつ企業で求められていそうな作品を3つ~程度固定ページで作成
パスワードをかけて企業に送るとよい。

感想

本日はWorsPressの仕組みについて主に学びました。
またその中でサーバーやPHP、MySQLについて勉強しました。
最近固定ページのレスポンシブ対応で追加CSSなどを触ってみたりしていて多少理解できてきた気持ちでいましたが、新たにPHPもあるということを知りWordPressは奥が深いなと感じました。
また、サーバについてはWEBデザイナーではあまりかかわりがないイメージでしたが、サーバによってできることできないことがあるとのことでWEBデザイナーであっても最初にクライアントがどのサーバーを使っているか、どれを使うかという部分をしっかりすり合わせておく必要があると学びました。

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

上部へスクロール