Ready to Learn?Ex Libris products all provide open APIs

Tech Blog

 

Feedback Form

Ido Peled on April 16th, 2018

This project provides a quick-n-simple feedback form example:

  • The destination email should be changed in the "main.ect" file
  • The form fields can be customized in the "main.jsx" (line 111)

The example also shows how to fetch information from a JSON file, which can be hosted on the Asset Manager.

You are free to do what you like with this project and improve it as you see fit.

Modifying the Source Code

Source code can be modified in the /src directory.

CSS

Anything at the root of the css directory /src/css/[name].* will be treated as an entry point for the AEK CSS buildtool. This will process the source code by transpiling any less [name].less and stylus [name].styl. The output of this, along with any [name].css files will be passed on to autoprefixer post processing (this adds vendor prefixes to css properties). In development, the result is supplemented with source mapping, in production, it is minified. The output file will be available at [publicPath]/css/[name].css
 
The boilerplate contains a default stylesheet that uses the aek-css framework to provide a number of css components. You can configure colours, etc in /aek-css-config.styl
 

JS

Anything at the root of the js directory /src/js/[name].* will be treated as an entry point for AEK webpack buildtool. This will process source code by transpiling any [name].es6.js or [name].jsx files with BabelJS, and any *.coffee files through CoffeeScript. The webpack buildtool can also process less,stylus and css as css modules which are injected into the document with a styl-loader. Again, source maps are applied and production assets are minified. The output file will be available at [publicPath]/js/[name].js
 
The boilerplate includes some basic .jsx code that demonstrates some of the available react components.
 
note that [publicPath] will be /public in development but will be very different in production
 

Screens

Everything at the root of the screens directory /src/screens/*.ect will be treated as an ECT template. The output from the ECT process will provide either raw HTML (for disconnected screens), or the Twig code that is sent to the server (for connected screens).
 
"Disconnected" screens are served locally. "Connected" screens can include twig server-side processing and are served via the CampusM servers. To "connect" a screen set a connected:true property in the @configure section in the screen code.
 

Screenshots

Installation Steps

1. Go to the folder you would want the project to exist in

2. Download the code from GitHub: https://github.com/ExLibrisGroup/campusm-aek/tree/master/exlib-form-example

3. Once this project had been successfully installed then go into the project folder

4. Then use the following command: aek start

5. You will then need to use your login details

6. You will then need to choose your environment you would like to run against

 

Once these steps are done, you should see the project running on http://locahost: 5000. You will be able to look at this project locally and deploy. You can also copy this project and create your own version.