キャラ講義

知っててあたり前!!会話で使われる技術用語パート1

みゆき
みゆき
ねぇ、つよぽん。

仕事でよく聞く言葉質問したいんだけど。

つよぽん
つよぽん
ん、なんだい?
みゆき
みゆき
たくさんあるんだけど、

ディレクトリ、パス、フロントエンド、バックエンド

ここらへんを教えてほしいです!^^

まこと
まこと

あ、俺も知りたい!なんとなくわかるような気がするけど再確認しておきたい!

つよぽん
つよぽん
OK^^

それじゃあ1つずつ説明していこうか^^

ディレクトリとは

つよぽん
つよぽん
まことなら多分ディレクトリが何かわかると思うよね?
まこと
まこと

ディレクトリフォルダと同じだよね^^

俺の中の認識だとWindowsだとフォルダ、Macとかだとディレクトリって言い方わけてるなー

つよぽん
つよぽん
うん、そうだね(^^)

厳密にはWindowだからフォルダ、Macだからディレクトリってわけではなく、それぞれ違うものなんだけど、

会話上ではほとんど同じ意味で使われるから フォルダ=Mac って思ってもらって大丈夫だよ^^

みゆき
みゆき
なるほどね~

フォルダって言葉はよく使うけど、ディレクトリって言葉はエンジニアの人が使うのを聞くくらいだったからディレクトリってなんだ?

って思ってたけど、これから私もディレクトリって言おうっと^^

パスとは

つよぽん
つよぽん
次はパスの説明にいこうか^^
まこと
まこと

パスってどこにどんなファイルがあるかスラッシュ(/) 区切りで書かれた文字列だっけ?

つよぽん
つよぽん
そうだね^^

また別の機会でHTMLについて説明するけど、次のHTMLをみてごらん^^

みゆき
みゆき
わわっ!

コードなんて見せられてもわからないよー(汗)

相対パス

つよぽん
つよぽん
今回はコードはあまり深く考えないで大丈夫だよ^^

見て欲しいところは相対パス

・pages/hello.html
・./pages/hello.html

と、絶対パス

・https://tsuyopon.xyz/pages/hello.html

の部分!

みゆき
みゆき
相対パス?絶対パス?

なんのこっちゃ!?

まこと
まこと

相対パスと絶対パスって聞いたことあるけどまだちゃんと理解できてないところだ^^;

つよぽん
つよぽん
じゃあ、まずは相対パスの説明からするね^^

・pages/hello.html
・./pages/hello.html

上の2つは先頭に「./」(ドットスラッシュ)がついている・ついていないの違いがあるけど意味は全く同じだよ^^

みゆき
みゆき
「./」はどんな意味なの?

つよぽん
つよぽん

1文字ずつ意味があって、「.」(ドット)と「/」(スラッシュ)の意味は次の通り^^

それぞれの意味
  • . (ドット)・・・現在いる位置
  • / (スラッシュ)・・・ディレクトリの中
まこと
まこと

現在いる位置ってどういうこと?

つよぽん
つよぽん

例えば「https://tsuyopon.xyz/index.html」のページを今見ているとして、

この index.html ファイルはどこかのディレクトリの中に入っているよね?

みゆき
みゆき
出たディレクトリ!

そうね。画像ファイルとかテキストファイルとか、

どんなファイルもどこかのフォルダ…じゃなくてディレクトリの中に入っているわね。

つよぽん
つよぽん

いいね、さっそくディレクトリって言葉使ったね^^

話を戻して、

例えばこの index.html ファイルが 「html」ディレクトリの中に入っていたら

・html/index.html

といった書き方をするんだ^^

まこと
まこと

となると、この index.html は html ディレクトリの中だから、

index.html 内の 「.」(ドット)は

「html」ディレクトリになるのかな?

つよぽん
つよぽん

そうそう!

今回の場合だと

「.」 = 「htmlディレクトリ」

になるよ(^^)

みゆき
みゆき

なるほどね~

ということは、

「./」はhtmlディレクトリの中って意味になって、

「./pages/hello.html」は

「htmlディレクトリの中」の「pagesディレクトリの中」の「hello.html」

ってことになるのかしら?

つよぽん
つよぽん

正解です!

そして、この「./」は省略して書くことも出来るから、

・pages/hello.html
・./pages/hello.html

は、同じ意味になるんだ^^

みゆき
みゆき

はぁー、なるほどなー

つよぽん
つよぽん
現在いる位置から相対的な場所に置かれているパス(PATH=道)だから
相対パスってい言うんだ^^
まこと
まこと

パスって「道」って意味の方のパスだったのか!

ってことは、絶対パスは絶対的な場所にあるから絶対パスってことになるのかな?

絶対パス

つよぽん
つよぽん

お!カンが鋭いね〜

じゃあ、絶対的な場所っていうのはどんな意味か説明できるかな?^^

まこと
まこと

ん〜

相対パスが現在いる場所を基準にするってことだから、

絶対パスは現在いる場所を基準にしないってことなのかなーって思うけど

よくわからん!

みゆき
みゆき

同上!!

つよぽん
つよぽん

ははw

現在いる場所を基準にしないってのあってるよ^^

絶対パスではルートからみた求めているファイルまでのパスのことだよ^^

みゆき
みゆき

ルート??

またわからん言葉が出てきた (汗)

つよぽん
つよぽん
ゴメンゴメン^^;
ルートっていうのは基準とするディレクトリのことを言って、
ルートディレクトリとも言うよ^^
みゆき
みゆき

基準とするディレクトリ??

つよぽん
つよぽん
例えばさっき例に出した https://tsuyopon.xyz/index.htmlは、
html/index.html (「htmlディレクトリの中」の「index.html」)
って説明したのは覚えてるかな?
みゆき
みゆき

うん。

つよぽん
つよぽん
それで注目してほしいのは
http://tsuyopon.xyz/index.html の中に
html ディレクトリについて書かれてないよね^^
みゆき
みゆき

あっ、確かに!

まこと
まこと

本当だ!

じゃあhtmlディレクトリはどこ行ったんだ!?

つよぽん
つよぽん
「https://tsuyopon.xyz/」 = 「htmlディレクトリ」
って考えれば
「https://tsuyopon.xyz/index.html」 = 「html/index.html」
になるよね^^
みゆき
みゆき

おお!

まこと
まこと

なんかわかってきた気がする!

となると、さっき言ってた基準とするディレクトリ

html ディレクトリになるってことで合ってる?

つよぽん
つよぽん
うん!合ってるよ!
なので、ここでは
ルートディレクトリ = htmlディレクトリ
になるよ^^
ここでさっきのコードを思い出してほしい
つよぽん
つよぽん
ルートは「/」一文字で表現するよ。
そして「/」の左側に何も無いことに注意してほしい。
・ルート = https://tsuyopon.xyz
・ルート = /
になるから、上のURLを絶対パスで表現すると
/pages/hello.html 
になるよ^^
みゆき
みゆき

/pages/hello.html は

現在いる位置からのパスではなく、

基準とするディレクトリ=ルートディレクトリ

からのパスだから絶対パス になるのね^^

つよぽん
つよぽん

そのとおり!

まこと
まこと
相対パスと絶対パスってそういうことだったのかー
なんとなくで理解してたけど、はっきりわかった!
つよぽん
つよぽん
パスについて思ってたよりもたくさん説明したから、
フロントエンドバックエンド についてはまた次回説明するね^^
みゆき
みゆき

はーい^^

ディレクトリ、相対パス、絶対パス。

忘れないうちにメモしとかなきゃ!

まこと
まこと

今度からURL見るときは相対パスなのか絶対パスなのか意識して見ようっと^^

まとめ
  • ディレクトリ: フォルダのこと
  • パス: ファイルまでの道(=PATH)
    • 相対パス: 現在いるディレクトリからのパス
    • 絶対パス: 基準とするディレクトリからのパス
【やる気満々な方向け】学習サポートとオンライン講義やってます!

Webエンジニアになりたい人向けに、MENTAにて『【やる気満々な方向け】未経験からのWebエンジニア育成コース』というプランを用意しております。

誰向けのプラン?

こちらのプランは次のような方に向けて作られています。

プラン対象者
  1. Progateやドットインストールで一通り学習したけど、次に何をすればよいかわからない
  2. Webエンジニアになるまでの学習プランがあると助かる
  3. 学習していてわからないところが出てきたときに質問したい
  4. コードレビューして欲しい
  5. オンライン講義に参加したい
  6. 学習した内容をアウトプットした際に、フィードバックがもらえたら嬉しい
  7. おすすめの学習教材を知りたい
  8. Webフロントエンド・バックエンドを学習したい
  9. フルスタックエンジニアになりたい
  10. 文系出身で今までプログラミングをしてこなかったけど、将来Webエンジニアになりたい
  11. 将来フリーランスになることを目指している

プラン内容は?

【やる気満々な方向け】未経験からのWebエンジニア育成コース』では次のことを行っております。

プラン内容
  1. Udemyの教材や、Web白熱教室の学習コンテンツを使った学習プランの提示 (学習プランに沿って学習を進めていただきます。)
  2. 教材・学習コンテンツの課題をこなしたあとは、僕にコードレビュー依頼を投げていただくことで、コードを添削する(課題クリア後は、引き続き学習プランの内容を続けていただきます。)
  3. プラン契約者が参加するSlackグループにて質問し放題
  4. Slack内にある「アウトプットの場」チャンネルにて、学習したことをアウトプットをしていただくことで、それに対しフィードバックをする (学習内容のアウトプットは復習にもなるため、アウトプットすることを強く推奨します。)
  5. 画面共有を使ったオンライン講義 (オンライン講義は録画して、いつでもふり返れるようにしています。(オンライン講義動画(ウェビナー動画)))
  6. 学習プラン以外の内容に対しての質疑応答 (内容によっては回答できないものもありますが、まずは気軽に質問していただけたらと思います。)

その他注意点

1人で対応していることもあるため、対応が難しくなった場合は急遽募集を終了する可能性もあることをご了承ください。

もしくは、僕以外にメンターを増やすことで募集を継続するということも考えているため、その場合は現在のプラン料金の値段を上げることなると思います。

仮にプラン料金を上げる場合は、『現在のプラン料金 × メンター人数』の料金になるかと思います。

現在の値段が5000円なので、1日1本ペットボトルジュースを買うのを我慢することで(約160円)、効率よく学習できるので費用対効果はかなり高いかなと自負しています。

また、今後メンターが増えて、プラン料金が10000円15000円と上がったとしても、月々の料金は申し込んだときの料金となるので、5000円のときに契約した場合はずっと5000円で受講することができます。

詳しく話を聞いてみたい方は

以下のいずれかでメッセージをいただけたらと思います^^

 

プラン内容については以下のリンク先からも確認することが出来ます^^

【やる気満々な方向け】未経験からのWebエンジニア育成コース

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です