Skip to content

matsuba-gs/sass-practice

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Sass Practice Repository

このリポジトリは、Sassの学習と練習用に設置した基本的なプロジェクトです。Sassファイルを作成し、CSSにコンパイルしてスタイリングを確認できます。

プロジェクト構成

my-sass-project/
├── app/
│   └── sass/
│       └── style.scss          # Sassのメインファイル
├── public/
│   └── stylesheets/
│       └── style.css           # コンパイルされたCSSファイル(自動生成)
├── index.html                  # 確認用のHTMLファイル
└── .gitignore                  # Gitで無視するファイルを定義

セットアップ

1. リポジトリをクローン

git clone [email protected]:matsuba-gs/sass-practice.git
cd sass-practice

2. Sassのインストール

以下のいずれかの方法でSassをインストールしてください。

npmを使用してインストール

npm install -g sass

Windows (Chocolatey) を使用してインストール

choco install sass

Mac OS X または Linux (Homebrew) を使用してインストール

brew install sass/sass/sass

使用方法

Sassのウォッチ

以下のコマンドを実行すると、app/sass ディレクトリ内のSassファイルが変更されるたびに自動で public/stylesheets にコンパイルされます。

sass --watch app/sass:public/stylesheets

プロジェクトの確認

HTMLファイル index.html をブラウザで開くと、スタイルが適用されたページを確認できます。

または、Pythonの簡易サーバーを利用する方法もあります。

python -m http.server

コマンドを実行すると、デフォルトで http://localhost:8000 でローカルサーバーが立ち上がります。 ブラウザで http://localhost:8000 にアクセスすると、プロジェクトの内容が確認できます。

注意事項

  • public/stylesheets/style.css はコンパイルで生成されるため、Gitリポジトリに含めないよう .gitignore に追加しています。

ライセンス

このプロジェクトはMITライセンスのもとで提供されています。

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published