Node.js, MongoDB, Sassでサクッと！ Sails.js アプリケーション開発のススメ
2024-07-27
Node.js、MongoDB、Sass を用いた Sails.js スケルトン作成ガイド
前提知識
- コマンドライン ツールの基本的な知識
- Sass の基本的な知識
- MongoDB の基本的な知識
- Node.js の基本的な知識
手順
-
プロジェクトのセットアップ
- 新しいディレクトリを作成し、そのディレクトリをプロジェクトのルートディレクトリにします。
- コマンドを実行して、Sails.js プロジェクトを初期化します。
npm init sails my-sails-app
- プロジェクトディレクトリに移動します。
cd my-sails-app
module.exports = {
// ...
datastores: {
default: {
adapter: 'sails-mongo',
url: 'mongodb://localhost:27017/my-sails-app'
}
}
// ...
};
{
"scripts": {
"develop": "sails lift",
"watch": "node-sass assets/styles/*.scss assets/styles.css -o assets/styles.css",
"start": "npm run watch && sails lift"
}
}
module.exports = {
tableName: 'users',
attributes: {
name: {
type: 'string',
required: true
},
email: {
type: 'email',
unique: true,
required: true
},
password: {
type: 'string',
required: true
}
}
};
5. コントローラーの作成
api/controllersディレクトリにコントローラーファイルを作成します。- コントローラーアクションを定義します。
module.exports = {
create: function (req, res) {
User.create({
name: req.param('name'),
email: req.param('email'),
password: req.param('password')
})
.then(function (user) {
res.json(user);
})
.catch(function (err) {
res.status(500).json(err);
});
}
};
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>My Sails App</title>
<link rel="stylesheet" href="/styles.css">
</head>
<body>
<h1>ユーザー登録</h1>
<form action="/user" method="post">
<label for="name">名前:</label>
<input type="text" id="name" name="name" required>
<label for="email">メールアドレス:</label>
<input type="email" id="email" name="email" required>
<label for="password">パスワード:</label>
<input type="password" id="password" name="password" required>
<button type="submit">登録</button>
</form>
</body>
</html>
npm run start
npm test
package.json
{
"name": "my-sails-app",
"version": "1.0.0",
"description": "My Sails.js app",
"main": "app.js",
"scripts": {
"develop": "sails lift",
"watch": "node-sass assets/styles/*.scss assets/styles.css -o assets/styles.css",
"start": "npm run watch && sails lift",
"test": "mocha test/api/**/*.spec.js"
},
"dependencies": {
"sails": "^1.5.0",
"sails-mongo": "^0.16.0",
"node-sass": "^4.14.1"
},
"devDependencies": {
"chai": "^4.3.4",
"mocha": "^8.2.2"
}
}
config/local.js
module.exports = {
// ...
datastores: {
default: {
adapter: 'sails-mongo',
url: 'mongodb://localhost:27017/my-sails-app'
}
}
// ...
};
assets/styles/main.scss
body {
font-family: sans-serif;
}
api/models/User.js
module.exports = {
tableName: 'users',
attributes: {
name: {
type: 'string',
required: true
},
email: {
type: 'email',
unique: true,
required: true
},
password: {
type: 'string',
required: true
}
}
};
api/controllers/UserController.js
module.exports = {
create: function (req, res) {
User.create({
name: req.param('name'),
email: req.param('email'),
password: req.param('password')
})
.then(function (user) {
res.json(user);
})
.catch(function (err) {
res.status(500).json(err);
});
}
};
views/user/create.ejs
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ユーザー登録</title>
<link rel="stylesheet" href="/styles.css">
</head>
<body>
<h1>ユーザー登録</h1>
<form action="/user" method="post">
<label for="name">名前:</label>
<input type="text" id="name" name="name" required>
<label for="email">メールアドレス:</label>
<input type="email" id="email" name="email" required>
<label for="password">パスワード:</label>
<input type="password" id="password" name="password" required>
<button type="submit">登録</button>
</form>
</body>
</html>
test/api/UserController.spec.js
const { expect } = require('chai');
const request = require('supertest')('http://localhost:1337');
describe('UserController', function () {
describe('create action', function () {
it('should create a new user', function (done) {
request
.post('/user')
.send({
name: 'John Doe',
email: '[email protected]',
password: 'password123'
})
.expect(200)
.end(function (err, res) {
if (err) return done(err);
expect(res.body).to.have.property('id');
expect(res.body).to.have.property('name');
expect(res.body).to.have
- ゼロから始める
すべての設定を自分で行うこともできます。これは、より多くの制御と柔軟性を提供しますが、より多くの時間と労力が必要です。
- テスト
Mocha と Chai 以外にも、Jest や Cucumber などのテストフレームワークを使用することもできます。 - 認証と認可
アプリケーションに認証と認可が必要な場合は、Passport.js などのライブラリを使用できます。 - フロントエンドフレームワーク
Sassに加えて、React、Vue.js、またはAngular などのフロントエンドフレームワークを使用することもできます。
最適な方法は、プロジェクトの要件と好みによって異なります。 上記のオプションを検討し、ニーズに合ったオプションを選択してください。
以下に、追加のリソースをいくつか紹介します。
node.js mongodb sass
