Working with Front-end Code

Front-end Grains

Cob recognizes grains dedicated to front-end components, and offers tailored handling for them. The exact behavior depends on the type of framework you are looking to use.

Ember

Cob supports front-ends written in Ember (through ember-cli). It even lets you easily generate a new project:

$ cob generate grain --type frontend-ember ./webapp

This will create the new grain and even, if ember-cli is detected in your environment, run ember init and npm install for you.

Note

After generating the grain, you can use all regular ember-cli commands. You only have to make sure that you run them from within the grain directory – otherwise they will not work as expected.

The Mount Point

Ember front-end grains, much like many other types of grains, can declare their mount point, through the .cob.yml file:

type: frontend-ember
mountpoint: /app

This will make Cob serve your front-end code from the /app path of your webapp.

Note

for ember, the value of the mountpoint configuration option must be set in accordance with the rootURL of your Ember app’s configuration (usually config/environment.js)

Handling locationType

Ember can utilize the web browser’s history API to simulate browsing URLs directing to the same dynamic single-page app. This capability works great when navigating from the index through internal links, but requires additional support when linking to specific routes externally (as the web server needs to serve the same page even for other path segments).

Cob automatically detects the use of locationType in your config/environment.js and adjusts its behavior accordingly. Once your app uses locationType: 'auto' instead of 'hash', Cob will serve all pages under the mountpoint the same way, leading to the frontend code.

Developing with Front-end Compilation

Developing back-end and front-end code in tandem requires some additional ergonomics. Cob supports the tmux command for running a complete development environment inside tmux.

After creating your grains, run cob develop to start your tmux development session.

Working with Custom Node Versions

Cob installs Node 8.x by default on its docker images, but it can be instructed to use other versions as well. To override the node version being used, override it in your project’s configuration:

# .cob-project.yml
...
frontend:
    node_version: 8