- [HTMLを独学で勉強するには? エンジニアが学ぶべき理由や習得に必要な時間](https://and-engineer.com/articles/YXpquhUAACsAivlG)

- [HTMLでできることは少ない？できないことやタグも一覧でまとめた](https://and-engineer.com/articles/YV1ZtxAAACn9LtD9)

- [HTMLのdivタグとは？読み方・目的・使い方などを解説！](https://and-engineer.com/articles/YUmP1hAAACUA1NVs)

まずは、*HTMLとは何か*について解説します。HTMLが使われる場面やPHPなどのプログラミング言語との違いについて詳しくみていきましょう。

### HTMLはホームページの文書を作成するための言語

HTMLとは、*ホームページの文書を作成するための言語*のことです。ホームページの文書には見出しが表示されていたり、画像・表・リストなどが挿入されていたりします。**HTMLでは「タグ」というものを使って、このような文書を書き表すことが可能**で、HTMLのソースコードを書いたファイルを「HTMLファイル」と呼びます。HTMLファイルをブラウザで開くと、ブラウザがHTMLコードを読み取り、ホームページを作成します。

また、HTMLと並んで多く使用されるのが「CSS」で、**ホームページのデザインを整えるための言語**です。デザインはHTMLだけでも整えることは可能ですが、HTMLのみだとコードの中身が複雑になり、開発が困難になってしまいます。そこで、デザイン部分の処理はCSSを使って記述することでコード全体がまとまり、ホームページの修正を行う際も比較的容易になります。

CSSとは？初心者が覚えたい基礎知識から使用例まで解説！

HTMLを使う代表的な仕事は、*Webデザイナー*です。WebデザイナーはWebサイトのデザイン面を担当する仕事で、どういったデザインにするか考え、デザイン通りになるようにHTMLコードを記述していきます。

他にも、マークアップエンジニアという仕事もあります。マークアップエンジニアは、HTMLコードの記述のみに特化したエンジニアです。**HTMLやCSSについてより深く精通し、ハイレベルなコードを書ける必要がある**でしょう。

HTML・CSSとは何か？使い方やできること、独学方法を解説！

### HTMLとプログラミング言語の違い

HTMLは厳密には、*プログラミング言語ではありません*。プログラミング言語とは、コンピュータに処理を行わせるための言語のことです。たとえば、コンピューターに計算をさせたり、同じ処理を繰り返しさせたりします。

**HTMLは計算や繰り返し処理を記述することができない**ため、それらの処理が得意なPHPやJavaScriptなどのプログラミング言語とは、明確に区別されています。

PHPでできることを解説！機械学習やスマホアプリ開発はできる？

JavaScriptでできることとは？代表的なものから特徴まで詳しく紹介！

## HTMLを勉強するのにおすすめな本5選

*HTMLを勉強するのにおすすめの本*を5つ紹介します。これらの本は、これからHTMLを勉強する方に特におすすめです。どの本を購入すべきかわからない場合はこの中から選んでみてください。

### スラスラわかるHTML&CSSのきほん

こちらは、ベストセラーにもなっているHTMLの本です。HTMLとCSSの基礎について丁寧に解説しており、スラスラ理解できる1冊です。書籍内にはソースコードも多く掲載されており、詳細な解説が特徴です。**自分が書いたコードの意味を、一行一行理解しながら進めていける**でしょう。

*[スラスラわかるHTML&CSSのきほん](https://www.sbcr.jp/product/4797393156/) *

### いきなりできます！最新ホームページ作り&HTML超入門

本書は、*ホームページ作りについて解説が網羅されている1冊*です。HTMLの書き方だけでなく、画像の扱い方やサーバにファイルをアップロードする方法まで、詳しく解説されています。さらに、Twitterボタンの設置方法など細かいところも抜けなく説明がされているため、本書でホームページ作りの基礎が身につくでしょう。
なお、本書は**Windows対応となっており、Macには対応していないので要注意**です。

*[いきなりできます！最新ホームページ作り&HTML超入門](https://www.sbcr.jp/product/4797382235/) *

### いちばんやさしい HTML&CSS 入門教室

本書は、HTMLとCSSの使い方について*ステップ・バイ・ステップで学ぶことが可能*です。また、現在のトレンドを意識し、**スマホ向けサイトの作り方を重点解説**しているのもポイントでしょう。最終的には、レスポンシブデザインの制作ができるようになります。現場で役立つスキルを身に着けたい方に、おすすめの1冊です。

*[いちばんやさしい HTML&CSS 入門教室](http://www.sotechsha.co.jp/pc/html/1213.htm) *

### 1冊ですべて身につくHTML&CSSとWebデザイン入門講座

本書は、*書店員がオススメする「CPU大賞」の1位に選ばれている1冊*です。最新技術にも対応しており、**レスポンシブ・Flexbox・CSSグリッドも学べます**。コードの書き方だけでなく、デザインのことも同時に勉強することが可能なため、まさに1冊ですべてを身につけられる本と言えるでしょう。

*[1冊ですべて身につくHTML&CSSとWebデザイン入門講座](https://www.sbcr.jp/product/4797398892/) *

### いちばんよくわかる HTML5＆CSS3 きちんと入門

本書は、*やや上級者向けの本です*。HTMLやCSSの実践的なテクニックについて詳しく解説されてあり、多くのサンプルコードが掲載されているため、手を動かしながら学ぶことができます。本書を読み込むことで、無駄のないHTMLコードを書けるようになるでしょう。**ある程度HTMLとCSSを学んだ方に、おすすめの1冊**です。

*[いちばんよくわかる HTML5＆CSS3 きちんと入門](https://www.sbcr.jp/product/4797388541/) *

続いて、*HTML本の選び方について解説*します。書店に行くと多くの種類のHTML本が並んでいます。その中から自分に合った本を探すコツをまとめました。

基本的に技術書系は電子書籍より、*紙の本を選択するのがおすすめ*です。理由として、電子書籍だと見開きにしにくく、サンプルコードが途中で途切れてしまうこともあるためです。また、**紙媒体の方が調べたことをメモしやすい**など、メリットが多くあります。

HTMLの本は、*なるべく出版日が最新のものを選択*しましょう。HTMLやCSSはこれまで何度もバージョンアップされており、新機能が追加されてきています。**出版日が古い書籍だと新機能についての解説がありません**。書籍を購入する場合は、出版日を必ず確認するようにしましょう。

### CSSも解説しているものを選ぶ

HTMLだけでなく、*CSSも十分に解説されている本が良い*でしょう。なぜなら、HTMLを使う場合は必ずCSSも一緒に使うことになるためです。Webデザイナーやマークアップエンジニアは、**HTMLとCSSを上手く使い分けるスキル**が求められます。

### ホームページの作り方まで解説しているものを選ぶ

*ホームページの作り方まで解説されている本だと、より良い*でしょう。レンタルサーバーの使い方・ドメインの取得方法・FTPソフトの使い方・ファイルのアップロード方法について、総合的に解説している本がおすすめです。**HTMLの文法は分かるけれど、サイト作成でつまずいているという方は多い**です。ホームページの作り方に関しても、十分なページ数を割いて解説されているか確認しましょう。

最後に、*HTMLを勉強するコツ*についてまとめました。HTMLを効率的にマスターするにはどうすべきかまとめてあります。これからHTMLの勉強を始める方は、ぜひ参考にしてください。

まずは、*学習スケジュールを立てることが肝心*です。1週間後、1ヶ月後に、学習をどこまで進める予定か紙に書き出してみましょう。本格的なWebサイトを作れるまでは、長期的な学習が必要です。学習スケジュールを立てないと**現時点で学習が何%程度進んだのか分からず、学習意欲が衰退してしまい、途中で挫折してしまう可能性があります**。学習スケジュールはしっかり立て、机の前などに張り出すのが良いでしょう。

### 実際に手を動かしながら学習する

HTMLの勉強は、*実際に手を動かしながら学習*しましょう。HTMLの本にはサンプルコードが掲載されているものが多いため、サンプルコードを模写し、**自分のブラウザで表示させてみてください**。コードの実行結果を確認することで、HTMLについて分かることが増えたという実感が湧き、勉強意欲が出てきます。

何冊も本を購入する勉強方法は、あまりおすすめできません。まずは、*1冊を完璧にこなすことが大切*です。HTMLの優良な本には、1冊に基礎がほとんど詰まっているため、1冊を完璧にするだけでも十分に基礎は固まります。その反面、**複数の本をこなそうとすると学習が散漫になってしまいがち**です。他の本にチャレンジするのは、1冊目を完璧に理解してからでも遅くはありません。

## HTMLの勉強は本がおすすめ！手順に基づいて効率的に勉強を進めよう

本記事では、*HTMLを勉強する場合のおすすめの本*について解説しました。どういった本を購入するのが良いのか、お分かり頂けたかと思います。HTMLだけを学んでも実務に活かすのは難しいため、**CSSやホームページの作成方法まで総合的に学べる本を探すのが良い**でしょう。また、なるべく出版日が新しい本だとHTMLの最新バージョンに対応しているため、おすすめです。本記事がHTMLをこれから学ぶ方にとって、有意義なものとなれば幸いです。

本記事では、HTMLを勉強できるおすすめの本を解説します。HTMLは長きに渡って使われているIT言語のため、書籍も多く販売されています。そのため、どの本を選択すべきか分からない人も多いでしょう。今回はおすすめのHTML本を5つ厳選しました。

HTMLとはホームページの文書を作成するための言語

CSSやホームページの作成方法まで、総合的にHTMLを学べる本を探すのが良い

なるべく出版日が新しい本がおすすめ

初学者必見！HTMLを勉強するのにおすすめの本を5つ厳選

- [MySQLとは？特徴から使い方・学習方法まで詳しく解説！](https://and-engineer.com/articles/YThWCRAAACIAP_DX)

- [データベースとは？今更聞けないその内容をITエンジニアとして改めて学ぶ](https://and-engineer.com/articles/YFgi6hAAACEAvr1C)

- [データベースエンジニアとは？仕事内容や将来性、キャリアパスなどを解説](https://and-engineer.com/articles/YXqq8BUAACsAjC1P)

ITエンジニアを目指して学習していると、「MySQL」という言葉を聞くことがあります。データベース関連だとは分かるものの、詳しくは分からない方が多いのではないでしょうか？
ここではそんな方に向けて*「MySQL入門編」*として、「MySQL」に関する素朴な疑問にお答えする形で解説していきます。

### MySQLは世界で最も使われているRDBMS

**「MySQL」とは、世界中でもっとも多く利用されているRDBMS「リレーショナルデータベース管理システム」**です。オープンソースで、商用利用以外であれば誰でも無償使用が認められており、初心者でも扱いやすい人気のRDBMSです。
また*オープンソースにもかかわらず、DBMSとして必要かつ便利な機能がしっかりと備わり、大容量のデータベースでも扱える*ため、多くの企業で利用されています。

MySQLという名前の由来は、MySQLの主製作者ミカエル・ウィデニウスが、娘の名前「My」から取ったとされています。**MySQLはC言語で書かれ、1995年に初期バージョンが「MySQL AB」社からリリース**されました。
2008年にMySQL AB社はサン・マイクロ社に吸収され、さらに2010年にはオラクル社がサン・マイクロ社を買収しています。*現在はオラクル社がMySQLの商用版を販売・サポート*しています。

 MySQLの特徴としては、**オープンソースである点以外にも次のような特徴**があります。

*▪さまざまなOS（LINUX、Windowsなど）に対応*
*▪個人レベルから大組織まで柔軟に対応可能*
*▪シンプルで開発しやすい*
*▪世界シェアではOracleに次いで2位*
*▪Webサービスでの利用が多い*
*▪クラウド利用が増えている*

MySQLを本格的に学ぶ予定がないエンジニアの方も、以上の特徴は押さえておきましょう。

ITエンジニアを目指す方は、データベースの概念についてはよくご存じと思いますが、初めての方のために今1度確認しておきましましょう。
**コンピュータ上で検索や蓄積などをしやすく整理した情報の集まりをデータベースと称し、その操作や管理を可能にしたものをDBMS（データベース管理システム）と呼んでいます**。

DBMSには主に次のような機能が備わっています。もちろんMySQLにもこれらの機能が備わっていますので、確認しておきましょう。

**1.データの管理機能**
データベースに格納するデータの形式を定義し、*データの追加・削除・更新・検索機能などの機能*です。

**2.トランザクション管理機能**
1つの例を挙げてみましょう。銀行取引で、A口座にある預金の一部をB口座に移動するといった処理を考えると、いずれの処理も連動をしていないと不整合が生じます。
A口座は預金が減少したにもかかわらず、B口座の預金が増えていない現象が生じると、データベース上では矛盾が生じてしまいます。
*トランザクション管理機能は、一連の処理を1つのものとしてデータベースに反映させ、データベース上に不整合が生じないようにコントロールする機能*です。

**3.同時実行制御機能**
データベースでは同時に複数のユーザーがアクセスする場合が多くありますが、そのことで*データに不整合が生じてしまわないようにアクセス制御を行う機能を「同時実行制御機能」といいます*。

**4.セキュリティ管理機能**
データベースに対するセキュリティをコントロールする機能です。たとえば、*アクセス権限が付与されていないユーザーによる不正アクセスなどを防ぎます*。

**5.障害回復管理機能**
コンピュータ障害などによってデータベースに不具合が生じた際に、*データを不具合が発生する前の正常な状態に戻すための機能*です。

MySQLのSQLも同義ですが、**「SQL」とは、データベース（RDBMS）を操作する際に使われる言語で、プログラミング言語と似ています**。「SQL」を利用するRDBMSには、MySQL以外にPostgreSQL・Oracle・SQLServerなどがあります。
SQLは国際標準化されており、さまざまなデータベースで同じように利用できます。一方*SQLを利用しないDBMSは「NoSQL」と呼び、RDBMS以外のデータベースで、Hbase・MongoDB・Casandraなどの製品*があります。

### 最低限知っておきたいデータベース用語

データベース（RDBMS）はWebアプリには欠かせないものですが、*データベースに関して最低限押さえておきたい用語*があります。直接データベース構築に関わらないエンジニアの方も、以下の4つは理解しておきましょう。
分かりやすいように、ここではExcelとの対比で解説します。

**1.テーブル**
データベースをExcelのブックだとすると、*テーブルはシートに相当*します。

**2.カラム**
Excelシートの*列に相当*します。カラムごとに文字列、数値のように属性が定められています。

**3.レコード**
レコードは*データそのもの*を示す言葉ですが、*カラムが列であるのに対し、レコードは行を意味する”ロウ”と同じ意味で使われる場合も*あります。

**4.フィールド**
レコードを構成している1つの要素で、*Excelの”セル”に相当*します。



以上を個人情報のデータベース（Excelのブック）を例にして整理すると、*レコードは氏名・生年月日・住所などで、カラムは氏名・生年月日・住所のこと、フィールドは氏名（ex山田花子）です*。そして、これらの集合体がテーブル（Excelのシート）です。

分からなくなったら、Excelに置き換えて考えてみるとよいでしょう。

MySQLとデータベース（RDBMS）の概要について分かったところで、*MySQLに関する一般的な疑問に対して、FAQ形式で解説*をしていきます。詳細は参考URLなどを示しておきますので、そちらを参照してみてください。

### MySQLのインストール方法は？

MySQLはオープンソースのRDBMSだと説明しました。MySQLは**無償で、直接PCにダウンロードし、インストール後に利用**できます。
以下に具体的なダウンロード・インストール・サービス登録・コマンドによる起動など、MySQLを利用する上で参考になるドキュメントの参照方法などが詳しく載っていますので、ぜひ参照してみてください。

*【参照】：[MySQLインストール](https://www.dbonline.jp/mysql/install/)*

**MySQLにはコマンドプロンプトからデータベースとMySQLを操作するためのプログラムが用意**されています。それらの使い方が詳しく載ったサイトをご紹介します。先ほどのサイトのコンテンツであり、馴染みやすいと思います。

*【参照】：[MySQLコマンドラインツールの利用](https://www.dbonline.jp/mysql/connect/)*

MySQLに慣れてくると、自ら簡易的なDBを作成してみたくなるでしょう。以下のサイトでは、**MySQLによるデータベースの作成と削除の方法**などが解説されています。

*【参照】：[MySQLの使い方>データベースの作成](https://www.dbonline.jp/mysql/database/)*

### MySQLのテーブル作成方法は？

データベースを作成したら、次にテーブルを作成します。ここでは**テーブルの作成・削除・テーブル一覧の表示・テーブル構造の変更まで**が解説されていますので、テーブル操作について一通り学べるでしょう。

*【参照】：[MySQLの使い方>データベースの作成](https://www.dbonline.jp/mysql/table/)*

MySQL コマンドラインツールには、SQL文の実行以外に** 「MySQL コマンド」と呼ばれる独自のコマンドが用意されています**。「 MySQL コマンド」の一覧およびコマンド実行方法については以下のサイトで確認してみてください。

*【参照】：[MySQLコマンドの一覧とコマンドの実行](https://www.dbonline.jp/mysql/connect/index4.html)*

**MySQLを学ぶには、目標を定める意味でも資格取得を目指す**ことをおすすめします。この資格取得を第1ゴールとして設定し、学習に励みましょう。ここでは、MySQLに関する認定資格試験と、入門書による独習について紹介します。

### MySQLに関する資格に挑戦する

MySQLに関する認定資格はいくつかありますが、ここではMySQLのデータベースエンンジニアを目指す方や、データベース関連の資格取得を図りたい方向けの認定資格として、**オラクル社の「MySQL 5.7 Database Administrator」をおすすめ**します。試験はオンラインでの受験も可能で、出題数75問、試験時間は120分、選択式試験です。合格ラインは58%で、*座学だけでも合格が可能なレベル*と考えてください。

詳しくは、*[MySQL 5.7 Database Administrator試験番号: 1Z0-888](https://education.oracle.com/ja/mysql-57-database-administrator/pexam_1Z0-888)*を参照してください。

### 入門書で学ぶ（おすすめの入門書）

MySQLなどのRDBMSの習得方法としては、スクールの利用が近道かもしれませんが、数十万円の費用が掛かること、オフラインスクールだと通学で拘束時間が長くなるといったデメリットがあります。
**ITエンジニアとしてある程度のITスキルを有する方には、費用がほとんど掛からず、スキマ時間を利用して学ぶことができる入門書などによる独習方法がおすすめ**です。以下に、MySQL習得に向けた入門書を2冊紹介します。

*[ゼロからわかる SQL超入門 （かんたんIT基礎講座） （技術評論社）](https://gihyo.jp/book/2017/978-4-7741-9258-1)*
MySQLというよりは、**SQLを初めて学ぶ人に向けた入門書**です。RDB（リレーショナルデータベース）を扱うに際して、必要なSQLの基本を確実に理解できる内容や構成になっています。*実習形式で練習問題を通して反復学習ができるので、独習書としておすすめ*です。

*[MySQL徹底入門 第4版 MySQL 8.0対応（翔泳社）](https://www.shoeisha.co.jp/book/detail/9784798161488)*
この入門書は「入門」とはなっていますが、1から学ぶ人には向いていません。上で紹介した「ゼロからわかる SQL超入門」などで**SQLの基本を身に付けた上で接すると、習熟が進みます**。内容はかなり実務に即しており、*SQLを実際に使う予定のエンジニア向け*と考えてください。 

MySQLを身に付け、実務経験を積むことでデータベースエンジニアとなれるでしょう。しかし、それはあくまでも通過点であり、その先を目標とすべきです。

**データベースエンジニアのスキルを活かせるキャリアバスとして、「プロジェクトマネージャー」「データベースコンサルタント」「データサイエンティスト」などがあります。**ぜひ、自身の将来像、将来目標を明確にした上でMySQLの習得に努めてみてください。

MySQLは世界で最も普及しているオープンソースの（RDBMSリレーショナルデータベース管理システム）であり、データベースに強いエンジニアを目指す人には必須のRDBMSです。ここではMySQL入門編として、基本的な知識・使い方・勉強方法などを解説していきます。

MySQLは世界で最も利用されている、将来性の高いオープンソースのRDBMSである。

MySQLはシンプルで分かりやすいSQLであり、データベースのオラクル社が提供していることから多くの企業で使われている。

MySQLを習得する上ではMySQLに関する認定資格取得、そのための入門書による独習が適している。

MySQL入門！世界で最も普及しているRDBMSを学んでみよう

- [Djangoとは何か？できることや習得するメリットを解説](https://and-engineer.com/articles/YT2muRAAACQAnsQM?utm_source=blog&utm_medium=none&utm_campaign=and-engineer_topics01_211029)

- [Pythonのよく使うライブラリ一覧！一段上の開発を目指そう](https://and-engineer.com/articles/YJjVUREAABL1ZVii?utm_source=blog&utm_medium=none&utm_campaign=and-engineer_topics02_211029)

- [PythonでのWebアプリ開発で使うフレームワークを解説！](https://and-engineer.com/articles/YPuC3xIAACQAic3M?utm_source=blog&utm_medium=none&utm_campaign=and-engineer_topics03_211029)

Django（ジャンゴ）とは、**ウェブアプリケーションフレームワーク**の1つを指し、*Pythonで実装*されています。Djangoは*データベース主体のウェブサイト*を簡単に構築できるように、Pythonを用いて*データモデルを定義するだけでシステムが構成できます*。
参考：[django](https://www.djangoproject.com/)

Djangoは日本語コミュニティもあるため、必要な情報はコミュニティからも入手可能です。
参考：[DJANGOPROJECT.JP](https://djangoproject.jp/)

### そもそもアプリケーションフレームワークとは？

アプリケーションフレームワークとは、アプリケーションを使用するための**考え方を整理しルール化したもの**です。ルール化に沿って*使い方やAPIが設定*され、これらを**ライブラリ化して提供している**ものがアプリケーションフレームワークです。

また、ウェブアプリケーションフレームワークは*ウェブアプリケーションをフレームワーク化*したもので、効率的にウェブアプリケーションを開発するための作法ならびにライブラリです。

### DjangoとPythonのバージョンの対応

DjangoはPythonを用いるため、対応バージョンが決められています。最新オフィシャルバージョンである*Django 3.2*は、*Python 3.6から最新のPython 3.10まで対応*しますが、**Python最新バージョンの利用が推奨**されています。旧バージョンの対応状況は以下のリンクからご確認ください。
参考：[Django どのバージョンの Python で Django が使えますか?](https://docs.djangoproject.com/ja/3.2/faq/install/#faq-python-version-support)

## Djangoをインストールするには？

DjangoはPythonを使用するため、**事前にPythonをインストール**します。

Pythonのソースコードやインストーラは、*Python公式サイトのDownloadリンク*にあります。2021年10月現在*Python 3.10.0が最新*で、バージョンを指定してダウンロードすることが可能です。*Windows・LinuxやMac OS*および他のプラットフォームの情報が提供されています。
参考：[Python Download](https://www.python.org/downloads/)

実際のモジュールやインストーラのダウンロードはバージョンごとにまとめられているので、最新版のダウンロードはPython 3.10.0のダウンロードサイトを用います。
参考：[Python 3.10.0 Download](https://www.python.org/downloads/release/python-3100/)

Djangoのインストールは、**Python標準のpipコマンド**を使います。pipは、Python標準のPyPI（Python Package Index）のパッケージをインストール・管理するツールです。pipを用いたインストール方法では、次のようにDjangoをインストールします。
**Linux・MacOSの場合：**
　$ python -m pip install Django
**Windowsの場合：**
　C:\> py -m pip install Django

2021年10月現在の最新リリースは、3.2.8です。インストール時にバージョン指定がない場合は最新版がインストールされます。pipでバージョン指定する場合は、目的のバージョンを以下の様に指定します。
**Linux・MacOSの場合：**
　$ python -m pip install Django==3.2.8
**Windowsの場合：**
　C:\> py -m pip install Django==3.2.8

なお、WindowsでLinuxと同じ環境を再現する方法として、「*Windows Subsystem for Linux*」を用いる方法があります。Windows10の手順は以下の通りです。

・*「Windows Subsystem for Linux」の有効化方法*
　スタートメニューを右クリック、「ファイル名を指定して実行」をクリックします。
　ファイル名を指定して実行の「名前」にcontrolを入力し「OK」をクリックします。
　表示されたコントロールパネルの「プログラムと機能」をクリックします。
　左に表示されている「Windowsの機能の有効化または無効化」をクリックします。
　「Linux用 Windows サブシステム」をチェックして「OK」ボタンをクリックします。
・*Ubuntuの入手*
　UbuntuをMicrosoft Storeから検索し、「入手」をクリックします。

Djangoの動作確認は、Pythonを起動して**djangoをimport**後以下の方法で行います。
*確認方法：*
　$ python
　>>> import django
　>>> print(django.get\_version())
　3.2

Djangoの仮想環境作成方法は、**Pythonの手順**に従います。Pythonでは開発プロジェクトを複数作成する際に、仮想環境を作成します。仮想環境により他のプロジェクトへ影響を与えずにモジュールを追加したり、異なるバージョンのモジュールを使用したりできます。

手順としては、最初に*venvコマンド*を用いて仮想環境を作成します。
*用法：*
　$ python3 -m venv 新しいパス名
**使用例：Linux・MacOSの場合**
　$ python -m venv myvenv
**使用例：Windowsの場合**
　C:\Users\user> py -m venv myvenv

続いて仮想環境に入り、pipコマンドを用いて仮想環境へパッケージをインストールします。
**使用例：Linux・MacOSの場合**
　$ source myvenv/bin/activate
　(myvenv) $ pip install django
　(myvenv) $ deactivate
　$
**使用例：Windowsの場合**
　C:\Users\user> myvenv\Scripts\activate.bat
　(myvenv) C:\Users\user> pip install django
　(myvenv) C:\Users\user> deactivate
　C:\Users\user>
参考：[Python Docs venv --- 仮想環境の作成](https://docs.python.org/ja/3/library/venv.html)

Djangoの動作確認が終わりましたら、実際に使ってみましょう。以下はセットアップと起動の入門情報です。

・*初期セットアップ*
　最初にプロジェクトを構成することでコードが自動生成されます。
　コマンドはdjango-adminを用います。
**使用例：Linux・MacOSの場合**
　$ django-admin startproject プロジェクト名
**使用例：Windowsの場合**
　C:\Users\user> django-admin startproject プロジェクト名

プロジェクト名をmyprojectとすると、myprojectディレクトリに必要なコードが自動生成されます。プロジェクト名はdjangoやtestは使用すると名前の解決・処理で問題が発生するため、それ以外の名称を指定します。

・*プロジェクトフォルダ内のファイル*
　”django-admin startproject プロジェクト名”で以下のファイルが作成されます。
　manage.py - プロジェクト管理用のユーティリティ
　プロジェクト名/\_\_init\_\_.py - Pythonパッケージであることを通知する空ファイル
　プロジェクト名/settings.py - Djangoの設定ファイル
　プロジェクト名/urls.py - DjangoのURLファイル
　プロジェクト名/asgi.py - ASGI互換ウェブサーバーのエントリポイント
　プロジェクト名/wsgi.py - WSGI互換ウェブサーバーのエントリーポイント

・*開発サーバーの起動*
　初期セットアップが完了したら、以下のコマンドで動作を確認しましょう。
**使用例：Linux・MacOSの場合**
　$ python manage.py runserver
**使用例：Windowsの場合**
　C:\Users\user> py manage.py runserver

　”System check identified no issues (0 silenced).”が表示されたら正常です。
　ブラウザで”http\:\/\/127.0.0.1:8000\/” に接続し、"Congratulations!"の表示を確認します。
　終了は「Ctrl」+「C」です。
　サーバのポート番号は”manage.py runserver” の後ろに指定可能で、デフォルトは8000です。

### インストールできない場合の対処方法

Djangoが上手くインストールできない場合や動作しない場合は、以下の確認をおすすめします。

Djangoのユーティリティ**django-adminが起動しない場合**は、以下のエラーが表示されます。
*“command not found: django-admin”*
この場合はPATHが正しく設定されているか確認してください。PATHが正しい場合は仮想環境の確認をしてください。

MacOSやUnix系システムの場合は、**django-admin実行時に以下のエラーが表示される**ことがあります。
*"permission denied" *
この場合はターミナル等を開き、chmodでdjango-adminファイルの実行可能モードの設定が必要です。”sudo chmod +x django-admin”でモード変更を行います。

詳細なトラブル対応方法は、公式サイトまたはコミュニティサイトのドキュメントをご参照ください。
参考：[django Troubleshooting](https://docs.djangoproject.com/en/3.2/faq/troubleshooting/)
参考：[django トラブルシューティング](https://docs.djangoproject.com/ja/3.2/faq/troubleshooting/)

## Djangoがインストールできたらウェブアプリケーションに活用しましょう

Djangoは簡単にデータベース接続ができる*ウェブアプリケーションフレームワーク*で、*InstagramやMozilla*でも採用されています。学習効果が高く、手間をかけずにシステム構築が完了します。インストールできたら、実際のウェブアプリケーションで**効率的なシステム開発を行う**ことをおすすめします。

Djangoは、Pythonで実装されているウェブアプリケーションフレームワークです。データベースとの接続性が高く、多くの有名サイトで利用されています。ここでは、実際のDjangoのインストール手順と確認方法を入門情報を交えて説明していきます。

Djangoとは、Pythonで実装されているウェブアプリケーションフレームワークの1つを指します

Djangoは、Pythonを用いてデータモデルを定義するだけでシステムが構成できます

簡単で学習効果が高く、有名サイトでの採用が多い人気のフレームワークです

Djangoのインストール：実際の作業と入門情報を解説！ 

**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タグ一覧など初心者向けに解説！ 

## 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の基礎に立ち戻り復習を行うことも大切です。

初心者・入門の記事（21ページ目）