元プログラマーの人生再起動記録 -6ページ目
こんにちは!プログラミング講座 第1回です。
私がプログラミングの世界に踏み込んだ入口はHTML→CSSに次いで教わったJSからです。
なのでプログラミング講座もWebから入ろうと思います。

まずは何よりも、Windows標準の『メモ帳』を使っているのならそれは止めてください。

1回しか巻き戻しできないうえに、改行コードも不自由です。
テキストエディタとしては限定的な機能しかもっていません。

macはよく知らないです。標準のエディタでも高機能なのかもしれません。

おすすめのテキストエディタ
・サクラエディタ
ステップ数の限界を感じさせない強力な巻き戻し機能→きっちり1文字ずつ戻せます。
強力なマクロ機能があり、単純作業の繰り返しが非常に楽です。
タブ機能でDreamweaverのような使い方もできます。切り替えはCtrl+Tab、タブ閉じはCtrl+F4
万能ではないが汎用+高機能で無料のプログラマー御用達のエディタです。
私は主にこれを使っていますが、使い慣れたエディターが最適です。

・Dreamweaver
Adobe製のCreative SuiteやCreative Cloudに含まれるWebオーサリングツールです。
HTML、CSS、JavaScript、jQuery、PHPの入力候補表示があり、Abodeがそれらを採用したことによってjQueryやPHPが流行ったのではないかという意見もあるほどです。
FTP機能つきで、上書き保存で自動アップロードするなどかなり便利な機能が満載です。

HTMLのhello worldは実に簡単です。いや、一般的なプログラミング言語と比較すると記述量は多いかもしれません。

<!doctype html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ここにタイトル</title>
</head>
<body>
hello world !!
</body>
</html>

こんなファイル『ファイル名.html』を用意して、普通に開くとブラウザが起動して、左上の隅っこに『hello world !!』と表示されます。ファイル名はなんでもかまいません。
文字コードは『UTF-8』で、選択できるなら『BOMなし』で保存します。
改行コードはLFかCRにするとCR+LFに比べてファイルサイズが少し小さくなります。
Webサーバーで公開するのなら、WebサーバーのOSに合わせるといいでしょう。

サーバーとして大人気のLinuxならLF
Windows Server 2012などであればCR+LF
macならCR

ローカルで使うだけなら自分のOSにあった改行コードにしておくのがベストです。

hello worldコードを1行目から説明します。
<!doctype html>
HTML5の文書型宣言です。
この文書はHTML5で書かれています、と宣言します。
<html lang="ja">
このhtmlの中身は『日本語(ja)』です、とブラウザに知らせます。
headなどの要素(タグ)については後々解説します。
<meta charset="UTF-8">
この文書はUTF-8だとブラウザに知らせます。
<title>~</title>
文書のタイトルです。とりあえず必須なので入れておきました。
<body>~</body>の間に文字をかくとブラウザ上で表示されます。

あ、もちろん文字コードUTF-8で作成してくださいね。
最近はWebページではUTF-8が主流です。

今日はhello worldでした。

それではまた次回お会いしましょう。