CRUD 操作 (作成、読み取り、更新、削除) は、データ管理を必要とするアプリケーションの基本です。これらの操作はデータベースと効果的に対話するために必要な基本機能を提供するため、開発者がこれらの操作を理解することは重要です。このブログ投稿では、CRUD オペレーションとは何か、また MERN スタック (MongoDB、Express、React、Node.js) を使用して CRUD オペレーションを実装する方法について、ヨガ ポーズ ライブラリ アプリに CRUD オペレーションを統合した方法を紹介しながら説明します。
CRUD は、
を表す頭字語です。これらの操作は、データ操作を伴うほとんどの Web アプリケーションのバックボーンを形成します。 CRUD 操作を実装すると、ユーザーはデータを効果的に操作および管理できるようになります。
CRUD 操作の実装を開始するために、ヨガのポーズを保存するための MongoDB データベースをセットアップしました。同じことを行う方法は次のとおりです:
MongoDB に接続するために、MongoDB と Node.js のオブジェクト データ モデリング (ODM) ライブラリである Mongoose を使用しました。ここでは、server.js ファイルで接続を確立する方法を示します:
const mongoose = require('mongoose'); mongoose.connect('mongodb://localhost:27017/yogaPoseLibrary') .then(() => console.log('Connected to MongoDB')) .catch(err => console.error('Error connecting to MongoDB', err));
次に、ヨガのポーズを表すマングース モデルを作成しました。このモデルにより、MongoDB コレクションと簡単に対話できます。 models/Pose.js ファイルで、スキーマを次のように定義しました:
const mongoose = require('mongoose'); const poseSchema = new mongoose.Schema({ name: { type: String, required: true }, description: { type: String, required: true }, }); module.exports = mongoose.model('Pose', poseSchema);
MongoDB 接続とモデルをセットアップしたら、Express サーバーに CRUD 操作を実装しました。
ユーザーが新しいヨガのポーズを追加できるようにするために、POST リクエストを受け入れるルートを作成しました。
app.post('/api/poses', async (req, res) => { try { const newPose = new Pose(req.body); const savedPose = await newPose.save(); res.status(201).json(savedPose); } catch (err) { res.status(500).json({ error: 'Failed to create pose' }); } });
このルートでは、リクエスト本文で送信されたデータを使用して新しいポーズが作成され、データベースに保存されます。
読み取り操作のために、すべてのポーズを取得するルートを作成しました:
app.get('/api/poses', async (req, res) => { try { const poses = await Pose.find(); res.json(poses); } catch (err) { res.status(500).json({ error: 'Failed to fetch poses' }); } });
このルートは、データベースからすべてのヨガのポーズを取得し、JSON 応答として送り返します。
ユーザーが既存のポーズを更新できるようにするために、PUT ルートを実装しました。
app.put('/api/poses/:id', async (req, res) => { try { const updatedPose = await Pose.findByIdAndUpdate(req.params.id, req.body, { new: true }); res.json(updatedPose); } catch (err) { res.status(500).json({ error: 'Failed to update pose' }); } });
このルートは、指定された ID に基づいて特定のポーズを更新し、更新されたポーズを返します。
最後に、削除操作を実装しました。
app.delete('/api/poses/:id', async (req, res) => { try { await Pose.findByIdAndRemove(req.params.id); res.json({ message: 'Pose deleted' }); } catch (err) { res.status(500).json({ error: 'Failed to delete pose' }); } });
このルートは、ID を使用してデータベースからポーズを削除します。
CRUD 操作を実装したら、Postman を使用して各エンドポイントをテストしました。このテストにより、ルートが正しく機能し、データが期待どおりに管理されていることを確認できました。
次の本文を使用して POST リクエストを /api/poses に送信します:
{
"name": "戦士 I",
"description": "脚と体幹を強化する立ちポーズ。"
}
GET リクエストを /api/poses に送信します。
更新されたデータを使用して PUT リクエストを /api/poses/:id に送信します。
DELETE リクエストを /api/poses/:id に送信します。
CRUD 操作は、データ管理を伴うあらゆるアプリケーションにとって不可欠です。 MERN スタックを使用してこれらの操作をヨガ ポーズ ライブラリ アプリに統合することで、ユーザーがヨガのポーズを効果的に操作できる堅牢なアプリケーションを作成しました。 CRUD 操作を理解して実装すると、開発スキルが大幅に向上し、動的な Web アプリケーションを作成できるようになります。アプリの改善を続けるにつれて、より多くの機能を探索し、ユーザー エクスペリエンスを向上させることを楽しみにしています。
以上がCRUD オペレーション: それは何ですか? どのように使用できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。