Документация на русском здесь
This application represents a FrontEnd client for managing company data such as employees, sales, products, and branches. The project is developed using HTML/CSS3, JavaScript, jQuery, and Bootstrap 4. Upon configuration completion, the project is compiled into a desktop cross-platform application using the Electron JS library. The client and server interact via HTTP protocol, with a REST API architectural style in JSON format.
- A pre-configured BackEnd application on the server (see instructions for installing and configuring the BackEnd part on the server), including the address (IP address or domain name) and port, which need to be inserted into the client configuration file.
- Installed NodeJS version 17.0 or higher.
- Stable internet connection (required for interaction between the FrontEnd application and the server and for downloading necessary client dependencies).
To start setting up the application, create a folder for the project and then clone the repository of this project with the following command:
git clone https://github.com/yunusmi/company_crud_app_front_end.git .
Then install the dependencies:
npm install
After installing the dependencies, edit the configuration file (config.js file in the root directory of the project). There you need to insert the server address (IP address or domain name) and port where the BackEnd part of the application is deployed (see instructions for installing and configuring the BackEnd part on the server).
For example:
const serverIp = 'http://YOUR_CONFIGURED_SERVER_ADDRESS:APP_PORT/api/v1';
Next, you can start the application with the following command:
npm run start
An application will open, which will send requests to the server, receive responses from it, and display them on the screen. To enable debugging mode for the application, uncomment lines 29 to 33 and line 39 in the main.js file. This will enable error outputs to the console and debugging in the application window (Ctrl + Shift + I command will open the console and debugging mode).
Press the exit button in the application or Ctrl + C in the terminal to close the application window.
To compile the project into a desktop application, the Electron JS library is used.
Before compilation, it is recommended to disable the application's debugging mode. To do this, comment lines 29 to 33 and line 39 in the main.js file. Also, by default, the Electron JS library sets a default icon for the application shortcut. To set your own icon for the application shortcut, move your icon file to the assets/ folder, then uncomment and edit the main.js file at line 14 (replacing the icon name with yours).
After completing all the settings above, start the process of compiling the FrontEnd application into a desktop cross-platform application with the following command:
npm run dist
Note: For the successful completion of the compilation process, it is recommended to execute this command with administrator privileges, as scripts and dependencies used during compilation require administrator rights to execute.
Subsequently, the process will initiate the download of additional dependencies for compilation and the creation of the installation file for the application. Upon completion of the compilation, an installation file Company data management Setup will appear in the dist/ folder. This file can be opened to initiate the application installation or shared online. For Windows operating systems, by default, the system will utilize NSIS (Nullsoft Scriptable Install System) for the application's installation file. The installation file is generated for the environment in which it is compiled. For example, if you compile the project on a Windows operating system, the installation file will be created only for Windows operating systems and will have the extension .exe. Similarly, if compiled on Linux, an installation file for the Linux operating system will be generated with the .AppImage extension, and so forth.
This project is distributed under the MIT license. You can use the full code of this project on your projects for free.
If you need any help or consultations, you can contact me by email: contact@yunus-mil.ru