Introduction

This repository contains the source code behind cordova.io and some of its subdomains (namely, docs.cordova.io and plugins.cordova.io).

Installing

Ruby

Mac OS X

Install Homebrew from this site, and then run:

brew install ruby

Windows

Follow these steps:

1. Download this installer from this page.
2. Run the downloaded file.
   1. Use the default installation path (usually C:\Ruby22).
   2. Make sure the 'add executable to path' option is checked.
3. Download this Ruby DevKit self-extracting archive from the same website.
4. Run the downloaded file.
   1. Use the following extraction path: C:\Ruby22DevKit.
5. Open cmd.exe.

   1. Go to the extraction path:

       cd C:\Ruby22DevKit
      

   2. Run these commands (following any instructions they give):

       ruby dk.rb init
       ruby dk.rb install
      

   3. Close cmd.exe.

Linux

Run the commands from this site that apply to your Linux distribution.

---

Verify the installation by running:

ruby --version

JavaScript

Mac OS X & Windows

Go to this site, and click the "Install" button. Then run the downloaded file and follow the on-screen instructions. Make sure that the option to install NPM is enabled, if you see one.

Linux

Linux, follow the instructions on this site.

---

Verify the installation by running:

node --version
npm --version

Dependencies

Once Ruby and JavaScript are installed, install all dependencies by running:

gem install bundle
bundle install
npm install

On some systems, administrator privileges may be required for some of the above commands.

Building

To build the whole website, run:

node_modules/.bin/gulp build --prod

The built website will be in a folder called build-prod.

Developing

To work on the website and see changes live, run:

node_modules/.bin/gulp

That command will start a server and watch the source files, regenerating the site and refreshing the browser whenever changes are made. To make the regeneration faster, the excludes property in the _dev.yml file can be edited to only build certain files. For example, to only build the core website and not the docs, edit the properties to look like this:

exclude:
    - static/css-src
    - docs

NOTE: Please don't commit any dev-specific inclusion/exclusion modifications. Keep them local to your development environment.

Deploying

This section requires basic knowledge of SVN. If you do not know how to use SVN, refer to this tutorial.

To build the full website, run:

gulp build --prod

A folder called build-prod will be created, and will contain the whole website. Then, in a directory outside of the cordova-docs repository, check out the SVN repository that contains the currently deployed website by running the following command (committer access required):

cd ..
svn checkout https://svn.apache.org/repos/asf/cordova/site cordova-website

Copy the cordova-docs/build-prod/ directory to the public directory in SVN like so:

cp -R cordova-docs/build-prod/* cordova-website/public/

Finally, go into the cordova-website directory and commit all the changes introduced by the newly copied files. Some files will be new (? in SVN, and need to be svn added) and some files will be changed (M in SVN). The commit might take a while (up to 1 hour), depending on the number of files changed.

Working on the Documentation

Refer to this README.md for information about writing documentation.

Adding a Tool or a Showcase App

Items on the Codorva Tools or the Cordova App Showcase sections on the main page are modifiable by the public. Below are the guidelines and process to do so.

Guidelines

The display image shall:

1. be less than 128KiB in size (NOTE: those are kibibytes, not kilobytes),
2. contain the logo of the tool/app,
3. use colors that don't compete with other elements on the page, and
4. have acceptable measurements, as follows:
   • 298px by 100px or smaller with a roughly rectangular aspect ratio for tools, and
   • 100px by 100px or smaller with a square aspect ratio for apps.

The description shall:

1. contain neutral and non-advertising language.

The name shall:

1. be at most 40 characters long.

Showcase apps shall:

1. be available for download on a public app store or website.

Furthermore, descriptions are stripped of HTML and are truncated to fit as follows:

• down to 255 characters for tools and,
• down to 200 characters for showcase apps.

Process

1. Change the section's YAML file:
   • www/_data/tools.yml for Cordova Tools, or
   • www/_data/showcase-apps.yml for Cordova App Showcase.
2. Optionally add an image:
   1. Place the image in the section's img directory:
      • www/static/img/tools for Cordova Tools, or
      • www/static/img/showcase-apps for Cordova App Showcase.
   2. In the YAML file, set the image field to the file's name.
3. Submit a GitHub pull request with the changes.

Writing a Blog Post

1. Pull down the latest website codebase for the current posts

    git pull
   

2. Create a new entry in the www/_posts directory.

3. Use an earlier post an a template. Edit your md file to remove undesired markdown links. If there is a phrase in square brackets that isn't a CB-xxxx reference, escape it with backslashes. Otherwise, heruko might error out and fail to build all the html.

    [CB-1234] \[iOS\] \[Camera\] add a whizzbang to the snarfblat
   

4. Set a marker where the summary on the home page should stop displaying. Add the following html comment line to your md file at the desired cutoff point:

    <!--more-->
   

5. In the front matter of your blog entry, set the date: field to the desired date that you want to appear near the title. Be aware that the date (explicit here or implied via the filename) will be used to generate the relative path to this html file (e.g. "/announcements/2014/09/22/cordova-361.html"), as will the categories: front matter value.

    date: 2014-09-22
    categories: announcements
   

6. Run gulp link-bugs to linkify

    gulp link-bugs
   

7. Preview it locally by running the site using gulp

8. Raise a Pull Request with the changes

Types of Posts

Announcements - releases, call for translators, etc

Core Content - If the content has to do with cordova-core, or publishing guides, etc., we should publish the full text directly on the cordova Blog (by whichever author), as-if written by the organization.

Linked Posts - If the content was written by a contributor and is worth curating for the whole community, but is not really core ie. non-core plugins, dev tips, research, opinion-pieces, statistics, etc., post a short description, perhaps adding a document-snippet, but then link to the externally hosted content, making it clearly not written by the organization.

Post guidelines:

• Use the post title as the first header.
• Including a header as well makes the snippet on the front page look bad.
• Use an appropriate category:
• One of: howto, news, releases, announcements, blog (the catch-all category)
• Use appropriate tags:
• tools, plugins, android, ios, windowsphone, blackberry, plugin-$FOO, cli, performance, last-week, security (add to this list as necessary)
• Use gulp to preview your posts locally.
• Jekyll does a poor job telling you where markdown errors exist.
• Use the tag to specify the cutoff point for displaying your post on the main page.
• Review your post yourself before asking for a review. This includes spell-check :).
• Ask for a review by raising a pull request

Creating "last week" Posts:

To get a summary of changes (and count the changes):

for l in cordova-*; do ( cd $l ; git log --format="$(printf %30s $l) %s" --no-merges --since='1 week ago' ) ; done | grep -iv version | grep -v CHANGELOG > all_logs.txt

To get the number of authors:

for l in cordova-*; do ( cd $l ; git log --format="%an" --no-merges --since='1 week ago' ) ; done | sort | uniq | wc -l

Creating Release Announcement Posts

Create a copy of a previous post and update it.

To print the list of plugin versions tested:

1. Make sure all plugin repos are cloned, updated, and on master branch

2. Run:

    for d in *-plugin-*; do ( cd $d && echo "* $(basename $PWD): $(grep version plugin.xml|grep -v encoding|cut -d'"' -f2)" ) ; done | grep '^\*'
   

Troubleshooting

Ask for help on the IRC channel: #cordova on irc.freenode.net.