|
1 | | -# WebDevToolkitForDx |
| 1 | +# Web Developer Toolkit for IBM Digital Experience |
2 | 2 |
|
3 | | -##OPENNTF## |
4 | | -This project is an OpenNTF project, and is available under the Apache License |
5 | | -V2.0. All other aspects of the project, including contributions, defect |
6 | | -reports, discussions, feature requests and reviews are subject to the |
7 | | -[OpenNTF Terms of Use](http://openntf.org/Internal/home.nsf/dx/Terms_of_Use). |
| 3 | +This toolkit includes two main areas of functionality: |
| 4 | +- A "Web Developer Dashboard" that provides a user interface for working with Script Portlets, Portal themes, and WCM design elements. The theme support uses the Digital Experience File Sync tool under the covers. The Script Portlet support uses the Script Portlet command line support which must be installed separately on your workstation. |
| 5 | +- A command line tool "wcmdesigns" for moving WCM design elements - Presentation Templates and Components - between your local file system and your Portal server. This functionality is also available from the Dashboard. |
| 6 | + |
| 7 | +# Requirements |
| 8 | +To use these tools you will need: |
| 9 | +- Node.js must be installed on your workstation. Version 0.12 is the recommended and tested version. |
| 10 | +- For the WCM support you need Portal 8.5 with CF05 or later. |
| 11 | +- DX Sync (used for theme support) you need Portal 8.5. |
| 12 | +- For Script Portlet "push" you will need to have the Script Portlet command line client installed, and your server must have Script Portlet installed. |
| 13 | + |
| 14 | +# Installation |
| 15 | +You must first install Node.js. Node.js version 0.12 is the tested and recommended version. |
| 16 | + |
| 17 | +Download the digexp-toolkit.zip file in the release folder and unzip it on your workstation. Then run install.cmd (Windows) or install.sh (Mac/Linux). This will install the two main programs, digexp_dashboard (for the dashboard UI) and wcmdesigns (the command line support for accessing WCM design libraries). That completes the installation. |
| 18 | + |
| 19 | +For the Script Portlet "Push" support, you will need to have the Script Portlet command line client support installed and configured, and you will need to have the "sp" command on your system path. See this documentation for more on installing the Script Portlet command line client: http://www-01.ibm.com/support/knowledgecenter/SSHRKX_8.5.0/script/script-portlet/cmd_line_push.dita |
| 20 | + |
| 21 | +# Using the Web Developer Dashboard |
| 22 | + |
| 23 | +This is a Node.js-based "dashboard" that runs on your laptop and lets you work with your Portal Themes, WCM design libraries, and Script Portlet applications in a simple user interface. |
| 24 | + |
| 25 | +Key features: |
| 26 | +- Select any theme or WCM design library and "pull" all the files into your local file system. |
| 27 | +- Click to push applications, theme designs, or WCM design components to a local or remote Portal server. |
| 28 | +- Enable and disable "watch" or "sync" functionality, so that any updates to local files are automatically pushed to the server. |
| 29 | +- Work with theme modules and profiles from a simple user interface. |
| 30 | +- Run script applications locally on a Node.js-based test server, with dummy rendering of WCM tags. |
| 31 | +- Use "splint" (Script Portlet Lint) to check for potential issues with script applications. |
| 32 | +- Invoke your own build scripts when pushing Script Portlets to the server, to compile LESS/Sass, combine/minify JS, etc. |
| 33 | + |
| 34 | +## Running the Web Developer Dashboard |
| 35 | +To launch the dashboard, run the following command: |
| 36 | +``` |
| 37 | +digexp_dashboard |
| 38 | +``` |
| 39 | + |
| 40 | +When you first run the dashboard, you should go to the "Settings" tab to configure your file locations and Portal server settings. |
| 41 | +- Script Portlet Folder: The parent folder for your Script Portlet applications. Each Script Portlet is in a child folder, with an index.html as the main file. For example, you can unzip the published Script Portlet samples which are structured this way. |
| 42 | +- Themes Folder: The parent folder for your Themes. Each child folder contains all the Webdav artifacts for one theme. To get any theme from the server, click the “Themes” button and select the desired theme. |
| 43 | +- WCM Design Folder: The parent folder for WCM design libraries. Each child folder represents one WCM library, with children for Components and Presentation Templates. To get any WCM library from the server, click the “Libraries” button. |
| 44 | +- Servers - Name, User, Password, Host, Port, Content Handler: Set these for your Portal server. You can have multiple server configurations and select the configuration to use. If you are using a Virtual Portal, include the Virtual Portal name as part of the "Content Handler" path, like this: /wps/mycontenthandler/my_vp_name. |
| 45 | + |
| 46 | +# Using the"wcmdesigns" command line utility |
| 47 | +Note that all the functionality for push/pull of WCM design files is available from the Dashboard user interface. For the command line support, use: |
| 48 | +``` |
| 49 | +$ wcmdesigns <command> [options] |
| 50 | +``` |
| 51 | + |
| 52 | +The commands are described below. |
| 53 | + |
| 54 | +## init |
| 55 | +Usage: |
| 56 | +``` |
| 57 | +$ wcmdesigns init [options] |
| 58 | +``` |
| 59 | +Running this command will display a prompt to select a WCM library. A subdirectory |
| 60 | +will be created (in the current working directory) and the selected library will be |
| 61 | +downloaded in it. |
| 62 | + |
| 63 | +The available options are: |
| 64 | +- `-d`, `--dir`: The directory that will contain the WCM library. By default, it will be |
| 65 | + the current working directory. |
| 66 | +- `-h`, `--help`: Displays the help for the init command. |
| 67 | + |
| 68 | +## push |
| 69 | +Usage: |
| 70 | +``` |
| 71 | +$ cd <path to the wcm library> |
| 72 | +$ wcmdesigns push [options] |
| 73 | +``` |
| 74 | +Running this command will push the source files to WCM and update the library on the server. |
| 75 | + |
| 76 | +The available options are: |
| 77 | +- `-a`, `--all`: Pushes all files if specified. If it's not specified, then only |
| 78 | + the files that have been modified since the last push/pull will be pushed. |
| 79 | +- `-d`, `--dir`: The local directory of the WCM library. By default, it will be |
| 80 | + the current working directory. |
| 81 | +- `-v`, `--verbose`: To get verbose output. |
| 82 | +- `-h`, `--help`: Displays the help for the push command. |
| 83 | + |
| 84 | +## pull |
| 85 | +Usage: |
| 86 | +``` |
| 87 | +$ cd <path to the wcm library> |
| 88 | +$ wcmdesigns pull [options] |
| 89 | +``` |
| 90 | +This command will download any remote changes to the WCM library. First run `wcm init` |
| 91 | +to initialize the WCM library before using `wcm pull`. |
| 92 | + |
| 93 | +The available options are: |
| 94 | +- `-d`, `--dir`: The local directory of the WCM library. By default, it will be |
| 95 | + the current working directory. |
| 96 | +- `-v`, `--verbose`: To get verbose output. |
| 97 | +- `-h`, `--help`: Displays the help for the pull command. |
| 98 | + |
| 99 | +# Notes on WCM design library support |
| 100 | +The supported WCM types are: |
| 101 | +- HTML Component |
| 102 | +- Image Component |
| 103 | +- Style Sheet Component |
| 104 | +- Text Component |
| 105 | +- Rich Text Component |
| 106 | +- Presentation Template |
| 107 | + |
| 108 | +Other Component types, Authoring Templates, and Content Items are not supported. |
| 109 | + |
| 110 | +There are some options that can be set to control some of the behavior when downloading from WCM. To do this, open the ".settings" file in the folder for a library and add an "options" object. There are some options that you can set as shown here: |
| 111 | +``` |
| 112 | +"options": { |
| 113 | + "includeMeta": false, |
| 114 | + "filterComponentId": true, |
| 115 | + "pullParallel": true, |
| 116 | + "include":[ |
| 117 | + "PresentationTemplate", |
| 118 | + "LibraryStyleSheetComponent", |
| 119 | + "LibraryImageComponent" |
| 120 | + ] |
| 121 | +}, |
| 122 | +``` |
| 123 | +- includeMeta: If set to true, each component will have a corresponding <name>-md.json file containing all the metadata from WCM. |
| 124 | +- filterComponentId: If set to true, any Component tags in the downloaded data will include the ID of the referenced Component. By default these IDs are are removed, and the "name" attribute is used to identify the referenced Component. |
| 125 | +- pullParallel: If set to true, requests to the server for components are done in parallel wich can speed up the download of large libraries. By default components are synced sequentially. |
| 126 | +- include: This is an array of item types that allows you to limit the types of items that will be included in the pushed/pull actions for this library, this list will only support types that are handled by default. It allows you to limit the types to a subset of the supported types. i.e. Some one that only works on icons could limit it to "LibraryImageComponent" |
0 commit comments