1.HTML

HTML(Hyper Text Markup Language)はWebブラウザに文字を表示するための言語。
マークアップ言語：文章の構造化するための言語。
基本的にHTMLのみで書かれているWebページは無い。
（CSS、JS、PHP、Rubyなどと併用される）

HTMLの作成ルール

HTMLファイル(.HTML)で作成する
文章をタグ（要素）で囲むことで文字に意味や役割を与える。（マークアップ）
ex) <p>○○</p>：テキストの段落
<h1>〇〇</h1>：セクションの見出し
etc...
タグに属性を記入することで、様々な設定を行うことができる
～利用方法～
<タグ属性1="属性値1" 属性2="属性値2" /タグ>
ex) class属性：主にCSSで使用し、要素を分類できる
href；要素の参照先のURLやURIを指定できる
etc...

HTMLの種類

HTML4.01：多くのブラウザで利用できる。
XHTML1.0：XMLとHTMLを合わせたもの。タグの追加など拡張性が高い。
HTML5：以前のバージョンのHTMLに加え、新たな機能が追加された。最も利用されている。

これらはHTMLファイルのDOCUTYPE宣言で指定する必要がある。

2.CSS

CSS(Cascading Style Sheet)はHTMLのスタイルを設定するコード
色、配置、文字サイズなどの指定ができる

HTMLへの適用方法

CSSを利用するために、HTMLでCSSファイルを読み込む必要がある

HEADタグ内に

index.html

<link href="styles/style.css" rel="stylesheet">

と記入する

CSSファイルの記述方法

CSSの構造は規則セット、あるいは規則と呼ばれ、以下のようになっている

<参照：https://developer.mozilla.org/ja/docs/Learn/Getting_started_with_the_web/CSS_basics>

Selector（セレクタ）：HTML要素名やクラスの指定（クラスの指定時は先頭に.（ピリオド）を付ける）
Decralation（宣言）：color: red; のような単一の規則
Property（プロパティ）：フォントや色などスタイルを指定（色の変更：color、文字サイズ変更：font-size など）
Propertyvalue（プロパティ値）：プロパティに対応する値（赤色：red、緑：Green、文字サイズ12px：12px など）

3.JavaScript

JavaScriptはWebブラウザ上動作する動的コンテンツを作成する際に利用される言語。
（名前の似ているJava言語とは、まったくの別物）

動的コンテンツ：ポップアップやアニメーション、入力フォームの送信など

HTMLでの記述方法

JavaScriptをscript要素で囲む

index.html

<script>
  document.write(“Hello world!!”);
</script>

ライブラリの利用

ライブラリを利用することで効率的に開発ができる。
/<ライブラリの例>
* Ajax(エイジャックス)：JavaScriptの通信機能を使い、XML形式のデータを送受信する
* jQuery：JavaScriptでできたブラウザの拡張機能。メニュー、画像表示。検索などに利用
* JSON：データをテキストで表現するための記述方法

4.Ruby

Rubyとは、まつもとゆきひろ氏（通称：Matz）により開発されたオブジェクト指向スクリプト言語。
日本で開発された言語で、日本語の参考書やマニュアルがあるため、日本人が学習しやすい。
また、「Enjoy for Programing!」を掲げており、プログラマが直感的にコーディングしやすい言語である。
無償で利用でき、現在の安定版は3.0.2（2021/07/13現在）。
主にRubyのフレームワーク「Rails」を利用し、「Ruby on Rails」として開発される。

5.Ruby on Rails

Ruby on RailsはRubyにフレームワークRailsと組み合わせたもの。
RailsはMVCアーキテクチャに基づいて設計されており、
MVCはそれぞれ、Model（モデル）、View（ビュー）、 Controller（コントローラ）を表す

<参照：https://hnavi.co.jp/knowledge/blog/ruby-on-rails/>
Railsを利用することでWebサービスの開発の手間を減らし、開発を容易にすることができる。
Rubyと同様に無償で利用でき、現在の安定版は6.0（2021/07/13現在）。

Ruby on Railsを利用して開発されたサービスの例

クックパッド(https://cookpad.com/)
hulu(https://www.happyon.jp/)

補足

オブジェクト指向
システム全体をオブジェクトの組み合わせとして記述していく。
オブジェクトには固有のデータ（属性/プロパティ）と手続き（メソッド）があり、
外部からのメッセージを受けてメソッドを実行しテータを操作する。
コンパイラ型言語
プログラムを実行する際にコンパイル（ソースコードを機械命令に変換）する必要がある。
実行速度は速いが、コンパイルの手間がり、バグを含んだままコンパイルされるためデバッグがしづらい
スクリプト型言語
実行する際にコンパイルが不要であり、そのまま実行できる。
コンパイラ型に比べて実行速度は遅いが、コンパイルの手間がないため、すぐに実行でき、デバッグしやすい。
フロントエンドスクリプト
ブラウザ上で動作する言語(HTML、CSS、JavaScript)
バックエンドスクリプト
サーバ側で処理した結果がブラウザに送信され、表示される言語（Ruby、PHP、Java）
ライブラリ
部品（メソッドなど）の集まり、全体を動かすためのロジックはない
クラスライブラリ
再利用可能なクラスをまとめたもの
フレームワーク
全体の流れが実装されており、その中の一部の具体的な処理を自分で実装してはめ込めるシステム
はめ込める箇所をホットスポットと呼ぶ

Webアプリケーション開発において利用される言語の概要