A smart webide design method for online development of internet of things

Abstract

The application discloses a kind of intelligent WebIDE design methods for online development of Internet of Things, provides a kind of WebIDE for Internet of Things teaching scene, provides file tree and code editor, provides extension function, realizes the integration of function and the saving operation of code;Provide language service function, based on language server protocol, realize the support to various programming languages;Provide code interpretation function, based on large language model, realize the intelligent interpretation and analysis of code.The application can provide more powerful, more intelligent and more convenient services for Internet of Things teaching, improve teaching effect and reduce learning threshold.

Description

Technical Field

[0001] This invention proposes a smart WebIDE design method for online development of the Internet of Things (IoT). This method relies on a lightweight code editor and file management system to effectively support IoT teaching environments. This invention implements an intelligent and lightweight WebIDE, specifically customized for IoT remote teaching platforms, providing a flexible and intelligent programming environment. Background Technology

[0002] WebIDE, an integrated development environment based on web technology, provides a cross-platform, cross-device development environment, bringing developers great flexibility and convenience. It eliminates dependence on specific software or plugins; developers can access it through a browser on any device. This openness and flexibility have led to the widespread adoption and recognition of WebIDE in the developer community. Despite its advantages in many aspects, traditional WebIDEs have failed to fully meet the needs of IoT education. IoT teaching involves interoperability programming between various hardware devices, requiring the development and optimization of programs for different IoT hardware devices. This places high demands on students' programming skills and practical experience, increasing the complexity of learning and thus hindering the promotion and popularization of IoT education.

[0003] Existing WebIDEs include built-in code editors, debuggers, version control, terminals, and other development tools, supporting features such as syntax highlighting, code completion, and code formatting, which help improve development efficiency and code quality. However, running a separate container for each user on the server side places a significant burden on server resources. Furthermore, the widespread application of artificial intelligence in various fields in recent years has presented new challenges and opportunities for the design and use of programming environments. In the programming field, large language models have also demonstrated their powerful potential, providing developers with more efficient programming assistance.

[0004] Currently, there is no WebIDE specifically designed for IoT teaching scenarios, which cannot meet the specific needs of IoT teaching, such as code writing, error detection and repair, and IoT device programming. Its disadvantages are: firstly, significant resource consumption, especially when the server needs to run a separate container for each user; and secondly, a low degree of matching between its functionality and the needs of IoT teaching. Summary of the Invention

[0005] To overcome the aforementioned shortcomings of existing technologies, this invention proposes an intelligent WebIDE design method for online development of the Internet of Things. This method relies on a lightweight code editor and file management system, and integrates large language model technology.

[0006] This invention optimizes the performance and user experience of WebIDEs through two main strategies: First, it employs a lightweight code editor as the core component, providing features such as syntax highlighting and code auto-completion. By integrating and implementing version control, the lightweight code editor's flexibility and scalability are enhanced. Compared to traditional WebIDEs, the lightweight code editor has lower resource consumption, eliminating the need to create a separate container for each user and significantly reducing server resource consumption. Second, it integrates large language model technology, providing code explanation, code completion, and code style checks for selected code blocks.

[0007] This invention provides a smart WebIDE design method for online development of the Internet of Things (IoT), offering a WebIDE for IoT teaching scenarios. It provides a file tree and code editor, extended functions to integrate features and save code; language service functionality based on a language server protocol to support various programming languages; and code interpretation functionality based on a large language model to achieve intelligent code interpretation and analysis.

[0008] This mainly includes WebIDE, language services, and code interpretation implementation methods;

[0009] in,

[0010] 1) WebIDE consists of a file tree and a code editor, with files stored in the cloud.

[0011] 1.1) The file tree displays the project files in a tree-like component. Left-clicking a file in the file tree displays the code in the code editor; right-clicking the file tree displays a set of operations for the project files.

[0012] 1.2) Files in WebIDE are stored in the cloud by default and are integrated with version control tools; at the same time, WebIDE supports custom extension functions and integrates language services and code interpretation functions through service interfaces;

[0013] 2) Language services

[0014] The language service is based on the language service protocol and provides grammar checking and code completion functions; by creating an intermediate layer, it handles user interactions and forwards the corresponding requests to the language service, and then feeds the results back to the editor for the user to view;

[0015] 2.1) Language Service Agreement

[0016] This protocol defines a standard message format and interaction method, enabling different editors and development tools to communicate with various language services;

[0017] 2.2) Implementation of the intermediate layer mechanism:

[0018] The middleware layer is located between the editor and the language service, and its implementation is as follows:

[0019] Step 1: The middleware layer sends the request to the language service.

[0020] Step 2: The language service processes the request from Step 1 and forwards the result to the middleware layer.

[0021] Step 3: The intermediate layer displays the results from Step 2 in the code editor.

[0022] 3) Code Explanation and Implementation

[0023] The code explanation function is based on a large language model, and resource consumption is reasonably controlled by building a points system.

[0024] In the code explanation of the implementation method,

[0025] 1) Interpretation and Analysis of Large Language Models

[0026] Based on the large language model service, the code is interpreted, analyzed, and suggestions are provided. WebIDE offers a code selection function, sending the selected code to the large language model server, and finally displaying the processing results in the code explanation area;

[0027] 2) Cache module design

[0028] The caching module provides caching functionality for code interpretation requests, consisting of a two-layer caching mechanism: a code text similarity mechanism and a code structure similarity mechanism. The code text similarity mechanism caches identical requests in one storage unit based on text similarity search; the code structure similarity mechanism identifies identical requests based on abstract syntax tree matching and stores them.

[0029] This invention is particularly suitable for IoT programming teaching scenarios. Based on Monaco Editor and the MinIO file system, it constructs a lightweight front-end IDE project. Real-time error detection and code completion are achieved through the Language Service Protocol (LSP). Furthermore, integrated Git operations ensure version control and synchronization of the code. In terms of intelligence, this invention utilizes the ChatGPT model for intelligent question answering and code generation, coupled with a caching mechanism to reduce resource consumption. Finally, a points system is introduced, deducting points based on the number of tokens consumed in asking and answering questions in ChatGPT to achieve rational resource allocation. Overall, this invention demonstrates great potential in improving teaching efficiency and optimizing user experience, providing more powerful, intelligent, and convenient services for IoT teaching, improving teaching effectiveness, lowering the learning threshold, and thus promoting the popularization and development of IoT technology.

[0030] Compared to existing WebIDEs, this invention offers the following advantages: It leverages a lightweight code editor and file management system to create a more lightweight WebIDE, reducing server load. Furthermore, by integrating a large language model, it builds a more intelligent WebIDE, providing users with intelligent and customized services. Attached Figure Description

[0031] Figure 1 This is the system architecture diagram of the IoT-based remote teaching experiment platform.

[0032] Figure 2 This is a diagram showing the functional modules of WebIDE.

[0033] Figure 3 This is a diagram illustrating the communication between WebIDE and the language service. Detailed Implementation

[0034] The technical solution of the present invention will be further described below with reference to the accompanying drawings.

[0035] This invention provides a smart WebIDE design method for online development of the Internet of Things, including (1) building a WebIDE architecture; (2) building a language service module; (3) building a version control module; and (4) building a large language service module.

[0036] like Figure 1 The IoT teaching remote experimental platform system is designed based on a three-tier architecture: a software server, a WebIDE, and a device control center. The software server is responsible for the main teaching activities in the IoT field, such as course offerings and experiment creation; the WebIDE provides rich programming functions; and the device control center manages the IoT hardware devices, responsible for program compilation and development board flashing services. Users can use a lightweight web-based code editor to write code, achieving intelligent code completion, error checking, and real-time preview. After the code is written, the user sends a flashing request to the code flashing server. The server checks for available development boards; if found, it returns a success message to the WebIDE. During this process, the user has exclusive access to the device until the experiment ends.

[0037] Next, we will explain in detail how to utilize this three-tier architecture to implement specific IDE design methods. For example... Figure 2 This is the functional module of the entire WebIDE, comprising a total of six modules. These modules are interconnected and work together, using a lightweight code editor and file management system as core components to build a lightweight IDE. Simultaneously, it integrates a large language model, making the IDE more intelligent. The following is a detailed implementation:

[0038] (1) Building the WebIDE architecture. WebIDE consists of a file tree and a code editor, with files stored in the cloud. A lightweight code editor interface is used to implement features such as code highlighting and auto-completion. Simultaneously, combining scalability and extensibility, a file directory tree is constructed as the storage location for user code. The file tree displays project files in a tree-like component format. Left-clicking a file in the file tree displays the code in the code editor, while right-clicking the file tree displays a set of operations for the project file. Files in WebIDE are stored in the cloud by default and integrate version control tools. WebIDE also supports custom extensions, integrating language services and code interpretation functions through service interfaces. This combination successfully builds a lightweight IDE.

[0039] (2) Constructing the language service module. The language service is based on the language service protocol and provides grammar checking and code completion functions. By creating an intermediate layer, it processes user interactions and forwards the corresponding requests to the language service, and then feeds the results back to the editor for the user to view.

[0040] 1) Implement the language service agreement

[0041] This protocol defines a standard message format and interaction method, enabling different editors and development tools to communicate with various language services. For example... Figure 3 This diagram illustrates the communication mechanism between WebIDE and the language service. By adhering to the language service protocol and utilizing an open-source, lightweight code editor to communicate with the backend language server, real-time error detection and code completion services for user code are achieved.

[0042] 2) Implementing the intermediate layer mechanism

[0043] The middleware layer is located between the editor and the language service, and its implementation is as follows:

[0044] Step 1: The middleware layer sends the request to the language service.

[0045] Step 2: The language service processes the request from Step 1 and forwards the result to the middleware layer.

[0046] Step 3: The intermediate layer displays the results from Step 2 in the code editor.

[0047] (3) Version control module construction. JGit was used to implement Java-based version control operations, enabling version control of the code. Code comparison functionality was implemented through the API of a lightweight code editor. In the graphical user interface, users can bind to a remote repository to pull or push code, ensuring synchronization with the remote repository code. The points system deducts points based on the total number of tokens consumed in asking and answering questions using the large language model.

[0048] (4) Construct a large language service module. The code interpretation function is based on a large language model, and resource consumption is reasonably controlled by constructing a point system.

[0049] 1) Build a caching mechanism

[0050] The caching module provides caching functionality for code interpretation requests, consisting of a two-layer caching mechanism: a code text similarity mechanism and a code structure similarity mechanism. The code text similarity mechanism caches identical requests in one storage unit based on text similarity lookup, while the code structure similarity mechanism identifies and stores identical requests based on abstract syntax tree matching.

[0051] 2) Integrated large language model

[0052] To integrate a large language model, this invention employs strategies such as node configuration, caching design, and intelligent IDE implementation. In node configuration, the system automatically selects a proxy node for access based on network speed. In caching design, code caching improves access efficiency and reduces resource consumption. In the intelligent IDE implementation, the large language model enables functions such as code explanation, code completion, and code style checks.

[0053] The embodiments described in this specification are merely examples of implementations of the inventive concept. The scope of protection of this invention should not be considered as limited to the specific forms stated in the embodiments. The scope of protection of this invention also extends to equivalent technical means that can be conceived by those skilled in the art based on the inventive concept.

Claims

1. A design method for an intelligent WebIDE for online development of the Internet of Things, characterized in that, This paper presents a WebIDE for IoT teaching scenarios, which provides a file tree and code editor, offers extended functions to integrate functions and save code; provides language service functions based on language server protocols to support various programming languages; and provides code interpretation functions based on a large language model to achieve intelligent interpretation and analysis of code. This includes WebIDE, language services, and code interpretation implementation methods; in, 1) WebIDE consists of a file tree and a code editor, with files stored in the cloud; 1.1) The file tree displays the project files in a tree-like component. Left-clicking a file in the file tree displays the code in the code editor; right-clicking the file tree displays a set of operations for the project files. 1.2) Files in WebIDE are stored in the cloud by default and have integrated version control tools; at the same time, WebIDE supports custom extension functions and integrates language services and code interpretation functions through service interfaces; 2) Language services The language service is based on the language service protocol and provides grammar checking and code completion functions; by creating an intermediate layer, it handles user interactions and forwards the corresponding requests to the language service, and then feeds the results back to the editor for the user to view; 2.1) Language Service Agreement This protocol defines a standard message format and interaction method, enabling different editors and development tools to communicate with various language services; 2.2) Implementation of the intermediate layer mechanism: The middleware layer is located between the editor and the language service, and its implementation is as follows: Step 1: The middleware layer sends the request to the language service; Step 2: The language service processes the request from Step 1 and forwards the result to the middleware layer; Step 3: The intermediate layer displays the results from Step 2 in the code editor; 3) Code Explanation and Implementation The code explanation function is based on a large language model, and resource consumption is reasonably controlled by building a points system. In the code explanation of the implementation method: 3.1 Interpretation and Analysis of the Large Language Model Based on the large language model service, the code is interpreted, analyzed and suggestions are made. WebIDE provides a code selection function, which sends the selected code to the large language model server, and finally displays the processing results in the code explanation area. 3.2 Cache Module Design The caching module provides caching functionality for code interpretation requests, consisting of two caching mechanisms: a code text similarity mechanism and a code structure similarity mechanism. The code text similarity mechanism caches identical requests in one storage unit based on text similarity lookup. The code structure similarity mechanism determines identical requests and stores them based on abstract syntax tree matching.

Images