Tạo dự án mới

Bài này sẽ hướng dẫn các bạn cách khởi tạo thủ công dự án OcopJS.

Chuẩn bị về cơ sở dữ liệu

Trước khi khởi chạy dự án OcopJS bạn cần phải có cơ sở dữ liệu trước. Bài này yêu cầu cài MongoDB, và nvm để sử dụng NodeJS.

Bạn có thể sử dụng docker để chạy MongoDB nhanh bằng compose dưới đây:

version: "3.9"
name: ocopjs

services:
  mongo:
    image: mongo:5.0.26
    container_name: ocopjs-mongo
    volumes:
      - type: bind
        source: ./volumes/mongo
        target: /data/db
    networks:
      - backend
    ports:
      - 27017:27017

networks:
  backend:

Khởi tạo

Đầu tiên cần phải tạo thư mục trước:

mkdir new-project
cd new-project
nvm use 20
npm init

Bắt đầu với các cài đặt cơ bản nhất. Chúng ta có hai gói ở đây: @ocopjs/ocop, là thành phần chính của OcopJS. Và @ocopjs/adapter-mongoose, gói giúp kết nối với cơ sở dữ liệu MongoDB.

npm i @ocopjs/ocop @ocopjs/adapter-mongoose

Bước đầu tiên

Sau một số cài đặt trên, ta có thể bắt đầu viết mã. Đầu tiên tạo tệp chính cho OcopJS src/index.js. Viết như sau:

const { Ocop } = require("@ocopjs/ocop");
const { MongooseAdapter } = require("@ocopjs/adapter-mongoose");

const ocop = new Ocop({
  adapter: new MongooseAdapter({ mongoUri: "mongodb://localhost/ocop" }),
});

Lưu ý đảm bảo mongoUri đang đúng với MongoDB hiện tại của bạn.

Tiếp tục export đối tượng ocop để chạy được OcopJS.

module.exports = {
  ocop,
};

Xong bước này chúng ta có thể chạy dự án OcopJS với kết nối MongoDB. Vẫn còn các cấu hình cho nhiều tính năng khác.

Cài đặt cho GraphQL API

Như các bước trên, bước này cũng cần cài một số gói:

npm i @ocopjs/app-graphql

Khai báo gói này trong index.js

const { GraphQLApp } = require("@ocopjs/app-graphql");

Xuất bản ra để chạy cùng dự án OcopJS đã thiết lập ở trên.

module.exports = {
  ocop,
  apps: [new GraphQLApp()],
};

Thêm một bảng

Để chạy được OcopJS tối thiểu cần một bảng dữ liệu. Bảng dữ liệu này sẽ có một giao diện quản trị tương ứng tạo ra bởi gói @ocopjs/app-admin-ui. Sẽ được đề cập chi tiết sau khi tạo bảng.

Bảng dữ liệu và sự kết hợp của các trường-dữ-liệu. Nên để tạo ra bảng dữ liệu đầu tiên phải cài gói trường-dữ-liệu:

npm i @ocopjs/fields @ocopjs/fields-mongoid

@ocopjs/fields-mongoid dùng để chạy khoá chính cho MongoDB.

Trong ví dụ này, hãy dùng thử trường-dữ-liệu kiểu Chữ. Khai báo trong index.js như sau:

const { Text } = require("@ocopjs/fields");
const { MongoId } = require("@ocopjs/fields-mongoid");

Tạo bảng-dữ-liệu đầu tiên trong index.js bằng cách thêm ngay sau khi dựng đối tượng ocop các cài đặt sau:

ocop.createList("Todo", {
  fields: {
    id: { type: MongoId },
    name: { type: Text },
  },
});

In our example, the Todo list has a single field called name of type Text.

Đoạn mã cài đặt trên sẽ tạo ra bảng-dữ-liệu với tên Todo. Tham số thứ hai trong hàm gọi là tham-số-cấu-hình. Hiện tại đang cấu hình chỉ một trường-dữ-liệu. Đây là Khung để OcopJS đọc và tạo Mô hình.

Trường dữ liệu trong ví dụ trên có khoá là name, kiểu Chữ.

Cuối cùng, khởi chạy

Khởi tạo package.json nếu chưa có bằng lệnh npm init. Thêm vào trong:

{
  "scripts": {
    "start:dev": "ocop dev"
  }
}

Hãy chắc là cơ sở dữ liệu của bạn đang chạy, rồi chạy dự án OcopJS bằng lệnh sau:

npm run start:dev

Bạn sẽ thấy các dòng tương tự như sau xuất hiện ở terminal:

ℹ Command: ocop dev
✔ Tệp đầu vào hợp lệ ./index.js
✔ Đã khởi tạo.
✔ Đã khởi tạo middlewares.
✔ Đã kết nối đến cơ sở dữ liệu.
✔ Đã sẵn sàng tại 3000

🔗 GraphQL Playground:	http://localhost:3000/admin/graphiql
🔗 GraphQL API:		http://localhost:3000/admin/api

Bây giờ hãy mở trình duyệt lên và truy cập thử xem mọi thứ có đang hoạt động như mong đợi không nhé.

Tóm lại

Chúng mừng bạn, cuối cùng thì cũng đã cài thành công dự án OcopJS đầu tiên bao gồm GraphQL API, GraphQL Playground. Từng nãy đã giúp bạn có thể xây dựng giao diện và kết nối chúng với GraphQL API rồi. Trong các hướng dẫn tiếp theo, chúng tôi sẽ giúp bạn biết cụ thể hơn về cách sử dụng API. Và chạy giao diện quản trị trên trình duyệt để biên tập nội dung một cách dễ dàng.

Xem mã nguồn mẫu