Re:ゼロからのホームページの作り方①

2017年4月12日

どうも、リンクシェルModernKatzeのリーダーPokdonです。
仕事は、ドカタをやってたのですが、トラックで事故を起こしてしまい、現在無職です。

ADHDという障害持ち故に、一つのことに集中できなくて常に気が散っていて、骨折や同僚に怪我をさせたりするため、仕事が向いてないと周りから言われ、んじゃ何が向いてるの？ってなった時、発達障害の人はプログラマーが向いてたり多いという話を聞きました。
だったらダメ元でプログラマー目指して見てはどうだろうっと思いました。

丁度そんなとき、「リンクシェルの会話でホームページが欲しい！」と言う発言があったので実際に作り始めて現在に至ります。

ホームページ作成って樂しいですよ！
すぐ結果に結びつくし、結果が目に見えて色々変わってくるのが楽しいです。

まずこのホームページを作ってる言語の紹介をします。

・HTML
ブラウザ(ホームページ閲覧ソフト)で表示する基本の画像や文字を表示するための言語。
・CSS
HTMLの機能を拡張して、ホームページの見た目をかっこよくしたりする事が出来る言語。
・PHP
掲示板とかホームページを更新するのにサーバーとやり取りするための言語。
・JavaScript
HTMLの内容をチェックしたり、変更をするための言語。
・SQL(MySQL)
データーベースというデータを保存しておく場所を操作する言語。

次にこのホームページを作ってるのに使ってるものをまず紹介したいと思います。

エディター(HTML等プログラミング言語を書くソフト)

メモ帳(Windowsに最初からついてるソフト)
適当な所で右クリック　新規作成からテキスト　ドキュメントで出てきます。
実はこのホームページは、このメモ帳だけでできちゃいます。
メモ帳って実は万能なソフトなんです。
ただ、これだけだと白と黒で見づらいので、主にサクラエディタと言うソフトを使って見た目を良くしてメインで使ってます。

サクラエディタ(フリーウェア)
このソフトは、HTML(ホームページを作る時に主に使う言語)に自動的に色付けしてくれて、見た目を良くしてくれます。
また、プログラムを書いた際に間違えると、「何行目にエラーが出ましたよ。」とエラーが表示されるのですが左側に行数の番号が振ってあるので、すぐに問題の箇所をチェックすることが出来ます。
ただ、これだけだとプログラムがよくわかんないのに、何のエラーがどうやって起きたのかわかんないよ！具体的にドコが原因でどんなエラーが起きたのか教えてくれよ！なんて時は更に下のNetBeans(php)を使ってます。

NetBeans(PHP)
PHP言語で間違えた箇所を厳密に教えてくれたり、入力のサポートをしてくれるIDE(統合開発環境)ソフト。いくつかあるバージョンのうち、HTML/JavascriptとPHPのみのバージョンをダウンロードして使っています。

主にこの３つのソフトで作成しています。

その他

XAMPP
PHPという言語はサーバー(Apache)というソフトがないと動きません。
このソフトは、中にApacheやMySQL(リレーショナルデータベース)というソフトを含んでいて、簡単にPHPがサーバーでやり取りした結果を表示することが出来るソフトです。PHPを触るなら用意しておくと便利でしょう。

次に実際に利用してるサーバー置いてるサイトさんとかです。

Value-domain
ホームページのアドレス(http://modernkatze.com)を購入したサイトです。
ドメイン（ホームページアドレス）が安いし、高機能です。
ここの会社はホームページスペースも提供していて、そのホームページスペースを利用しています。
設定の仕方がわからなかったら、電話やメールで設定をお願いすることも出来ます。(実際わからなくて設定してもらいました(゜▽゜;))

XREA
無料から使えるホームページスペースです。（無料の場合は広告有り）
インターネット上にホームページを公開することが出来ます。
このブログ(WordPress)のインストールや設定も簡単にできます。
ホームページは、広告なしの月額１９１円のプランを利用しています。
好きな名前のホームページアドレスはこれだけだと、○○.s2.xrea.com　といったアドレスになりますが、Value-domainで購入したドメインを関連付けると好きなホームページアドレスになります。