質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

EJS

EJSは、JavaScript用のテンプレートエンジン。HTMLなどのテンプレートテキストにJavaScriptのロジックを記述することができます。また、変数・関数の実行をテンプレートテキスト内に埋め込むことも可能です。

SCSS

SCSSは、SassのCSSメタ言語です。Webページのスタイルを指定するCSSを効率的に記述することができます。ネストと呼ばれる入れ子構造で記述するため、CSSの全体の記述量を減らせる点が特徴です。さらに変数も利用できるため、変更や修正の際に少ない作業量で対応することもできます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

1回答

398閲覧

npm scriptsでのページ移管について

sakura-h

総合スコア13

npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

EJS

EJSは、JavaScript用のテンプレートエンジン。HTMLなどのテンプレートテキストにJavaScriptのロジックを記述することができます。また、変数・関数の実行をテンプレートテキスト内に埋め込むことも可能です。

SCSS

SCSSは、SassのCSSメタ言語です。Webページのスタイルを指定するCSSを効率的に記述することができます。ネストと呼ばれる入れ子構造で記述するため、CSSの全体の記述量を減らせる点が特徴です。さらに変数も利用できるため、変更や修正の際に少ない作業量で対応することもできます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2021/06/21 01:46

編集2021/06/21 23:51

最近npm scriptsを取り入れましたが自力で解決できずご教授お願いできますでしょうか。

実現したいこと
_header.ejs内にあるnavリストの中のリンクを押すとそれぞれページへ移管したいです
例 ABOUTのリンクを押すとindex.ejs内のaboutのページへ移管する

rink内にどのように記述すれば飛べるのか知りたいです。

ファイル構成とそれぞれ記述はこのようになっています
お手数ですが、よろしくお願いいたします。

html

1<nav class="l-header__nav"> 2 <ul class="l-header__nav__inner"> 3 <li class="l-header__nav_cmn"><a class="j-header_link" href="#">TOP</a></li> 4 <li class="l-header__nav_cmn"><a class="j-header_link" href="#">ABOUT</a></li> 5 <li class="l-header__nav_cmn"><a class="j-header_link" href="#">SERVISE</a></li> 6 <li class="l-header__nav_cmn"><a class="j-header_link" href="#">WORKS</a></li> 7 <li class="l-header__nav_cmn"><a class="j-header_link" href="#">NEWS</a></li> 8 <li class="l-header__nav_cmn"><a class="j-header_link" href="#">CONTACT</a></li> 9 </ul> 10</nav>

html

1 <!-- about --> 2 <section class="l-about__wrapper" > 3 <div class="l-inner"> 4 <div class="p-about__outer"> 5 <div class="p-abaut__box"> 6 <h2 class="c-title">ABOUT</h2> 7 <p class="p-about__text">心が動けば、その瞬間から未来が変わる。<br> 8 私たちはただの映像なんか作らない。<br> 9 <span>作るのは心を動かす映像、</span><span>「未来」を変える映像だ。</span></p> 10 <p class="c-btn"><a href="#">MORE…</a></p> 11 </div> 12 <div class="p-about__image"> 13 <img src="./assets/img/about_img.jpg" alt="撮影"> 14 </div> 15 </div> 16 </div> 17 </section><!-- /bout -->

イメージ説明

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

ハンバーガーメニューが閉じていなかった事でリンク先に跳べていないと勘違いをしておりました、失礼しましたm(_ _)m

投稿2021/06/23 03:47

sakura-h

総合スコア13

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問