AlloyUI.com

If you want to report an issue about AlloyUI's website you are in the right place. But if you're facing problems with AlloyUI's source code, please visit liferay/alloy-ui repository.

Table of contents

• How it works?
• Dependencies
• Getting started
• Structure
• Deploy
• Bonus

How it works?

We use Docpad, a static generator in NodeJS.

Dependencies

1. Install NodeJS, if you don't have it yet.

2. Install Docpad globally: [sudo] npm install -fg docpad

3. Install Yogi Alloy globally: [sudo] npm -g install yogi yogi-alloy

Getting started

Once you have dependencies installed, you just need to:

1. Clone the project: git clone git@github.com:liferay/alloyui.com.git

2. Then go to the project's folder: cd alloyui.com

3. And finally run: yogi alloy --site-watch

Now you can see the website running in http://localhost:9778/ :D

Structure

The basic structure of the project is given in the following way:

.
|-- out/
|-- src/
|   |-- documents/
|   |-- files/
|   |-- layouts/
|-- docpad.coffee
|-- package.json

out/

This is where the generated files are stored, once DocPad has been runned. However, this directory is unnecessary in versioning, so it is ignored (.gitignore).

src/documents/

Contains all the pages of this website. Documentation is written in Markdown and examples in JavaScript.

src/files/

Has all the images, CSS and JS files.

src/layouts/

Contains some templates that are used in the application.

docpad.coffee

Stores most settings of the application.

package.json

List NodeJS modules dependencies.

Deploy

Go to the branch you want to deploy and run yogi alloy --site-deploy, now you can see your changes live at alloyui.com.

Note: Make sure to commit everything before running this command.

Bonus

We use a template engine called Eco (.eco), so you should definitely install a syntax highlight for it on your code editor.