コンテンツにスキップ

ファイルシステムの基礎

開発では「ファイルをどこに置き，どのように参照するか」が常に問われます。
ここではファイルシステムの考え方と，ターミナルを使った基本操作を確認しましょう。

ファイルシステムを理解する理由

  • プロジェクトのコードや設定はフォルダ構造で整理されます。
  • ターミナルでコマンドを実行する際は，現在いるフォルダ（カレントディレクトリ）が重要です。
  • Git などのツールはファイルの場所を前提に動作します。

フォルダ構成を把握できれば，後でプロジェクトを開いたときに迷子にならず，チームでのやり取りもスムーズになります。

ファイルとフォルダの見方

Windows では エクスプローラー，macOS では Finder で階層構造をたどります。
フォルダは入れ物，ファイルは中身です。さらにフォルダの中にフォルダが入ることもあります。

Tip

プロジェクトを保存する場所は，Documents や Projects など自分で管理しやすい場所に統一すると混乱しません。

パス（ファイルの住所）の考え方

種類 例 説明
絶対パス C:\Users\student\projects\fes-site
/Users/student/projects/fes-site		 コンピュータ全体から見た場所。どこからでも同じ。
相対パス ../images/logo.png 今いるフォルダから見た相対的な位置。
  • . は「現在のフォルダ」
  • .. は「1 つ上のフォルダ」

ハンズオン：練習フォルダを作る

  1. 任意の場所に fes-training フォルダを作成します。
  2. 中に notes と sandbox という 2 つのフォルダを作ります。
  3. notes フォルダに filesystem.md という空のテキストファイルを作成し，「ファイルシステムの練習中」と書き込んで保存しましょう。

このフォルダは今後の学習でも使う予定です。場所を覚えておきましょう。

ターミナル（コマンドライン）を開く

OS 開き方
Windows Win キーを押して「Terminal」や「PowerShell」と入力し起動
macOS Spotlight (⌘ + Space) で「Terminal」と検索

ターミナルが開いたら，まずは現在地を確認しましょう。

Get-Location

pwd

pwd

pwd は print working directory の略で，「今いるフォルダはどこ？」という意味です。

よく使うコマンド

やりたいこと Windows (PowerShell) Windows (Git Bash) / macOS
現在地を確認 Get-Location pwd
中身を一覧表示 Get-ChildItem または ls ls
フォルダを移動 Set-Location フォルダ名 または cd フォルダ名 cd フォルダ名
1 つ上へ移動 cd .. cd ..
フォルダを作る New-Item -ItemType Directory フォルダ名 mkdir フォルダ名

例：練習フォルダへ移動

先ほど作成した fes-training フォルダへ移動してみましょう。

Set-Location ~\Documents\fes-training

cd ~/Documents/fes-training

~ はホームディレクトリ（ユーザーの個人領域）を表します。

練習：ターミナルでファイルを確認する

  1. fes-training フォルダへ移動します。
  2. ls（または Get-ChildItem）で中身を表示し，notes と sandbox が見えるか確認します。
  3. cd notes で notes フォルダへ。
  4. ls で filesystem.md を確認します。

うまくいかない場合は，スペルミスやフォルダ名の大文字・小文字を再確認してみましょう。

よくあるトラブル

「そのようなファイルやディレクトリはありません」と表示される

入力したパスが間違っている可能性が高いです。スペースを含む場合は引用符（"Program Files"）で囲みましょう。

慣れないコマンドが怖い…

ここで登場するコマンドはファイルの確認と移動のみで，危険な操作は行いません。慣れるためにも何度か繰り返し実行してみてください。

次のステップ

ファイルシステムの基本が理解できたら，環境構築 へ進みましょう。VSCode や Node.js を整えると，次に学ぶ Git の操作がぐっと楽になります。