NumPyとは、Pythonの*数値計算ライブラリ*の一種です。NumPyは**多次元配列オブジェクト**をPythonに実装し、多数の演算関数を提供します。NumPyは英語の読み方として「ナムパイ」と発音します。一部「ナムピー」とも呼ばれていますが、*「ナムパイ」の読み方が多数派*です。

Pythonは元来数値計算向けに開発されたものではなかったため、*SIG（Special Interest Group）*が中心となってPythonの構文に配列の取扱いを取込みました。NumPyの意味ですが、最初のパッケージはNumericと呼ばれていました。後に"Numerical Python extensions"や"NumPy"と呼ばれるようになりました。

現在はNumericの機能拡張を経て、NumPyが正式名称で*”Numerical Python”の略*となっています。
参考：[NumPy](https://numpy.org/)
参考：[Guide to NumPy](https://archive.org/details/NumPyBook)

Pythonは*プログラム記述がシンプル*で、オブジェクト指向プログラミングにより高機能なプログラムが簡単に記述できるメリットがあります。Pythonの特徴は*オープンソースソフトウェア*のため、ライブラリ等の**ソフトウェア公開が進んでいる**ことが挙げられます。

*Pythonのライブラリ*とは*複数の機能をまとめたもの*で、パッケージ化したものです。上記Pythonの特徴から、分析アルゴリズムが共通化しやすい*AI*では*機械学習や深層学習*のライブラリが数多く提供されています。

公開ライブラリのインストール管理は、*PyPI*または*Anaconda*の2種類の公開サービスのいずれかを用いることが多いです。特に*Anaconda*は*数値計算やデータ分析に必要なライブラリ*を**一括管理**できるため、*NumPyを利用する*際にも*Anacondaの活用*をおすすめします。

NumPyは*数値計算を行うライブラリ*です。NumPyではベクトル演算や行列演算で用いる**多次元配列を扱う**ことができます。

さらに、*NumPyのライブラリコード*は**C言語**で作成されています。C言語はコンパイラ言語のため、インタープリタ型に比べてランタイムのオーバーヘッドが少なく、コード最適化が図られています。このため*NumPyのライブラリ*は**高速で処理できる**ことが特徴です。

Pythonには*バイトコンパイル機能*があるものの、*インタープリタ*として動作するためC言語で開発されたライブラリの活用は魅力的です。上記理由から、*NumPy*は*データの読み込み工程やデータの前処理・加工工程*で良く用いられています。

NumPyと同じようによく用いられているのが、*pandas*です。**pandasとは数表や時系列データ**に強みを持つデータ操作解析ライブラリです。データを読み込んで*並べ替え*を行ったり、*欠損データの補完*を行って**データ分析しやすい形式に変換**したり、主に*データの読み込み工程やデータの前処理工程*で用いられます。
参考：[Pandas](https://pandas.pydata.org/)

NumPyの使い方は、Pythonコードで以下のように**ライブラリをインポート**します。
*“import numpy as np”*
ここで”np”はNumPyのドキュメントでも頻繁に利用される名称ですので、コードの影響がなければそのまま使用します。

ここで”import”時にエラーとなる場合は、NumPyがインストールされていない可能性があります。その際は以下のインストール方法を試してみましょう。

NumPyをインストールするには*Anacondaのconda*または*Anaconda Navigator*を用いるか、*pip*を用いてインストールします。

AnacondaではNumPyがデフォルトでインストールされています。インストールが必要で*conda*を用いる場合は、*”conda install numpy”*を実行します。*Anaconda Navigator*の場合はパッケージの「*Not Installed*」からNumPyをチェックし「*Apply*」をクリックします。「*Installed*」に表示されたら**使用可能**です。

*pip*を用いる場合は、*”pip install numpy”*を実行します。インストールしても*“import numpy as np”*でエラーが発生する場合は、*ライブラリのパスが正しく反映されていない*可能性があります。

特に*Anaconda*の場合は、インストール時のインストール先のパスを変更した際に*PATH環境変数*への反映を行う必要があります。インストール時にインストーラの「*Advanced Options*」で設定するか、手動で*Anacondaインストール先の”Library\bin”*を*PATH環境変数へ追加する*必要があります。

*配列*とは英語で*array*と呼びます。そもそも配列とは、*コンピュータプログラムのデータ構造の一種*です。配列は連続するデータ空間に格納される**データの集合体**を意味します。*NumPy*でも配列は*array*として利用します。

*使用例：*
　import numpy as np
　a = np.arange(3)
　b = np.array([1, 2, 3, 4])
　c = np.array([[1, 2, 3, 4], [5, 6, 7, 8]])
　d = np.array([[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]])
　print("a=",a)
　print("b=",b)
　print("c=",c)
　print("d=",d)

*実行結果：*
a= [0 1 2]
b= [1 2 3 4]
c= [[1 2 3 4]
 [5 6 7 8]]
d= [[ 1  2  3  4]
 [ 5  6  7  8]
 [ 9 10 11 12]]

*arange関数*は等差数列の配列を生成する関数です。*array関数*は配列を作成する関数です。変数aには等差数列の[0 1 2]が作成されました。変数bは1次元配列、変数cは2次元配列、変数dは3次元配列です。

上記の他にも2次元配列を作成する*eye関数*や*diag関数*が用意されています。3次元以上の*ndarray*を作成する場合は*ones関数*や*zeros関数*等を用います。

*Python*でも数値計算を行うためにいくつかの*組み込み関数*や*math関数*が用意しています。Pythonで演算する場合は配列の要素を実行時に動的に分解したり、for文のループを行いますので*処理が複雑になり計算時間がかかります*。

*NumPy*ではあらかじめ必要な計算処理をそれぞれの関数として提供しますので、**開発コードがシンプルでかつ高速処理**が行えます。以下に、数値計算で用いる一般的な処理と対応する関数について説明します。

・*四則演算*
　配列の四則演算には対応するadd・subtract・multiply・divideの各関数が用意されています。
・*累乗・平方根・指数・対数*
　累乗・平方根・指数・対数には対応するpower・sqrt・exp・logをはじめとする各関数が用意されています。
・*三角関数*
　三角関数には対応するsin・cos・tan・arcsin・arccos・arctanをはじめとする各関数が用意されています。

*NumPy*で基本演算が完了したら集計機能を活用します。NumPyの**集計機能**は、以下のような関数を提供しています。

・*ソート関数*
　ソート関数はsort・ndarray.sortをはじめとする各関数が用意されています。
 ・*集計関数*
　集計関数はmin・max・sum・meanをはじめとする各関数が用意されています。
・*欠損値・異常値処理*
　欠損値はNaNですのでisnanで欠損値を検出したり、nan\_to\_numで補正することができます。
　その他にもisinf・isneginf・isposinfで異常値を検出することもできます。

*NumPyでデータ分析する場合*は、元となるデータを*ファイルから入力し結果をファイルに保存する*のが一般的です。NumPyでは以下のような**データ入出力機能**を提供しています。

・*ファイル入出力*
　ファイル入出力はsave・load・savetxt・loadtxtをはじめとする各関数が用意されています。
　Npy配列ファイルの入出力はload・save関数を用います。
・*CSVファイル入出力*
　CSVファイルやテキストファイルの読み込みはloadtxt関数です。
　複雑なファイルはgenfromtxt関数を用います。

NumPyの初心者は、CSVのインポート・エクスポートはpandasを用いた方がより簡単に読み込みできます。取り込んだデータをNumPyで配列演算に利用します。読み込みはread\_csv関数、書き込みはto\_csv関数です。
*使用例：*
　import pandas as pd
　a = pd.read\_csv('ファイル名.csv', header=0).values

## NumPyを用いて効率的にデータ分析をすすめましょう

*NumPy*では*多次元配列を用いて高度なデータ分析を行う*ことができます。そのためPythonのデータ分析業務では、*データの読み込み工程やデータの前処理・加工工程*で良く用いられています。

NumPyを使うことで配列の演算や分析作業が*シンプルなコードで効率的、かつ高速に実行する*ことができます。さらにNumPyを活用することで、*データ分析の効率が向上し分析精度が向上します*。ぜひ*NumPy*を**データ分析に活用する**ことをおすすめします。

NumPyは多次元配列オブジェクトを、Pythonで効率的に利用することでデータ分析作業を簡単に行うことができます。NumPyはシンプルなコードでかつ高速に動作しますので人気があります。ここではNumPyの基本から主要関数まで丁寧に解説していきます。

NumPyとはPythonの数値計算ライブラリの一種で、”Numerical Python”の略を指します

NumPyはベクトル演算や行列演算で用いる多次元配列を取り扱うことができます

NumPyはC言語で開発したライブラリのため、データ分析をシンプルなコードで高速に実行できます

NumPyとは？効率的なPythonのデータ分析手法を解説！

HTMLとは「Hyper Text Markup Language」の略称であり、Webサイトの構造を定義するためのマークアップ言語です。HTMLではタグを使用してWebサイトの構造を作成することができます。その中でもdivタグはよく使用されるタグの1つです。ここでは、divタグの概要や書き方について詳しく紹介します。

divとは「division」の略称であり、読み方は一般的に「ディブ」もしくは「ディヴ」です。**divタグ単体では意味を持ちませんが、divで囲む部分をブロック要素としてまとめて扱えるのが特徴です。**align属性を使用して水平方向の配置を指定したり、スタイルシートを適用したりなどブロック化すればまとめて行うことができます。

**divタグを使用するときは一般的に```<div>テキスト</div>```と記載します。
**またdivタグにid属性やclass属性を追加し、```<div id="id名">テキスト</div>``` ```<div class="class名">テキスト</div>```と記載することも多いです。*id属性やclasの属性を付ければ、スタイルシートで装飾しやすくなるという特徴があります。*

なおidとclassの違いについてですが、*id属性は同じWebページ内でid名が重複してはいけないという決まりがあります。*一方*class属性は、同じWebページ内でclass名が重複しても問題ありません。*そのため同じ装飾を指定したいときに、class属性は使用されます。また1度しか使用しない場合でもclass属性を用いることは可能です。

divタグと同様でspanタグも単体では意味を持ちません。**divタグとspanタグの違いは、ブロックレベル要素かインライン要素かです。**divタグはブロックレベル要素の1つで、spanタグはインライン要素の1つです。
ここではdivタグの知識を深めるためにも、ブロックレベル要素とインライン要素の違いについて詳しく紹介します。また配置のルールについても解説します。

**ブロックレベル要素はテキストを構成する基本となる要素であり、1つのまとまりとして認識されるのが特徴です。ブロックレベル要素では余白や縦横のサイズなどを自由に定義できます。**しかし、ブロックレベル要素の前後には自動で改行が入ることもあるため注意が必要です。ブロックレベル要素の例として、pタグ・h1～h6タグ・tableタグ・divタグなどが挙げられます。

**インライン要素は、主にブロックレベル要素の中で使用される要素であり、文章の一部として扱われるのが特徴です。**そのためインライン要素の前後には改行は入りません。例えば、pタグの中でstrongタグを使用すれば、段落の中の一部を強調することができます。 インライン要素の例としてaタグ・bタグ・iタグ・imgタグ・strongタグ・uタグ・spanタグなどが挙げられます。

**ブロックレベル要素の中に、他のブロックレベル要素やインライン要素を配置することは可能です。 しかし、インライン要素の中にブロックレベル要素を配置することはできません。**ただし*インライン要素の中に、文字データや他のインライン要素を配置することはできます。*インライン要素は行の一部として扱われます。そのためspanタグのようなインライン要素では、一般的に「width」「height」というプロパティを使用してサイズの調整ができません。

ただし例外もあるため、spanタグを使用するときには、公式リファレンスなどを参照して確認しましょう。

## divタグを使用する目的・使い方

divタグはブロックレベル要素で、余白の調整やサイズの変更が自由にできることは理解できたでしょうか。ここでは、divタグを使用する目的・使い方について詳しく紹介します。

Webサイトを制作する場合、HTMLのソースコードが膨大になることもあります。そうすると、可読性やメンテナンス性が低下してしまいます。**そのためページ全体を区分して構成や構造をまとめる必要があり、そこでdivタグが使用されます。**

Webサイトのレイアウトに合わせてdivタグを配置するのが一般的で、必要に応じてdivタグを入れ子構造にして使用することも多いです。*ページ全体を構造化すれば、HTMLのソースコードを確認するのみでレイアウトを把握することができます。*また*Webサイトを修正する際に、比較的簡単に変更が可能です。*

**divタグは主にデザインの指定を行うときに利用されます。**デザインの装飾はHTMLではなく、CSSという言語を使用して指定します。CSSでは各タグに対して文字の色・サイズ・配置などを指定可能です。ここでdivタグを対象に装飾を行うと、ページに存在するdivタグ全てのデザインが変更されてしまいます。そのため*divタグに対してid属性やclass属性を付けるのが大切です。*

## divタグを他のタグで代用する

divタグはデザインを行う上で便利な要素のため、使いすぎてしまうことがあります。divタグを多用するとデメリットもあります。そのため**divタグの代わりに、構造の意味付けをするタグに置き換えることも重要です。**ここではdivタグを多用するとどうなるのかや、代用する際におすすめのタグについて詳しく紹介します。

### divタグ使いすぎるとどうなるか

divタグを多用するデメリットとして、**Webブラウザのが各要素を特定する際に時間がかかり、Webサイトの読み込み速度の低下をもたらすことが挙げられます。**またid属性やclass属性を使用して、要素の特定をしやすくすることもできますが、その場合*スタイルシートによる装飾が煩雑になってしまう可能性があります。*そのためdivタグだけではなく、ulタグやliタグを使用して簡素化することも大切です。

**headerタグは一般的に、イントロダクションやナビゲーショングループを指定するときに使用します。** なお*ヘッダー情報を記述するheadタグとは異なるため注意が必要です。*headerタグの中には見出しを含めることが予想されますが、必須というわけではありません。またセクションの目次・ロゴ・検索フォームを配置するために、headerタグを使用することもできます。

**footerタグは一般的に、直近のセクションのフッターを指定するときに使用します。**フッターとは、そのセクションに関する情報を指し、基本的に誰が記載したのか・関連文献へのリンク・著作権などの情報が含まれていることが多いです。フッターはセクションの最後に指定することが多いですが、必須というわけではありません。 

**mainタグは一般的に、ページのメインコンテンツを指定するときに使用します。mainタグは1つのページに複数指定することはできません。**そのため重要なコンテンツにmainタグを使用するのが大切です。

**navタグは一般的に、ナビゲーションを指定するときに使用します。**なおナビゲーションとは、Webサイトの中における他ページへのリンクや、ページ内リンクなどのことです。他ページにリンクする箇所の全てをnavタグで囲む必要はありません。主要となるナビゲーションのセクションだけを指定したいときに、navタグを使用するのがおすすめです。またWebサイトの下部に、利用規約・著作権・トップページに戻る、などのリンクが配置されていることも多いですが、 このような場合は*navタグではなくfooterタグで十分と言えます。*

**articleタグは一般的に、単体で内容が完結するセクションを指定するとき使用します。**例えば、フォーラムでの投稿・雑誌や新聞の記事・コメントなどが挙げられます。

**asideタグは一般的に、補足的な情報を指定するときに使用します。**なお補足的情報とは、本文と関連しいるが、区別すべき内容のことです。例えば、広告エリアやサイドバーなどに使用されることが多いです。

**sectionタグは一般的に、章や区切りを指定するときに使用します。**例えばページ内にサービス内容・使い方・よくある質問・連絡先というセクションを指定したい場合には、それぞれをsectionタグで囲みます。

## HTMLのdivタグを上手く活用してWeb制作を行おう！

これまでに、HTMLのdivタグの概要・書き方・目的・使い方やブロックレベル要素とインライン要素の違い、divタグを代用できる他のタグ要素について解説しました。**divタグ（div要素）は単体では意味を持ちませんが、divで囲む部分をブロック要素としてまとめて扱えるのが特徴です。**また、divタグはブロックレベル要素の1つです。

*divタグはべージ全体を構造化させたり、デザインを指定したりする際に役立ちます。*またデザインを指定するときには、一般的にid属性やclass属性が必要です。*divタグを使いすぎると、Webサイトの読み込み速度の低下を招くこともあるため注意が必要です。*divタグではなく、他のタグで代用できることもあるため、上手くdivタグを活用してWeb制作を行いましょう。

divタグ（div要素）は単体では意味を持ちませんが、ブロック要素としてまとめて扱えるのが特徴です。当記事では、HTMLのdivタグの概要・書き方・目的・使い方やブロックレベル要素とインライン要素の違い、divタグを代用できる他のタグ要素について解説します。

divタグ単体では意味を持たないが、divで囲む部分をまとめて扱うことができる

divタグはブロックレベル要素であり、spanタグはインライン要素

divタグはべージ全体を構造化させたり、デザインを指定したりする際に役立つ

HTMLのdivタグとは？読み方・目的・使い方などを解説！ 

**HTMLとは「Hyper Text Markup Language」の略称であり、Webサイトを作成するために開発されたマークアップ言語です。**HTMLでWebサイトの本文部分などの構造を作成し、CSSやJavaScriptといった言語でWebサイトを装飾するのが一般的です。ここでは、HTMLの詳細やHTMLタグの使い方について初心者向けに紹介します。

**HTMLはWebサイトの構造を定義するためのマークアップ言語です。さらにCSSを使用すれば、Webサイトを装飾できます。**HTMLでWebサイトの装飾ができないということはありませんが、HTMLとCSSで用途を分けることで分業がしやすくなり、開発効率の向上が期待できます。Webサイトのメンテナンス性も向上したり、JavaScriptというプログラミング言語を使用すれば、Webサイトに動的な要素を追加したりすることが可能です。

HTMLそのものはテキストデータであるため、テキストエディタなどを使用して記述したテキストに拡張子「.html」を付ければ、一般的にWebブラウザでページの構造を確認できます。例えばメモ帳でも簡単にコーディング可能です。

また*HTMLを記述する場合には、タグ付けを行う必要があります。*例えば装飾を行いたい本文や画像などには、1つひとつタグ付けを行わなければなりません。

**HTMLではコンピュータに文書の意味を理解させるために、タグ付けを行う必要があります。**HTMLタグは検索エンジンが作成したWebサイトを認識するための要素の1つであり、検索エンジン最適化にもつながるでしょう。検索エンジン最適化への対策をすれば、検索結果の上位にWebサイトが表示されやすくなり、数多くのユーザーに自分のサイトを見てもらえる可能性は高まります。

また、タグ付けにはルールがあります。タグとは「<>」で囲った文字列を指し、*一般的なタグの記載方法は「<タグ名>テキスト</タグ名>」です。*なお最初の「<タグ名>」は開始タグと呼び、最後の「</タグ名>」は終了タグと呼びます。開始タグと終了タグでテキストを挟めばタグの作成が可能で、終了タグが必要ないタグ要素もあります。

開始タグの中には、必要に応じて「<タグ名 属性="属性値">テキスト</タグ名>」のように属性を記載できます。**属性を記載すれば、HTMLの要素に対して性質を与えることが可能です。**例えばimgタグを使用する場合、src属性を使用すれば、簡単に画像のパスを指定することができます。

またtitle属性を使用すれば、画像のタイトルを指定することが可能です。さらにalt属性を使用すれば、画像の代替のテキストを入力でき、検索エンジンが画像の中身を理解する際などに利用されます。他にも属性を記述すれば、様々なことができるようになります。

HTMLやHTMLタグの概要については理解できたでしょうか。ここでは、一般的なWebサイトの構成について初心者向けに紹介します。

**HTML文書を書き始める際に、まずはDOCTYPE宣言を記述します。DOCTYPE宣言は「HTML文書を記述する」という宣言文を意味します。**DOCTYPE宣言部分を修正すれば、使用するHTMLのバージョンを変更することができます。例えば、HTML5では「<!DOCTYPE html>」と簡単に記述可能です。大文字と小文字は区別されません。

*HTML5以前のDOCTYPE宣言の書き方は、HTM5とは異なるため、使用したい方は公式リファレンスなどを参照しましょう。*そして記述したテキストファイルは、拡張子を「.html」にしてHTMLファイルにしましょう。

**DOCTYPE宣言が指定できたら言語を指定しましょう。```<html lang="言語名">```の言語名の部分に使用したい言語を記述すれば、言語の指定が可能です。**例えば言語名に「ja」を入力すれば、日本語のWebサイトにすることができます。また「en」を入力すれば、英語のWebサイトにすることが可能です。

**言語の指定ができたらhead要素に、metaタグ・linkタグ・titleタグなどを記述しましょう。**head要素には、一般的にコンピュータが認識するデータを記述します。

```<meta charset="文字コード">```*の文字コードの部分に、使用したい文字コードを記述すれば、文字コードの指定ができます。*一般的に「UTF-8」を使用することが多いです。他には「Shift_JIS」「EUC-JP」などがあります。

```<meta name="description" content="要約">```*に、記事本文の要約を記述すれば、要約の指定が可能です。*指定した要約は検索結果に表示されるため、文字数などユーザーに配慮して記述するのが大切と言えます。

**linkタグを使用すれば、自身のファイルと別のファイルを関連付けることが可能です。**例えばCSSファイルと関連付けるときには```<link rel="stylesheet" href="style.css">```などと記載します。なお「style.css」はCSSファイルの名称になるため、「style」という部分はファイル名に合わせて自由に変更可能です。また、linkタグとaタグは異なるため注意する必要があります。

```<title>タイトル名</title>```*のタイトル名の部分に、使用したいタイトル名を記述すれば、タイトルの指定が可能です。*ここで記述したタイトル名は、Webサイトを開いたときのタブに表示されます。タイトルは検索エンジン最適化において重要な要素の1つになるため、必ず記述しましょう。

**head要素が記述できたら、body要素にコンテンツの中身を記載しましょう。bodyタグの中に記述された本文や画像は、Webブラウザの画面上に表示されます。**bodyタグには色を指定する属性がいくつかありますが、いずれも非推奨とされているため、色を指定したいときにはスタイルシートを使用しましょう。

一般的なHTMLファイルで記述する内容については理解できたでしょうか。ここでは、HTMLタグ一覧ということで、よく使用されるHTMLタグについて初心者向けに紹介します。

**一般的に見出しにはhタグを使用します。hタグには「h1」から「h6」までの6種類があります。**見出しを付けることで、文章の構成が理解しやすくなるというメリットがあります。例えばWordPressで見出しタグを使用すれば、プラグインを入れて自動で目次を生成させることも可能です。また、検索エンジン最適化への対策にもつながります。

**aタグとはリンク先を指定するHTMLタグです。**これまでにも説明しましたが、linkタグとaタグは異なるため注意が必要です。また*リンク先を指定するhref属性、リンクを開く方法を指定するtarget属性など様々な属性があります。*例えば```<a href="リンク先">こちらへ</a>```と記述すると、「こちらへ」をクリックすればリンク先へ飛ぶことができるようになります。

### 画像を挿入するタグ（imgタグ）

**画像を挿入するには、imgタグを使用しましょう。imgタグには終了タグは必要ありません。**表示する画像ファイルは、src属性で指定できます。またwidth属性やheight属性を付ければ、画像の縦横のサイズを変更することが可能です。さらにalt属性を付ければ、画像が出力されなかったときの代わりに表示させるテキストを指定することができます。例えば```<img src="サンプル.png" width="100" height="100" alt="サンプル">```と記述すれば、「サンプル.png」という画像を縦100px、横100pxで表示させることが可能です。また画像が出力されなかったら、「サンプル」というテキストが表示されます。

**文章を明示的に改行したいときには、brタグ使用しましょう。brタグには終了タグは必要ありません。**brタグは一般的に余白を作りたいときに使用されますが、*スタイルシートを使用する方がおすすめです。*brタグでデザインを作成したとしても、ユーザーの閲覧する環境によって行間が変わってしまうことは少なくありません。また文字サイズによって改行の位置が変わり、本文が読みづらくなってしまうこともあるため、brタグの使い方には注意が必要です。

## HTMLタグの使い方をマスターして効率よくWebサイトを作成しよう！

これまでに、HTMLやHTMLタグの概要・Webサイトの構成・HTMLタグ一覧について初心者向けに解説しました。**HTMLはWebサイトの構造を定義するためのマークアップ言語です。**CSSやJavaScriptといった言語を使用すれば、Webサイトに装飾を加えることができます。

さらに*HTMLタグを使用してWebサイトの構造を作成することが可能です。DOCTYPE宣言・言語の指定・head要素・body要素などのWeb制作における一般的な部分はきちんと押さえておきましょう。*またHTMLタグには様々なものがあります。この記事ではよく使用されるタグを紹介しましたが、まだまだあらゆるタグがあります。Web制作に興味がある方は書籍・学習サイト・公式リファレンスなどを活用して、HTMLやCSSの言語から勉強を始めてみましょう。

HTMLはWebサイトの構造を定義するためのマークアップ言語です。そしてHTMLタグを使用してWebサイトの構造を作成することができます。当記事ではHTMLやHTMLタグの概要・Webサイトの構成・HTMLタグ一覧について初心者向けに解説します。

HTMLとはWebサイトの構造を定義するためのマークアップ言語

HTMLタグは検索エンジン最適化に対して影響を与える

HTML5であればDOCTYPE宣言が簡単に記述できる

HTMLタグとは？HTMLタグ一覧など初心者向けに解説！ 

## Ruby on Rails（ルビーオンレイルズ）とは

**Ruby on Rails（ルビーオンレイルズ）とは、Rubyというプログラミング言語のフレームワークの1つを意味します。**Ruby on Railsを使用すれば、シンプルなコードでWebアプリ開発を行うことが可能です。他にも様々なメリットや特徴があります。ここでは入門ということで、Ruby on Railsの概要や使い方について詳しく紹介します。

Ruby on RailsとはRubyを使用したフレームワークの1つであり、2004年にデンマークのプログラマであるデイヴィッド・ハイネマイヤー・ハンソン氏により開発されました。開発者の間では「Rails」や「RoR」と呼ばれることも多いです。なおフレームワークとは、アプリケーションの開発を行う際に、その土台として機能させるソフトウェアのことです。フレームワークを使用すれば、ベース部分の開発を短縮させられるため、開発効率の向上が期待できます。

一方Rubyとはプログラミング言語の1つで、1995年に日本人のまつもとゆきひろ氏により開発されました。国産の言語であるため、日本語の文献も多いのが特徴です。2021年8月時点におけるTIOBEインデックスによると、プログラミング言語ランキングの中でRubyは15位に位置しており、R言語・Swift・Go言語などと同じくらいの順位です。
（ 参考：https://www.tiobe.com/tiobe-index/ ）

**Ruby on Railsを使用するにあたって、まずはRubyの実行環境を構築する必要があるため、下記のサイトにアクセスします。**自分のPCが32ビット版の場合はx86、64ビット版の場合はx64をダウンロードしましょう。
（ 参考：https://rubyinstaller.org/downloads/ ）

*次にコマンドプロンプトを開き「gem install rails」というコマンドを入力すれば、Ruby on Railsのインストールが開始されます。*「rails -v」というコマンドを入力すると、きちんとインストールされていれば、Ruby on Railsのバージョンを確認することが可能です。

そして「gem install sqlite3 --version 1.3.13」というコマンドを入力すれば、SQLite3ライブラリをインストールすることができます。次に、下記のサイトにアクセスし「Download」から「Precompiled Binaries for Windows」の中のzipファイルを選択すればダウンロードが開始されます。
（ 参考：https://www.sqlite.org/index.html ）

*zipファイルを展開すると「sqldiff.exe」「sqlite3.exe」「sqlite3_analyzer.exe」の3種類のファイルがあるため、「sqlite3.exe」をPATHが通っているディレクトリに移動しましょう。*これで準備は完了し、Ruby on Railsを使用してWebアプリ開発などを開始できます。

Ruby on Railsは「オワコン」「将来性がない」などと言われることもありますが、Ruby on Railsには様々なメリットがあります。ここでは、Ruby on Railsの特徴や使用するメリットについて詳しく紹介します。

### プログラミング未経験者でも習得しやすい

**Rubyのプログラミング言語はシンプルな文法が特徴であり、エラーが他の言語と比較すると出力されにくいため、プログラミング未経験者でも習得しやすい傾向にあります。それはRuby on Railsも同様です。**またRubyの言語やRuby on Railsのフレームワークは、日本語で使い方について説明されている情報が多いため、疑問点や不明点があったらすぐに解決できます。Ruby on Railsは、プログラミング未経験者でも学習しやすいフレームワークと言えるでしょう。

### ソースコードをシンプルに記述できる

Ruby on Railsを使用すれば、Rubyよりも短くソースコードを記述することが可能です。また、**Ruby on RailsはRubyよりもソースコードの記述ルールが細かく決められているため、ルールに従って記述すれば、簡単にWebアプリを開発できます。**よってRuby on Railsを採用すれば、開発効率の向上が期待できるため、スタートアップ企業などスピード感をもって開発を行いたいと考えている企業で数多く導入されています。

**Rubyに関する副業案件の数は数多くあります。その中でも約80%以上の案件がRuby on Railsを使用する案件だとも言われています。**Ruby on Railsを習得すれば、副業案件を獲得しやすいと言えるでしょう。副業案件を探す場合には、エージェント・クラウドソーシング・求人サイト・SNSなどを活用するのがおすすめです。また、*事前にどのような案件があるかを確認しておくと、必要なスキルを把握し、効率よく学習できます。*

Ruby on Railsはソースコードをシンプルに記述でき、未経験者でも習得しやすいことは理解できたでしょうか。ここではRuby on Railsでできることについて詳しく紹介します。

**Ruby on RailsはWebアプリケーションを開発するためのフレームワークであるため、Webアプリケーションの開発を得意としています。**「gem」を利用すれば、Ｗebアプリケーションに必要な様々な機能を簡単に実装することが可能です。なおgemとは、RubyGemsが公開しているRubyのパッケージもしくは、パッケージを管理する管理システムの名称を指します。

ブログを立ち上げるには、一般的にブログサービスやWordPressなどを使用します。*しかしRuby on Railsを使用してCMSを構築し、ブログサイトを制作することも可能です。*Ruby on Railsのスキルを習得すれば、機能やデザインを自由に設定することができます。**したがってRuby on Railsによって、比較的自由度の高いブログサイトを構築することが可能です。**

### ECサイト・ショッピングサイトの開発

Ruby on Railsを使用すれば、**豊富な機能を搭載したECサイト・ショッピングサイトを開発することができます。**RubyだけでECサイトに必要なログイン機能・決済機能・カート機能などを実装するのは難しいですが、「Solidus」というRuby on Railsのパッケージを使用すれば簡単に構築可能です。

Ruby on Railsを使用すれば、**ユーザー登録機能やログイン機能の搭載された実装されたSNSを開発することができます。**そもそもRubyというプログラミング言語は、サーバーサイドの開発を得意としています。そのためSNSの開発に、Rubyが採用されることは多いです。

APIとは「Application Programming Interface」の略称で、ソフトウェアやプログラムの間を繋ぐインターフェースを指します。例えばスマホアプリでは、サーバとデータをやり取りする必要がありますが、そのときの入口がAPIとも言えます。**Ruby on Railsを使用すればではAPI機能の開発も可能です。**

*スクレイピングとはインターネット上のWebサイトから、必要なデータを抽出し加工する技術を指します。*スクレイピング技術を上手く活用すれば、業務を自動化させることが可能です。そのため業務効率の向上が期待できま。

**Ruby on Railsでは「Nokogiri」「Mechanize」といったパッケージを利用すれば、簡単にスクレイピング技術の実装が可能です。**RubyとNokogiriでもスクレイピングを行うことはできますが、Ruby on Railsと組み合わせれば、Webアプリケーションとしてスクレイピングができるようになります。*そのためスクレイピングを有効活用するためにも、Ruby on Railsと連携して開発するのがおすすめです。*

## Ruby on Railsのスキルを習得して開発効率を向上させよう！

これまでに、Ruby on Rails（ルビーオンレイルズ）の概要・使い方・特徴・メリット・できることについて解説しました。**Ruby on Railsとは、Rubyというプログラミング言語のフレームワークの1つです。Ruby on Railsを使用すれば、シンプルな文法でソースコードを記述できるため、開発効率の向上が期待できます。**そのためスタートアップ企業などの開発スピードを重視する企業で、Ruby on Railsは数多く採用されています。

Ruby on Railsでできることとして、*Webアプリケーション・ブログサイト・ECサイト・SNS・API機能・スクレイピング技術*などの開発が挙げられます。RubyやRuby on Railsはプログラミング未経験者でも習得しやすいため、特に学びたい言語が決まっていない方はRubyから勉強を始めてみるのもおすすめです。

Ruby on Railsとは、Rubyというプログラミング言語のフレームワークの1つです。Ruby on Railsを使用すれば、簡単にWebアプリ開発ができます。当記事では、Ruby on Railsの概要・使い方・特徴・メリット・できることを解説します。

Ruby on RailsとはRubyを使用したフレームワークの1つ

RubyやRuby on Railsはシンプルな文法が特徴であり、プログラミング未経験者でも習得しやすい

Ruby on Railsでできることは、Webアプリ・ブログサイト・ECサイト・SNS・API機能・スクレイピング技術などの開発

Ruby on Railsとは？特徴・使い方・できることを解説

はじめに、*Djangoに関する基礎知識を紹介*します。Djangoとは何か、Pythonとは何か、プログラミング未経験者にも分かるように解説します。**まずはDjangoの基礎知識を押さえましょう**。

Djangoとは、*Webアプリケーション開発で使うフレームワーク*のことです。フレームワークとは、開発で必要な機能がひとまとめになったもののことです。フレームワークを使うことで、自分で機能を開発しなくてよくなり、開発スピードが格段に上がります。そのため、多くのWeb開発企業はフレームワークを使っています。

**Djangoはフレームワークの中でも人気が高い**です。Djangoが人気の理由として、無料で使えるオープンソースであることが挙げられます。また、機能もシンプルであり、学習コストが低いのもポイントが高いでしょう。そこまで複雑でないWebアプリケーションなら、すぐに開発することが可能です。

例えば、InstagramやPinterestなどのサイトはDjangoによって開発されています。

Pythonは、*Webアプリケーションや人工知能開発で使われる言語*です。人工知能は注目されている技術分野であるため、Pythonの人気は上がっています。また、Pythonは文法が平易で、初心者が最初に学ぶ言語としてもおすすめです。加えて、Pythonは可読性が高く他人のコードが読みやすい点も人気が高いです。

**Webアプリケーション開発で使われる言語には、他にもPHPやRubyなどがあります**。Pythonはその中でもシェアを伸ばしている言語です。Webアプリケーション開発に携わりたいなら、Pythonを学ぶのはおすすめでしょう。

DjangoはWebアプリケーション開発に必要な機能が一通り揃っているのが特徴です。対してFlaskは、*必要最低限の機能のみで構成*されています。例えば、管理画面を作成する機能はFlaskにはありません。**小規模なWebアプリケーションを作りたい場合はFlaskでも良い**ですが、Djangoの方が便利なことが多いでしょう。

続いて、*Djangoを使うメリットを紹介*します。Djangoは多くの企業で使われています。使われるということは、それだけフレームワークとして優秀であるということです。**Djangoのメリットは大きく分けて3つ**あります。1つ1つのメリットについて、詳しく解説していきます。

### ①Webアプリケーション開発に関する機能を網羅

Djangoは*Webアプリケーションの幅広い機能を開発*できます。よく使われる機能は、予めパッケージとしてまとめられており、手軽に活用することが可能です。**Djangoを使うことで、開発コストの削減が見込める**でしょう。

Djangoは*セキュリティ対策が優れているのもメリット*です。Webアプリケーションは全世界に公開するものであり、ハッキングなどの被害に合わないよう気をつけないといけません。Djangoは予想される多くの脅威に対して対策がされています。例えば、**ユーザー認証システムでは、パスワードを完全に管理する方法が使われています**。

拡張性が高いのも評価を上げている理由の1つです。*Djangoは各機能ごとに上手くファイルが分かれており*、それぞれの部品は自由に改良することが可能です。機能ごとに分かれているため、一部を改良しても他の機能に影響を与えることがなく、安心して改良できます。**DjangoはさまざまなWebアプリケーションにも柔軟に対応することができる**のです。

続いて、*Djangoでできることを解説*します。Webアプリケーションには様々な機能が必要ですが、Djangoを使って具体的にどの機能が開発できるのかご紹介します。**Djangoができることを知ることで、Djangoの特徴もみえてくる**でしょう。

管理画面とは、*管理者だけがアクセスできるページのこと*です。例えばECサイトを作る場合、サイトに掲載する商品を管理するための画面が必要です。Djangoには管理画面を作成できる機能が最初から入っています。テンプレートを用意しなくても、簡単に管理画面を作成することが可能です。

Djangoには、ユーザー認証の機能もあります。ユーザー認証とは、*システムが登録されたユーザーを自動で識別する機能のこと*です。ユーザー認証では、間違えて登録してないユーザーを通してしまうことがあってはいけません。**Djangoはそういったミスが起こらないように構成されています。**

Djangoには*RSSフィードを作成する機能も備わっています*。RSSフィードとは、**Webサイトの更新情報を配信するための文書フォーマットのこと**です。特にブログなど、更新したことをユーザーに伝えたいコンテンツに多く使われています。

Djangoには*サイトの案内ページを作成する機能もあります*。サイトの案内ページを1から作るのは大変です。特に大規模なサイトはページ数が多くて作成に時間がかかります。**Djangoなら素速く案内ページを作成可能**です。

## Djangoの使い方を勉強するのにおすすめの本

最後に、Djangoの使い方を勉強するのに*おすすめの本を紹介*します。これらの本を読むことで、Djangoを効率的に習得することが可能です。Djangoをこれから学ぶ方は、**ぜひこれらの本を参考にしてみてください**。

### 独学プログラマー Python言語の基本から仕事のやり方まで

*Djangoの勉強の前にまずはPythonの基礎を押さえることが必要*です。この本はPythonの基礎を網羅的に習得することが可能です。本の著者が、独学でPythonを習得した経験を元に書かれています。独学を通じて学んだエッセンスが詰め込まれた1冊です。これからPythonを学ぶ方は、まずこの本が良いでしょう。**Pythonの基礎文法や関数についてまとまっています**。また、プログラマーの心得も本書で学ぶことが可能です。

[独学プログラマー Python言語の基本から仕事のやり方まで](https://www.nikkeibp.co.jp/atclpubmkt/book/18/C92270/)

*「Djangoビギナーズブック」はDjangoの基礎が習得できる1冊*です。「フレームワークとはなにか」という部分から丁寧に解説されています。Pythonの基礎知識は押さえており、これからフレームワークを学びたい方におすすめです。**本書はPythonの文法やHTMLを使っての解説を減らし、根本的なフレームワークの仕組みを重点的に解説**しています。「なぜDjangoはそのように動くのか」という部分まで知ることが可能です。

更に本書の後半では、Djangoのよく起こるエラーをFAQ形式で解説しており、こちらも参考になります。

[Djangoビギナーズブック](https://www.cutt.co.jp/book/978-4-87783-469-2.html)

### Djangoのツボとコツがゼッタイにわかる本

本書は*実際にWebアプリケーションを作りながらDjangoを学ぶことが可能*です。PythonとDjangoの基礎は押さえ、これから自分の作品を作りたいという方におすすめです。実際のアプリの作り方を、本書は丁寧に解説しています。さらには、**作成したアプリを公開する方法まで説明があります**。上記2つの本で基礎を押さえたら、こちらの本にチャレンジしてみましょう。

[Djangoのツボとコツがゼッタイにわかる本](https://www.shuwasystem.co.jp/book/9784798062211.html)

### 動かして学ぶ! Python Django開発入門

本書は*Djangoの基礎を既に押さえた中級者におすすめ*です。本書ではWebアプリケーション開発の本格的な手法が学べます。DjangoによるWebアプリの設計方法や、認証処理、データベースとの連携、クラウドとの連携など、一通り学ぶことができます。**Pythonエンジニアとして更に技術を高めるなら欠かせない1冊**です。

[動かして学ぶ! Python Django開発入門](https://www.shoeisha.co.jp/book/detail/9784798162508)

## Pythonを勉強するならDjangoもあわせて習得しよう！

本記事では*Djangoについて解説*しました。Djangoとは何か、ご理解頂けたかと思います。DjangoはPythonエンジニアの間でも高く評価されているフレームワークです。Djangoを使うことで、効率的なWebアプリケーション開発が実現します。**昨今のWebアプリケーション開発はスピートが求められますので、優秀なフレームワークを選択することは重要**です。Pythonを勉強している方は、ぜひDjangoもあわせて勉強してみてください。

本記事では、Djangoについて解説します。DjangoはPythonフレームワークの中でも高いシェアを誇っています。Pythonエンジニアになるなら、Djangoも合わせて習得するのがおすすめです。本記事ではDjangoとは何か、Djangoのメリットなどについて紹介します。

DjangoとはWebアプリケーション開発で使うフレームワークのこと

DjangoはWebアプリケーション開発に関する機能を網羅している

Djangoとは何か？できることや習得するメリットを解説

## JavaScriptでゲーム開発は初心者でもできる

JavaScriptと言えば、Webサイトに動きを付けるために使用されるイメージを抱く方が多いでしょう。実は、**シューティングゲームやRPGなどのゲーム開発もJavaScriptで行うことができます。**プログラミング初心者がJavaScriptを使用してゲーム開発を行うとしても、ハイレベルなプログラミングスキルは要求されません。そのためJavaScriptの基礎を身に付ければ、ミニゲーム程度のゲーム開発を行うことは充分に可能です。
ここでは、JavaScriptの概要やできることについて詳しく紹介します。

**JavaScriptは主にWebサイトに動きを付けるために使用されることが多いプログラミング言語です。**また、JavaとJavaScriptの名称が似ているため、同様の言語と勘違いされる方も多いですが、これら2つは全く異なるプログラミング言語です。

HTMLやCSSのプログラミング言語を習得すれば、スマホやPCで閲覧できる簡単なWebサイトを作成することができます。しかし、これらの言語だけでは静的なWebサイトしか作成することができません。*JavaScriptのプログラミング言語を習得すれば、Webサイトに動的要素を追加できるため、よりユーザーに配慮したWebサイトを作成することが可能です。*

まず先述したように、*JavaScriptを使用すればスマホやPCのブラウザに表示された画面に動きを加えることができます。*例えば画面をスクロールしたら、背景のデザインを変化させることなどが可能です。他にもサーバと通信を行い、データを送受信することもできます。

**またNode.jsが登場したことにより、JavaScriptはフロントエンドだけではなく、サーバーサイドの開発でも使用されています。さらにReact Nativeというフレームワークを使用すれば、iOSとAndroidの両方に対応したスマホアプリを開発することが可能です。**このようにJavaScriptはWebサイトに動きを付けるだけではなく、様々なことに活用されています。

## JavaScriptでゲーム開発を行うメリット

JavaScriptの概要やJavaScriptでできることは理解できたでしょうか。ここでは、JavaScriptでゲーム開発を行うメリットについて詳しく紹介します。

### Web開発のスキルも併せて勉強できる

**JavaScriptは汎用性の高いプログラミング言語であるため、ゲーム開発を行うときに基礎スキルを習得すれば、Web制作やWebアプリ開発に応用することもできます。**例えばWebデザイナーにも興味がある方や、スマホアプリを開発してみたい方は、JavaScriptによるゲーム開発の経験は将来的に活用できる可能性が高いと言えるでしょう。

### 疑問点や不明点が生じても解決策を得やすい

**JavaScriptは世界中で使用されている言語であるため、数多くの開発者が初心者向けのトラブルに対する解決策に関する記事をインターネット上などで公開しています。**2021年8月のTIOBEインデックスのプログラミング言語人気ランキングに関するデータによると、JavaScriptは7位に位置しており、人気の言語であることが理解できます。
（ 参考：https://www.tiobe.com/tiobe-index/ ）

知名度が低いプログラミング言語の場合、情報収集に時間がかかってしまいます。一方JavaScriptの場合、数多くの知見があるため課題解決も比較的容易です。

### 他のプログラミング言語と比較して難易度が易しい

**多種多様にあるプログラミング言語の中でも、JavaScriptは習得難易度が比較的簡単な方です。**プログラミング初心者の場合、エラーやバグなど不具合が発生すると、モチベーションが維持できず挫折してしまうことも少なくありません。JavaScriptであれば習得難易度が低いため、プログラミング初心者にとって最初に学ぶ言語としておすすめと言えるでしょう。

### 短期間で開発を行うことができる

**プログラミング言語の習得難易度が低かったり、課題解決に対する知見が多かったりするということは、開発効率の向上にもつながります。**1つの制作に長い時間を割くのは実務において少なくありません。しかしプログラミング初心者の場合、短期間で成果を出せる方がモチベーションを維持しやすいと言えるでしょう。

ここではプログラミング初心者のために、JavaScriptを使用したゲームの作り方を習得するための学習方法をステップごとに紹介します。

**JavaScriptの開発環境の中で必須とも言えるのがエディタです。**JavaScriptでソースコードを記述するためにエディタが必要で、例えばメモ帳でも問題ありません。*しかしコーディングに特化したエディタを使用すれば、効率よく開発を行うことができます。また、将来的に実務のプログラマーとなった際にもエディタを使いこなせるのは重要です。*エディタにも様々な種類があり、例えば「Visual Studio Code」「Atom」「Emacs」などがあります。

**JavaScriptを使用する前にHTMLのスキルが必要です。**HTMLの知識のないプログラミング初心者は、まずHTMLの基礎を学習しましょう。HTMLの基礎は学習サイトや入門書などで学習すれば、簡単に身に付けることが可能です。
*Web制作を将来的に行いたいと考えている方は、CSSの知識を同時に身に付けたり、既に作成されているWebサイトをサンプルとして模写コーディングを行ったりすると実務で役立つスキルを習得できます。*

HTMLの基礎を学ぶことができたら、JavaScriptでゲーム開発を行うために、JavaScriptの基礎を勉強しましょう。**JavaScriptのおすすめの学習方法は、学習サイト・本・勉強会・プログラミングスクールなどが挙げられます。**どのような学習方法が自分に合うかを把握するために、独学でも勉強できるかどうかや、将来的な目標を明確にすることが大切です。

### JavaScriptを使用してソースコードを記述して実行する

**JavaScriptの基礎を学んだら、スキルを定着させるためにも実際に手を動かしてソースコードを記述してみることが重要です。**例えば学習サイトや本で扱ったサンプルコードを改変し、実際に実行してみるのがおすすめです。自分の手でソースコードを記述し、プログラムを実行すると、エラーなどの不具合が発生することも少なくありません。その際に新しい気づきを得られることが多く、スキルアップにもつながっていきます。
また、分からない部分が出てきたら、JavaScriptの基礎に立ち戻り復習を行うことも大切です。

### JavaScriptのゲームライブラリを勉強する

ライブラリとは、よく使用される機能をプログラムの中で再利用できるようにまとめたものを指します。**JavaScriptには数多くのライブラリが用意されており、ゲーム開発に特化したゲームライブラリもあります。**ゲームライブラリを使用すれば、プログラミング初心者でも効率よく開発を行うことが可能です。*特にゲーム開発には専門の知識やスキルが要求されるため、ライブラリを活用しないでゲーム開発を行うのは、初心者にとって難易度が高いと言えるでしょう。*

### JavaScriptを使用してゲーム開発を行う

JavaScriptのゲームライブラリを身に付けることができたら、実際にゲーム開発を行いましょう。**本格的なゲーム開発を行う前に、まずはサンプルを模写することから始めてみるのがおすすめです。**ソースコードのサンプルコードを使用してプログラミング言語の基礎を学ぶように、サンプル模写を行えばゲーム開発に必要な考え方を身に付けることができるでしょう。

初心者の場合、難しいサンプルを模写して学習すると、途中で挫折してしまうこともあるため、ミニゲーム程度のサンプルから取り組んでみることがおすすめです。*サンプルを通してゲーム開発の基礎を身に付けることができたら、自分なりのアレンジを加えて好みのゲーム開発を行ってください。*

## JavaScriptを使用すれば初心者でもゲーム開発ができる

これまでに、JavaScriptの概要やJavaScriptでゲーム開発を行うメリット、JavaScriptを使用したゲームの作り方について解説しました。**JavaScriptは主にWebサイトに動きを付けるために使用される言語ですが、近年では活躍の幅は拡大しており、ゲーム開発にも使用できます。**

JavaScriptは世界中で使用されており知名度が高いため、情報収集しやすいという特徴があります。また、JavaScriptは他のプログラミング言語と比較すると習得難易度が低いため、プログラミング初心者が最初に学ぶのにおすすめの言語とも言えるでしょう。

言語・開発の記事（107ページ目）