Developing for Oracle Content and Experience Cloud (CEC) using Sites Toolkit
CEC Sites Toolkit 3.0 was released this month (May 2018). The goal of this blog post is to provide an overview of Sites Toolkit and its benefits. Sites Toolkit helps the developers to quickly develop templates, themes, components and content layouts for Content and Experience Cloud. Sites Toolkit is written using Node.js. Sites Toolkit consists of the following:
- Command line interface (CLI) cec. This provides powerful commands to create, copy, import, export template, components and content layouts.
- Node.js based development server to immediately preview your templates, components and layouts as you edit them in your favorite editor.
- Best practices to write unit tests using Mocha and Chai and sample unit tests.
- Rich set of starter components, templates and content layouts.
Sites Toolkit is available in Oracle Developer Cloud Service (DevCS) as a project template. In your DevCS, create a project choosing Content and Experience Cloud template. This project contains the cec-components.git repository. Copy this git repository url. Now, run the following commands in your local computer / laptop to clone the git repository and install the Sites Toolkit.
git clone <your_project_url>.git cd cec-components npm install npm run install-cec npm start&
Now the local development server will be up and running at http://localhost:8085
You can invoke the cec CLI by typing ‘cec’ in the command line to see the list of commands. Running each command with -h provides detailed help and examples. This CLI was written using Node.js.
Local development server
Optimizing the component source code
The Sites Toolkit shows an example of how you can use Mocha and Chai to write unit test for your components. The unit test can be accessed either from development server or run on command line using PhantomJS.
Starter components, templates and content layout
Sites toolkit provides very nice list of starter components and templates. Each sample demonstrates an unique feature. Example, typing ‘cec create-template’ in command line gives the list of available started templates. Type the following to create a starter blog template.
cec create-template Starter-Blog-Template -f BlogTemplate
This blog template demonstrates all content layout features. Create template command puts the template, theme and components in src/main directory under templates, themes and components sub directories respectively. This is the same structure as you see in CEC server.
You can access the BlogTemplate in the local server. Here is one of the page from the Starter-Blog-Template. This uses Bootstrap theme for a responsiveness. All the content are served from the template. When this template is imported into Cloud, and a site is created, the content will be served dynamically from the Content APIs.
Detailed documentation is available in our product page. Here are the links: