webデザ職業訓練⑤プログラミングの授業

プログラミング

2020年の職業訓練Webデザイナー養成科の体験談です。Webサイトに使用するプログラミングの授業で使った教材・学んだこと・勉強法などを紹介します。

JavaScriptを使ったサイトの授業

JavaScriptとは

JavaScriptとは、ブラウザ上でWebページに動きや複雑な機能を与えられるプログラム言語の一つです。JavaScriptはクライアントサイド(Webサイトを閲覧しているブラウザ)がコードを受け取って動作するため、外部からコードを確認できます。

こんなことができます。

Javascriptでできることの一例
例)メニューバーや文字に動きを与え
例)画像や地図などを拡大縮小、動かせる など

動きがあるサイトはユーザーの目線を集めやすく印象に残ったり、使い方によって情報がわかりやすく伝わったりできますね。

市販テキストで基礎を学び、プリントで実践問題

職業訓練では、webデザ職業訓練④の記事で紹介したテキスト「30時間でマスターWebデザイン」の第5章と付録の章で基本を学びました。

市販のテキストで学んだこと

JavaScriptの基本的な書き方・変数・関数・条件分岐・繰り返し処理・jQueryなど。

※JavaScriptの書き方などを簡単にすることが出来る、JavaScriptで作成されたライブラリ

テキストで使ったJavaScriptの例
例1)タイムセールのお知らせページで、現在の日時を表示
例2)現在の時刻に応じて「セール中!」と表示
例3)ケーキ予約画面でプレート(板チョコ)にメッセージを自由に書けるようにする

オリジナルテキストとプリントで学んだこと

オリジナルテキストで学んだこと
・サイトに流れる文字を表示する
・タイプライターで打っているように表示する
・時間に合わせたメッセージを表示する(朝は「おはよう」、夜は「こんばんは」等)
・日数のカウントダウン(ライブまであと○日!など)
・4択クイズができるホームページ
・スライドショーの作成

プリントで学んだこと
・消費税を計算して表示するサイト
・アクセスした曜日により、異なる画像・メッセージを表示(テレビ番組表)
・選択ボックスに、自動で複数のチェックマークを入れる など

勉強法

授業の内容が難しくなってきたので、私は本屋に行って初心者用に書かれているJavaScriptの本も購入して勉強しました!
ネットの動画で勉強するのもオススメです。

今後ブログで、少しずつJavaScriptについて解説できるように頑張りたいです。

PHPを使ったサイトの授業

PHPとは

PHPとはHypertext Preprocessor(ハイパーテキストプリプロセッサー)の略で、Webアプリケーションの開発に適したプログラミング言語です。PHPの処理はサーバーの方(サーバーサイド)で行われるので、外部からはコードを確認できません

PHPでできることの一例
例)ブログ、SNSの制作
例)ショッピングサイト、会員制サイトなどの制作
例)お問い合わせフォームの作成 など
※「データベース」を使用するので、訓練校で一緒に勉強します

PHPを勉強すると、お問い合わせフォームで入力したことを再表示させたり、会員がログインできるサイトなどを作ったりできます。

市販テキストで「宿泊予約」サイトを制作

職業訓練では、「30時間アカデミック PHP入門」というテキストを使用。学生のサークル合宿などで使うペンションの予約サイトを制作しました。

PHPはHTMLの中に埋め込めるので、HTMLでサイトのベースを作った後にPHPで予約システムを実装する感じです。

市販テキストで学んだこと

・HTML5によるWebページ作成
・PHPの初歩
・データベースの利用
・オンライン予約システムの実装1(部屋の詳細表示)
・オンライン予約システムの実装2(予約する機能)
・予約管理機能(オーナー側)

PHPは特に難しかったので、予約サイトが機能した時には感動しました!

プリントで実践問題

配列、変数、簡単なプログラム作成(空欄を埋める)などをプリントで学びました。単元が終わった後のテストでは、選択問題だったので助かりました〜(汗)

勉強法

JavaScript同様、初心者用の本を買ったりネット動画で勉強したりしました。ネットで評判の良い本を探し、書店でも内容を確認してわかりやすい説明の本を選びました。

私の場合、mac使用でXAMPPのバージョンは新しいバージョンで動きました。

まとめ

・職業訓練の授業では、サイトで使用されるプログラミングの基礎を学べる!
・授業で配られるプリントで実践問題を練習。
(JavaScript/PHPの内容は難しいが、プリントを理解していればテストは大丈夫です)
・初学者向けのわかりやすい本やネットの動画学習などでも勉強する。

タイトルとURLをコピーしました