• Skip to main content
  • Skip to primary sidebar

プログラミング入門ナビ

プログラミング学習初心者のための情報メディア by Proglus(プログラス)

You are here: Home / Archives for プログラミング入門

プログラミング入門

SQLとは?エンジニアに必須の知識を初心者にもわかりやすく説明!

2020-11-30 By プログラミング入門ナビ編集部

検索

はじめに

ラップトップを持つエンジニア

SQL(読み:エスキューエル)という言葉を聞いたことがあるでしょうか。

聞いたことはあるが何か知らない、または何となくデータベースを操作するための言語だとは知っているけれど、いまいち理解できていない…

この記事では、そんな方々へ向けてSQLとは何なのか?どういった使い方をするのか?を詳しく説明します。

SQLはエンジニアの必須知識ですので、ぜひこの記事を読んでしっかりと理解を深め、他の人にも教えてあげられるようになることを目指してください。

SQLとは?

SQLは1970年代にIBM社によって開発されたSEQUEL(読み:シークェル)という言語を原型とするデータベース操作言語です。

読み方は「エスキューエル」が一般的ですが、上記の理由から「シークェル」と読まれることもあります。

そもそもデータベースとは?

書類のファイル

ここで、データベースというのは、検索や貯蓄が簡単に高速にできるように整理されたデータの集まりのことです。

例えば、紙の名刺帳を想像してください。

面倒くさがりの人は特にルールを決めずにもらった名刺を適当にファイリングするでしょう。

かたや、まめな人ならば五十音順にインデックスをつけてファイリングしていき、後から名前で探したり新たに追加したりするのが簡単にできるようにしていますね。

広義ではこの後者の名刺帳もデータベースと呼べます。データベースと聞いてピンとこない方はこれをイメージしながら考えていくと概念を掴みやすいです。

もちろん、プログラミングの世界でのデータベースは紙ではなく電子的な情報の集まりを指します。

「名刺帳」という名の電子的なデータベースを作った時、新たにもらった名刺データを追加したり、登録済みの名刺データを検索したりするには、データベースに対して追加・検索等の操作が必要ですね。

この操作をするための言語がSQLなのです。なお、SQLはリレーショナルデータベースという種別のデータベースを管理するシステム(RDBMS)でのみ使用されます。

参考:RDBMSとNoSQLの違い

ここでまた聞き慣れない言葉(RDBMS)が出てきました。

データベース管理システムは大まかに2種類:RDBMSとNoSQLに分けられ、SQLは前者のRDBMSでのみ使用されます。

ここからはRDBMSとNoSQLの違いについて簡単に説明しますので、とりあえずSQLについて先に知りたい方はこの項を読み飛ばしていただいても問題ありません。

RDBMS(Relational DataBase Management System)は、リレーショナルデータベースを管理するためのシステムのことです。

リレーショナルデータベースとは、関連性を持った複雑なデータ群を指します。

例えば先ほどの名刺帳の例ならば、個々の名刺にはその人の氏名だけでなく、会社名・所属・連絡先等が書かれていますね。

そこに載っていない情報、例えば「この会社って資本金はいくらくらいなのかな?」と疑問が沸いたとしましょう。

この時、別の「企業情報」というファイル(リレーショナルデータベースの世界ではテーブルと呼びます)に会社名ごとに創立年・社員数・資本金等のデータが揃っていれば、名刺に書いてある「会社名」をもとに辿って資本金を確認することができますね。

このように、複数のデータ群が関連性を持った形で整理されていて膨大で複雑なデータを管理できるようになっているのがリレーショナルデータベースです。

データが複雑である分、操作も複雑になるためSQLを用いて行う必要があります。

他方のNoSQL(読み:ノーエスキューエル)は、SQLを用いずにデータベースを管理するシステムの総称です。

NoSQLはRDBMSと比較しデータ構造が単純なため、操作に特別な言語が必要ありません。

例えば先ほどの名刺帳の例のように、取引先の個々の担当者情報や企業情報等を網羅的に管理しようとすればRDBMSを使わざるを得ませんが、そうではなく取引先1社につき1人の営業担当がいて、それが誰であるかのみ管理できればいいとしましょう。

この場合は名刺帳や企業情報ではなく、「取引先会社名-営業担当者氏名」という情報が1対1で紐づくデータ群さえあればいいことになります。

このように単純な構造を持つのがNoSQLであり、繰り返しになりますがSQLでの操作が必要ないのがRDBMSとの大きな違いです。

SQLの基本的な使い方

検索

ここからは具体的にSQLがどう使われるのか見ていきましょう。

データベース用語

まずは覚えるべき用語を確認しておきましょう。

リレーショナルデータベースでは、データは表計算ソフト(Excel等)のように表の構造をしています。

例えば名刺帳の例なら下記の通りです。

氏名 会社名 所属 住所 電話番号 メールアドレス
山田 太郎 (株)○○商店 営業課 東京都新宿区… 033-209-XXXX yamada@XXX.com
鈴木 二郎 △△製作所(株) 調達課 大阪府東大阪市… 064-309-YYYY jiro-s@YYY.co.jp
佐藤 三郎 □□工業(株) 企画課 神奈川県川崎市… 044-200-ZZZZ info@ZZZ.co.jp

このそれぞれの項目について、データベースの世界では下記の用語で呼びます。

  • テーブル:表そのものを指す。
  • レコード:各行のこと。この例では名刺1枚のが情報が1レコードで表される。
  • カラム:各列のこと。列ごとにデータの形式が定義される。(メールアドレスは@を含む英数字の文字列、等)
  • フィールド:レコードの中の1項目のこと。(例:山田太郎のレコードの「所属」フィールドは「営業課」)
  • フィールド名:そのフィールドの先頭列の名称を指す(氏名・会社名・所属・…)

SQLの文法種別

SQLの文法は大きく下記の三種類があります。

  • データ定義言語:データベースオブジェクト(テーブルなど)の新規作成や削除を行う
  • データ操作言語:テーブルへのデータ追加・更新・削除・検索を行う
  • データ制御言語:データベースへのアクセス権限やトランザクション(※)管理

※トランザクション:データベースの整合性を保つために、ばらばらに実行すべきでない複数の処理をまとめて一括処理すること

以下、順番に具体例を見ていきましょう。

データ定義言語

データ本体であるテーブルや、データベースを利用するユーザ等のデータを定義するための文です。

CREATE(作成)やDROP(削除)、ALTER(定義変更)等があります。

下記はテーブルを新規作成する例です。

CREATE TABLE meibo {
  name varchar(20),
  tel int,
  email varchar(50)
}

データ操作言語

テーブルに対するデータ操作を行うための文です。

テーブルにデータを挿入するINSERT、更新するUPDATE、削除するDELETE、検索するSELECT等があります。

下記はテーブルから条件に合うレコードを検索する例です。

SELECT * FROM meibo WHERE name = 'Yamada';

データ制御言語

データベース全体に関わる処理を制御するための文です。

ユーザーに特定の作業権限を与えるGRANT、権限を剥奪するREVOKE、トランザクションを開始するBEGIN、トランザクションを確定するCOMMIT等があります。

下記はTABLE1というテーブルに対しINSERTとSELECTを実行する権限をUSER1に与える例です。

GRANT INSERT, SELECT ON table1 TO user1;

まとめ

データベースエンジニア

SQLについて、データベースの定義や用語を含めた解説および具体的な使用例の説明を行いました。

あいまいだった部分の理解が少しでも明確になれば幸いです。

さらに理解を深めたい方は、下記の講座も参考にしてみてください。

プログラミング初心者のみならず、データベースを活用したマーケティング等を見据えたビジネスマンの方にもご好評をいただいている講座なので、大変おすすめです!

SQL入門|データベースを操作する言語SQLを短期間で身につけビジネスの現場で活用しよう

動画で学ぶプログラミング入門

オンラインスクールProglus(プログラス)でプログラミングを学んで、創れる人になろう!

在宅学習応援!今なら複数の基礎コースが無料!!

今すぐ詳細を確認する

Filed Under: プログラミング入門 Tagged With: SQL

px, em, rem, vw, vh, % の違いとは? font-sizeの指定の仕方について解説!

2020-11-05 By プログラミング入門ナビ編集部

この記事では、CSSでfont-sizeプロパティを用いてフォントサイズを指定する方法について説明します。

この記事は、オンライン講座「ウェブ開発入門完全攻略コース – プログラミング をはじめて学び創れる人へ!未経験から現場で使える開発スキルを習得!」のサポート記事です

font-sizeプロパティとは

CSSでは、font-sizeプロパティを用いることでフォントのサイズを調整することが出来ます。

以下はaタグに対して50pxの文字サイズを指定する例です。

a {
  font-size: 50px;
}

フォントサイズ指定の単位

font-sizeでは、様々な単位を用いてフォントサイズを指定することができます。

pxを用いる方法

ピクセル数で指定する方法です。ピクセルとはコンピューター上で画像を扱う際の最小単位を指します。

ブラウザの表示領域の大きさも縦×横のピクセル数で表されるので、フォントサイズをピクセル値で指定することで、環境によらず同じ大きさでフォントを表示することが可能です。

pタグで表示する文字サイズを20ピクセルに指定したい場合は、20pxと指定します。

p {
   font-size: 20px;
} 

%を用いる方法

親要素の大きさの相対的な割合で指定する方法です。

例えば以下の場合は、divタグの子セレクタであるpタグには、20pxの50%で、10pxがフォントサイズとして適用されることになります。

div {
  font-size:20px;
} 
div > p {
  font-size:50%;
}

emを用いる方法

親要素のフォントサイズを基準に指定する方法です。%と似ていますが、emの場合は親要素のフォントサイズを基準として、その割合で指定します。すなわち100%が1emになり、50%が0.5emに相当します。

例えば以下の場合は、pタグには、divタグのフォントサイズの半分である10pxが適用されます。

div {
  font-size:20px;
}
div > p {
  font-size:0.5em;
}

%やemについては、親要素のフォントサイズを基準としているため、親要素のフォントサイズが変われば子要素のフォントサイズも合わせて変化する、という点に注意してください。

remを用いる方法

root要素、すなわちブラウザにデフォルトで設定されているフォントサイズを基準に指定する方法です。

ブラウザのデフォルトのフォントサイズは16pxであることが多いです。emと同様、root要素のフォントサイズを1として、0.5remなどと割合で指定します。

すなわち以下の場合では、ブラウザのデフォルトのフォントサイズが16pxの時、pタグの文字は8pxの大きさで表示されることになります。

p { 
   font-size: 0.5rem;
} 

vw, vhを用いる方法

ビューポートの大きさを100として指定する方法です。

ビューポートとは「表示領域」のことで、パソコンやタブレット、スマートフォンなどディスプレイの大きさの異なる端末で開いた場合でも、統一的にフォントの大きさを決めることが出来ます。

ですので、vwやvhはレスポンシブ対応に適したフォントサイズの単位であると言えます。

以下の場合では、pタグに対して10vwの大きさを指定しています。

p {
   font-size: 10vw;
}

よって以下のように5つの文字を横に並べた場合、幅は合計で50vwとなり、表示領域の半分の大きさを閉めることになります。

まとめ

この記事ではフォントサイズの5種類の単位の指定の仕方について解説しました。

フォントサイズを指定する際は、どのようなレイアウトを実現したいかに応じて、適切に単位を使い分けてみてください。

動画で学ぶプログラミング入門

オンラインスクールProglus(プログラス)でプログラミングを学んで、創れる人になろう!

在宅学習応援!今なら複数の基礎コースが無料!!

今すぐ詳細を確認する

Filed Under: プログラミング入門

JavaScriptのundefinedとnullの違いを徹底解説!0や空文字列についても確認しよう

2020-11-05 By プログラミング入門ナビ編集部

はじめに

困っている男性

JavaScriptのコンソールで「undefined」や「null」といった単語を目にしたことはありませんか?

どちらも変数を参照した時のエラー発生時等に出てくるワードですが、この2つの違いは何なのだろう?0(ゼロ)や空文字列(””)とはどう違うの?

といった疑問を初心者の時は特に抱えやすいです。

この記事では、そんなモヤモヤを解決します!

undefinedは「存在しないデータ」

まずundefinedはどんな時に登場するのでしょうか。下記の例を見てください。

var value = 1;
console.log(value); //1

このように、変数valueを宣言し、その時に値を代入すればログに出力するために参照されても問題なくその値を表示することができます。しかしこの時、値を代入しないとどうなるでしょうか?

var value;
console.log(value); //undefined

上記のように、valueという変数を宣言したけれどもまだ値を何も入れていない場合、この変数の中身を表示しようとしても何も表示できず「undefined」となります。

JavaScriptでは変数の中身に応じたサイズの「入れ物」(メモリのこと)を確保しますが、上記のように、宣言されただけでまだ何の値も入っていない場合はどんなサイズの入れ物を用意すればいいのかわからないため、実はまだ入れ物すら用意されていない状態です。つまりデータとしてまだ存在していません。

また、下記の例も見てください。

var list = {id: 1, name: "apple"};
console.log(list.price);    //undefined

listという連想配列に、id、nameというキーがありますね。nameにappleという要素が入っているので、商品管理用か何かのデータと想像してください。

ここに、価格を表すキーがあっても良さそうなので、次の行で「list.price」というふうにpriceというキーを呼び出しています。

しかしそのようなキーは存在せず、ここでもundefinedが返ってきます。

このように、存在していないデータ・または宣言されただけでまだ値の代入がされていないデータを参照しようとした時に返されるのがundefinedです。

nullは「値なし」

undefinedと混同されやすいものに「null」があります。

nullとは「意図的にオブジェクトの値が存在しないことを表す値」です。下記の例を見てください。

var zip1 = "112-0004";
var zip2 = "112004";
var pattern = /^\d{3}-\d{4}$/g;
console.log(zip1.match(pattern));   //[ '112-0004' ]
console.log(zip2.match(pattern));   //null

上記ではmatchメソッドを用いてパターンとのマッチングを行い、与えられた文字列が郵便番号として成り立つかどうかを確認しています。

matchメソッドは特定のパターンとマッチする文字列があればその文字列を返しますが、もしない場合は何を返すでしょうか?

空の文字列?そうではありません。

あまり無いケースですがもし入力文字列も検索文字列も空文字列「””」であった時、空文字列が見つかりそのまま空文字列が返されることになりますが、ここで「見つからなければ空文字列を返す」というルールだと矛盾が生じてしまうからです。

似たようなことは他のメソッドでもあり得ます。

そこで、「該当はありませんよ」ということを明示的に表すための値が必要です。

これがnullですね。

実際に上記のコードでzip1とzip2という文字列を郵便番号パターンに該当するかどうかmatchメソッドで確かめています。

zip1には該当文字列があったためその文字列が返されていますが、zip2はパターンとマッチする文字列がなかっためnullが返ってきていますね。

注意したいのが、このzip1.match(pattern)もzip2.match(pattern)もそれぞれmatchメソッドの返り値として存在するデータであり、前者には文字列が、後者にはnullが入っているということです。

このように、データとして存在はしているが「値なし」であることを明示的に示すための値がnullです。

0や空文字列””は「値あり」

同じようにundefinedやnullと混同されがちなのが0(ゼロ)や空文字列(””)です。

立派な値としての0・空文字列

ゼロや空文字列は立派な値です。

nullも値ですが、先述の通り「値なし」を表す特殊な値でした。undefinedはそもそもデータとして存在しないことを表します。

例として山田さん・鈴木さん・佐藤さんからなるクラスでテストを実施したとしましょう。

山田さんの点数は70点、鈴木さんは0点、佐藤さんは遅刻したためテストを受けられませんでした。

ここで、田中さんの点数は何点でしょう?鈴木さんは?佐藤さんは?

答えは順に「undefined、0、null」となります。田中さんはこのクラスに存在していないですし、佐藤さんは存在していますがテストを受けられなかったので点数はつけられません。

鈴木さん(と山田さん)だけがテストの点数という値を持っていて、0点ではありますがこれもれっきとした点数であり、ここが田中さん(undefined)や佐藤さん(null)との違いです。

混同されやすい理由

なぜこれらは混同されやすいのでしょうか。それはよく条件分岐などで書かれる下記の記述が原因かもしれません。

if(!data) { //処理; }

このdataには例えば新規メールの件数が入っていて、もし新しいメールが来ていたら読み上げる処理をするといったことができます。

もしくはdataには何かのアンケートの備考欄に書かれた内容が入っていて、もし何か入力されていたらアラートを出すといったこともできますね。

いずれもdataがゼロだったり空文字列だったりするとその処理をする必要がないため上記のコードのように「!dataが正ならばこの処理をする」(!dataで「dataの否定」という意味になります)と書かれるのが一般的です。

同様に、dataがそもそも存在しないデータ(undefined)だったり、nullが入っていてもこの書き方ではじいて処理をさせないようにできます。

実際に、真偽判定(trueかfalseか判定すること)では下記の通り全て偽(false)となります。

console.log(0 == true);             //false
console.log("" == true);            //false
console.log(null == true);          //false
console.log(undefined == true);     //false

そのため、この4つ(undefined・null・0・””)は同じなのでは?と混同されやすいようです。

しかし、先述の通りれっきとした違いがありますので混同しないように注意しましょう。

まとめ

講師が生徒に教える様子

undefined・null・ゼロ(と空文字列)の違いを解説しました。

初心者の時にはなかなか掴みにくい概念ですが、少しでも理解の助けになれば幸いです。

今すぐにわからなくても書きながら次第に理解が進んでいきますので、頑張りましょう!

動画で学ぶプログラミング入門

オンラインスクールProglus(プログラス)でプログラミングを学んで、創れる人になろう!

在宅学習応援!今なら複数の基礎コースが無料!!

今すぐ詳細を確認する

Filed Under: プログラミング入門 Tagged With: JavaScript, null, undefined

  • « Go to Previous Page
  • Go to page 1
  • Go to page 2
  • Go to page 3
  • Go to page 4
  • Go to page 5
  • Interim pages omitted …
  • Go to page 27
  • Go to Next Page »

Primary Sidebar

Proglus

Twitter

Follow @programmingnavi Tweets by programmingnavi

人気の記事

  • Visual Studio CodeでHTMLを書くときの便利な設定方法!ミスの防止や開発効率UPに役立てよう
  • 無料のSSL証明書Let’s Encryptを設定・更新・自動更新する方法(CentOS7, Apache2.4対応)
  • MySQLをXAMPPを使ってWindows環境にインストールする方法
  • MySQL WorkbenchをMacにインストールする方法
  • AWS Cloud9のプレビューが上手く表示されない時の対処法
  • 初心者のプログラミング学習には13インチのMacBook Proがおすすめ!その理由も解説!
  • よくあるSQLのエラーの種類と自力でエラーを取り除く方法について説明します
  • macOSで2つのファイルの差分を確認するには?便利なdiffツールを紹介
  • MySQL 5.7 for Windowsのアンインストール方法
  • VirtualBoxでNATとホストオンリーアダプターによる安全なネットワーク環境構築方法

最近の投稿

  • 【03/02更新】Udemyプログラミング入門講座等の割引クーポン配布
  • swpファイルが作成されてvimでファイルが編集できない時の対処法とは?
  • 【無料モニター(2期生)募集!】「就職活動用のポートフォリオ制作講座」
  • フレームワークとは?開発効率UPに役立つ理由を知っておこう!
  • WordPressとは?どんなことができるの?初心者にもわかりやすく解説!

カテゴリー

  • エンジニアのしごと
  • エンジニアへの道
  • ツールの使い方
  • ニュース
  • プログラミング入門

タグクラウド

AI AWS AWS Cloud9 Bootstrap Cloud9 CodeWing CSS Git GitHub Heroku HTML JavaScript li Linux macOS MySQL MySQL Workbench Nuxt.js ol Proglus Python Ruby Ruby on Rails SQL Udemy vscode Vue.js Web開発 Windows インストール エラー エンジニア オンライン学習 サーバー スクリーンショット セール プログラミング プログラミング入門 プログラミング学習 ユーデミー 初心者 改行 未経験 機械学習 開発環境構築

アーカイブ

  • 2021年3月
  • 2021年2月
  • 2021年1月
  • 2020年12月
  • 2020年11月
  • 2020年10月
  • 2020年9月
  • 2020年8月
  • 2020年7月
  • 2020年5月
  • 2020年4月
  • 2020年3月
  • 2020年2月
  • 2020年1月
  • 2019年11月
  • 2019年9月
  • 2019年7月
  • 2019年6月
  • 2019年5月
  • 2019年4月
  • 2019年3月
  • 2019年2月
  • 2019年1月
  • 2018年12月
  • 2018年11月
  • 2018年10月
  • 2018年9月
  • 2018年8月
  • 2018年7月
  • 2018年6月
  • 2018年5月
  • 2018年4月
  • 2018年3月

検索

Copyright © 2021 · programmingnavi.com ・About・プライバシーポリシー