way to explore https:https://cdn.v2ex.com/navatar/8fe0/093b/416_normal.png?m=1335305316 https:https://cdn.v2ex.com/navatar/8fe0/093b/416_large.png?m=1335305316 2022-11-28T07:02:06Z Copyright © 2010-2018, V2EX tag:www.v2ex.com,2022-11-28:/t/898515 2022-11-28T07:02:06Z 2022-11-28T07:02:06Z zhennann member/zhennann 上学时喜欢帮同桌找错，一个英文句子如果能找到 5 处错误，心里就美滋滋的。如今轮到自己写技术文档，面对满篇的中式英语却有心无力。好心的网友，如果开发累了，就摸个鱼🐟，帮我找找错吧，也找回学生时代的感觉

• 原文链接：How to Study CabloyJS

============ 正文分隔线 ============

How to Study CabloyJS?

Document Audiences

Software development is like building houses and bridges, which can be the towering palaces in the north, the elegant courtyards in the south, and even the precipitous and isolated bridges beyond mountains. Then, different languages and frameworks attract a group of fans by their inherent qualities. They work tirelessly to create different ecosystems and present different development styles and experiences. Just as Rails to Ruby, Lavaral to PHP, Django to Python, and Spring Boot to Java. So, what will be to Javascript? There is no doubt that Javascript faces more usage scenarios, such as front-end, back-end, mobile, IOT, etc. Different scenarios have excellent solutions. Moreover, based on different usage habits, the Javascript ecosystem is split into two style systems, which are Javascript and Typescript. So, based on business development, in terms of the current node ecology, we can say that Nest to Typescript, and Cabloy to Javascript

Because different languages and frameworks will have different solutions and styles. Therefore, whether you use CabloyJS or not, it is necessary to come in and see what kind of flowers can grow on the soil of sticking to the pure Javascript (Vanilla JS). Therefore, whether you are a fan of front-end development, back-end development, full stack development, or other languages, or a technical manager, product manager, or project manager, you can learn different ideas and methods for solving problems from the documents and videos provided by CabloyJS, communicate with each other, learn from each other, and make progress together!

What is CabloyJS

CabloyJS is a NodeJS full-stack framework with workflow engine, a low-code development platform for developers, is also a PAAS platform with both out-of-the-box and flexible-customization. Only one set of codes is needed to realize the admin management system at backend and the applications at frontend at the same time. Only one set of codes is needed to adapt to PC and mobile at the same time, and the mobile is close to the native experience

Framework styles and design principles of CabloyJS

1. Framework styles: brief-but-not-simple

2. Design principles: out-of-the-box + flexible-customization

Many friends feedback that they are unfamiliar with the concepts of CabloyJS, so they don’t know where to start?

Different languages and architecture concepts determine the style of a framework. In order to create a truly easy-to-use full stack business framework, CabloyJS abstracts and refines the concepts behind the real business requirements, which not only achieves the effect of out-of-the-box, but also can be customized flexibly

Therefore, this also determines that the overall style of CabloyJS framework is: brief-but-not-simple. When you are familiar with this style, you will find that the really comfortable development experience should be like this

1. Take a case at backend

If you want to implement the CRUD features, the codes can be designed very simply, and you can even know how to use it without referencing the documents

We can recall that most of the other backend MVC frameworks or backend API frameworks provide the CRUD features, while often stop there steps here?

Then, let’s introduce some real business requirements:

1. Add a draft copy of the data. When we modify the draft, the original data that has been formally submitted will not be affected

2. Add some history copies of the data, so as to record the historical version of the data

3. Add a approval workflow. Business data will be approved after the draft is submitted, and will be transferred to the formal copy only after it is approved

4. Add cms static rendering mechanism: as CRUD are generally managed in the backend, we need to output the data statically for the frontend system to access, and realize the SEO optimization of the website

5. Add category and tag features to facilitate further classification of data

6. For these characteristics mentioned above:

   1. How to refine general concepts

   2. How to design the development interface (to achieve the effect of out-of-the-box and flexible-customization)

   3. How to configure flexibly (enable or disable some features conveniently). As the saying goes: it is easy to reduce dimensions, but difficult to increase dimensions. We need to have these features first, and then decide whether to enable them according to business requirements

   4. How to adapt more business scenarios (rather than only applicable to a certain type of business data), such as blog posts, community posts, leave forms, reimbursement forms, purchase orders, contracts, projects, assets, financial documents, etc.

7. It is doomed that the concept of business data is not simple, but CabloyJS has implemented a brief development interface, which can be used out-of-the-box and flexible-customization

See Also：Bilibili Video：新建业务表单+审批工作流 (Translation Wanted)

2. Take a case at frontend

1. Question: With the popularization and upgrading of mobile devices, a large number of business scenarios need mobile support. Then, how can the admin management system support the mobile devices more elegantly?

2. Traditional solution: At present, most of the admin management frameworks on the market are compatible with PC and Mobile by using CSS media query

   1. Disadvantages of the traditional solution: However, the UI interaction experiences of PC and Mobile are different, and the page layouts are different either. Therefore, only relying on CSS media query can only make PC pages available on the Mobile, but it is far from achieving the effect of the native Mobile

3. New solution: CabloyJS provides a unique adaptive layout of pc=mobile+pad, so that only one set of codes is needed to adapt to PC and mobile at the same time, and the mobile is close to the native interactive experience

   1. Advantages of the new solution: This solution also implements the design principle of out-of-the-box + flexible-customization, with the style of brief-but-not-simple. All you need to do is to understand this mechanism by referencing documents or watching videos. The codes required for actual frontend page development will be much less than CSS media query

See Also：Bilibili Video: 独树一帜的跨端方案：pc=mobile+pad 自适应布局 (Translation Wanted)

Basic Concepts

It is recommended that you read the following documents to have a preliminary understanding of the basic concepts of CabloyJS

• Quick Start

• Modularization And Create Module

• Module Compilation and Publish

Basic knowledges

CabloyJS is based on EggJS, VueJS and Framework7. These underlying framework documents do not have to be read first. CabloyJS provides enough samples and test codes to facilitate rapid development. It is recommended to run CabloyJS project first, and then gradually introduce relevant knowledge as needed

Of course, if you have the knowledges of EggJS and Framework7 in advance, it is easier to understand what innovations and transformations CabloyJS has made on the basis of these two

• Frontend
  • Vue2
  • Framework7
• Backend
  • EggJS

Learn through practice

CabloyJS has many built-in core modules, which encapsulates and implements most of the functions and features commonly used in specific businesses. Therefore, it is recommended that you first create a project, run it, and preview the functions and features provided by CabloyJS. In this way, when you develop your own system, you will know how to refer to the existing paradigm to get twice the result with half the effort

• See Also: Quick Start

Free Video Courses

CabloyJS offers some free video courses. This set of courses is taught by the author of CabloyJS, zhennann. Through on-site coding and actual combat, it takes you into the real scene of NodeJS full stack development, so that you can quickly improve development skills and quickly start the development of various business systems after learning

• See Also: A-001: CabloyJS 全栈框架：从入门到精通 (Translation Wanted)

• See Also: A-002: CabloyJS 全栈框架：功能特性演示 (Translation Wanted)

• See Also: B-001: 微信一起点菜项目进度复盘 (Translation Wanted)

Tutorials

On the basis of CabloyJS framework, it is very fast and convenient to redevelop specific business modules. From the following tutorials section, you can see what steps are needed to develop a business module

• See Also: Tutorials

EggBornJS

By reading the EggBornJS section, you can understand what features EggBornJS has extended on the basis of EggJS in order to achieve business modularity

• See Also: What is EggBornJS

CabloyJS

By reading the CabloyJS section, you can understand what core modules CabloyJS provides to improve the efficiency and convenience of business development

• See Also: What is CabloyJS

NodeJS Workflow Engine

NodeJS workflow engine is the core component of a business development platform. By reading this chapter, you can understand how CabloyJS’s own workflow engine supports the development of business systems in a simple, flexible and efficient way

• See Also: What is NodeJS Workflow Engine

Solutions

Based on CabloyJS, corresponding solutions are implemented for different business scenarios, including:

1. Cabloy-CMS

2. Cabloy-Community

3. Cabloy-Wechat (Translation Wanted)

4. Cabloy-Wechat Work (Translation Wanted)

5. Cabloy-Dingtalk (Translation Wanted)

6. Cabloy-Uniapp (Translation Wanted)

Test Modules/Suites

• test-party : is the test suite of CabloyJS, including a large number of test cases and Kitchen-sink

  • See Also: test-party

• test-flow: is the test module of NodeJS workflow engine, containing a large number of workflow related test cases

  • See Also: test-flow

• test-note: is used to demonstrate how to use the Markdown rich text editor

  • See Also: test-note

These test modules/suites not only facilitate the quick learning of knowledge points in all aspects of CabloyJS, but also provide a large number of code examples to facilitate the rapid start of actual project development. It is strongly recommended that you pay attention to and keep these test modules/suites updated, so as to always obtain the latest sample codes in time

• How to install test modules/suites, see also: Cabloy Store Cli

• How to disable test modules/suites, see also: Disable Module/Suite

• How to update test modules/suites, see also: Update Cabloy

Core Modules

By reading the source codes of the core modules provided by CabloyJS, you will find that the CabloyJS framework is flexible enough to allow you to deeply customize, replace, and extend the numerous functions and features provided by CabloyJS

• See Also: Core Modules

Contributions

Welcome to participate in and contribute to the improvement of the CabloyJS full stack framework, which is also an effective way to quickly and deeply learn CabloyJS