-
【CSS/JavaScript】ローディング画面を作成する方法
本記事では、CSS(SCSS)とJavaScriptを組み合わせてローディング画面を作成する方法について解説しています。 【コンテンツ画面を作成する】 まず始めに、ページの読み込みが終わったタイミングで表示させたいコンテンツを作成します。既に自前で用意してい... -
【CSSのみ！】ページ内をゆっくりスクロールする方法
本記事では、JavaScriptを使わずにHTMLとCSSのみでリンクをクリックするとページ内をゆっくりスクロールする(スムーススクロール)の作り方について解説しています。 【サンプルコード】 以降の解説では、下記のサンプルコードを使用します。このサンプルコ... -
SCSSの関数(@function)の使い方・使いどころ
本記事では、SCSSの関数(@function)の使い方について解説しています。実際に関数をしようしたサンプルコードも用意しているので、使いどころについても理解できると思います。 【関数(@function)の使い方】 SCSSで関数を使用したい場合は、@function/@retu... -
【SCSS】for文・while文・each文の使い方/使いどころ
本記事では、SCSSでfor文・while文・each文の使い方について解説しています。実際にサンプルコードを用意しているので、どのような場面で使用するのかが少しは理解できると思います。 【for文の使い方】 for文の基本的な使い方は以下のとおりです。 @for $... -
【SCSS】if文(else if,else)の使い方・使いどころ
本記事では、SCSSでif文(else if,else)の使い方・使いどころについて解説しています。 【if文の使いどころ】 JavaScriptなどのプログラミング言語では非常に使われるif文が、なんと！SCSSでも使用することが出来ます！どんなことが出来るんだろう！とワク... -
【SCSS】@mixin/@includeの使い方と使いどころ
本記事では、SCSSの@mixin/@includeの使い方と使いどころについて解説しています。 【@mixin/@includeの使いどころ】 @mixin/@includeは、同じプロパティを使用するHTMLタグ(要素)が複数存在する時に使います。 例えば、使用するプロパティが同じボタンを4... -
【SCSS】変数の使い方・使いどころ
本記事では、SCSSで変数を使う方法・どのような場面で変数を使うべきかについて解説しています。 【変数の使い方】 SCSSで変数を使う書き方は以下の通りです。 // 変数の宣言 $variable：value; 構文解説 $variable：値を代入する変数名を指定(何の値が代... -
【Linux】ファイルを新規作成するコマンド
本記事では、Linuxでファイルを新規作成する際に使用するコマンドを解説しています。初学者の方も理解できるよう、基本的な使い方～実際に使用した一連の流れを掲載しています。 【touchコマンド】 Linuxでファイルを新規作成したい場合は、touchコマンド... -
【Node.js】.envファイルの使い方・書き方
本記事では、Node.jsで使用される.envファイルの使い方・書き方について解説しています。 .envファイルは、第三者に見られたくない情報(値)を別ファイルとして切り出す際によく使用されます。例えば、Node.jsとMongoDBを接続する際にパスワードを含むURLを... -
Volta error: Could not create shared environment for package ‘x’の対処法
本記事では、Voltaでインストールしたnpmを利用してパッケージをグローバルインストールした時に返されるエラー「Volta error: Could not create shared environment for package 'x'」の対処法について解説しています。 【対処法】 Voltaのインストールペ...
