Wix Blocks provides various code file types for efficient app development. Public files handle client-side logic, while backend files manage server-side operations and database interactions. Web modules offer reusable backend code snippets. Additionally, a configuration file stores app-wide settings. Beyond core code files, widget, panel, and dashboard code are essential for building the user interface and app management features.
To add code files, first do the following:
To add public files:
You can add these types of backend files to your app:
To add backend files:
Testing your backend function You can test your backend functions in your app without building or installing the app. Learn how.
Every exported function at the root of a public/backend directory will be exposed when installing your app on a site. Note that exported functions that aren't in the root package will not be exposed.
Give your exported functions unique names Since we can’t expose 2 functions under the same name within an app, please avoid defining multiple exported functions under the same name in the root of a backend/public directory.
You can add a config.json file to define settings that affect how your app works on a specific site. These settings typically vary from site to site, so the file you provide contains default settings that users can edit for each site.
When a user installs your app on their site, they can modify the values in configuration file through the Packages & Apps tab in the editor, for example:
The data in the config.json file can only be imported by backend files.
Examples of information you might put in a config.json file include:
To add a config.json
file:
Document your config.json We recommend that your README.md file contains instructions for modifying the config.json file.
config.json
settingsThe values in config.json
can only be accessed by the backend code in your app.
Import the config.json
file, using getPackageConfig:
1
Use the values from the file in your backend code:
1
config.json
examplesIn Tutorial: Creating a Package for API Calls, you create a config.json file that contains a default stock symbol to use in a stock quote API call. You can edit that value on any of your sites on which you've installed the API Call package.
The config.json file:
1
The tutorial's backend apiCall.jsw file imports that value and uses it in the code as the value for the stock symbol variable, sym.
1
You can add npm dependencies to your app.
To add an npm package:
Add a README.md Markdown file to document your app. Your README should include the following sections: