![見出し画像](https://assets.st-note.com/production/uploads/images/29970636/rectangle_large_type_2_407b21e032e526bf5245a80ccda9ffea.jpeg?width=1200)
Vue.js + express + mongoDB , ejs テンプレートの使用
■ 概要:
vue.js + mongoDB + expressで、ejs テンプレート
を使用した例となります。
■ 環境
mongodb-4.0.10
express 4.16.1
node.js
npm
ejs
■ 参考
https://qiita.com/nkjm/items/723990c518acfee6e473
■ インストールなど
express app2
cd app2
npm install
npm start
・ejsの追加, npm
npm install ejs --save
・express-ejs-layoutsで、分割テンプレートに対応
(共通ヘッダ等)
npm install express-ejs-layouts --save
・ app.js
express-ejs-layoutsの設定
https://github.com/kuc-arc-f/vue_express_app2/blob/master/app.js
var app = express();
const expressLayouts = require('express-ejs-layouts');
app.use(expressLayouts);
■ ルーティング
routes/tasks.js
https://github.com/kuc-arc-f/vue_express_app2/blob/master/routes/tasks.js
/routes/api.js
https://github.com/kuc-arc-f/vue_express_app2/blob/master/routes/api.js
■ 画面 ejs
index
https://github.com/kuc-arc-f/vue_express_app2/blob/master/views/tasks/index.ejs
new
https://github.com/kuc-arc-f/vue_express_app2/blob/master/views/tasks/new.ejs
■ 参考のページ
ここから先は
Vue.js + node/express 開発の事例、ノウハウに関する記事を集めました。 ■ 免責事項 / 注記 , 内容について動…
この記事が気に入ったらサポートをしてみませんか?