htmlとJavascriptを分割するときの注意点

htmlとJavascriptを分割のときの注意点

こんにちは、今回も少量ですが投稿しようと思う。
FlaskでWEBアプリケーションを作っている。ただ、使いやすさ追求のためにJavascriptを使っていて、ファイル分割のところでつまずいたので投稿する。
＊かなり初心者向けになっています

問題

下記の様にflaskアプリの基本構造を参考にしていた（私の上記のとりあえず作った基本構造は真似しないように）。
また、外部ファイルの方がセキュリティやみやすさを兼ね備えているために、外部ファイルの構造にしようと思い、htmlとjavascriptを分離させた。
【JavaScript入門】外部JSファイルを読み込んでみよう

ファイル構造は以下に示す

main.py
│
　appフォルダ
　│
　├ templatesフォルダ
　　　├ index.html
　　　 ∟ form.html
　├ staticフォルダ
　　　├index.css
　　　├form.css
　　　 ∟form.js
　├init.py
　├form.py
　 ∟views.py

しかし、Javascriptが動かない。反応しない。だから次のようにした。

解決策

main.py
│
　appフォルダ
　│
　├ templatesフォルダ
　　　├ index.html
　　　 ∟ form.html
　├ staticフォルダ
      ∟css
　　　  　├index.css
　　　  　∟form.css
　　　 ∟js
         ∟form.js
　├init.py
　├form.py
　 ∟views.py

こうしてtemplatesフォルダを /css と /js のフォルダに分割し、そこにファイルを入れるとうまくいけた。
templatesのフォルダにcssファイルや、Javascriptファイルをごちゃまぜにするのは良くないらしい。
躓いたら試してみてね。