Turbo

Thank you for using Turbo! For full documentation, check here: https://www.turbo360.co

Installation

$ sudo npm install turbo-cli -g

Scaffolding Projects

Turbo scaffolds projects in three ways:

Static Projects

$ turbo new <MY_PROJECT_NAME>
$ cd <MY_PROJECT_NAME>
$ npm install

• Static projects consist of conventional HTML/CSS/JS.
• Included in assets are Bootstrap and JQuery.
• The index.html imports a few Javascript modules: vendor.min.js, turbo.min.js, app.min.js
• vendor.min.js is a minified bundle of imported Javascript files which can be found in the 'js' task in gulpfile.js
• turbo.min.js is the Turbo CDN which provides the core functionality of the Turbo platform such as adding users, creating entities, sending emails, adding blog posts, and more.
• app.min.js is a module with your custom functions. This is initially empty
• The gulpfile.js config defines the build tasks which concatenate and minify the assets to a 'dist' directory

Add a Page to Static Projects

$ turbo page <PAGE_NAME>

• This adds a new folder to the project called <PAGE_NAME> containing a single index.html file.

React/Redux Projects

$ turbo new <MY_PROJECT_NAME> --react
$ cd <MY_PROJECT_NAME>
$ npm install

• This scaffolds a project with REACT/REDUX configured
• The REACT/REDUX source code is in the 'src' directory
• A webpack.config.js file is included with some basic webpack configuration. Feel free to adjust as needed.

React With Express Projects

$ turbo new <MY_PROJECT_NAME> --express
$ cd <MY_PROJECT_NAME>
$ npm install

• This scaffolds a project with REACT/REDUX as well as an Express project.
• The Express project code is under the 'server' directory
• A webpack.config.js file is included with some basic webpack configuration. Feel free to adjust as needed.

Add Express Server to Existing Projects

$ turbo server express

• This adds an express server to existing projects

General Commands

Run Dev Server

$ turbo devserver

• This runs a simple Express server and renders the root index.html from http://localhost:3000
• For static projects, we recommend running the dev server throughout development because it accurately reflects the behavior of your site in deployment.
• We also recommend running "gulp" in a separate tab. This invokes the build process whenever you make changes to JS or CSS files.
• The dev server supports relative links for anchor tags. For example, href="/blog" works fine with the dev server running.

Build The Project

$ npm run build

• This packages the project assets and concatenates/minifies the imports into the 'dist' directory.
• IMPORTANT: This command should be executed before every deployment because the 'dist' directory gets deployed, NOT the assets
• The gulpfile.js is where the configuration for the build process is defined. Register your custom assets here to include them in the build sequence.

Link to Turbo Project

$ turbo app <APP_ID>

• This links your local project to the Turbo platform which is necessary for deployment
• To create a Turbo project, see here: https://www.turbo360.co/create
• You can get the <APP_ID> from your app dashboard on https://www.turbo360.co

Deploy to Staging

$ turbo deploy

• Deploys your site to the Turbo staging environment. The staging URL is accessible on the internet and can be viewed by anyone.
• When deploying updates, it may take a minute or two for the changes to take effect as we propagate your site to multiple servers
• IMPORTANT: To deploy, your app must be linked to a Turbo project. To create a Turbo project, see here: https://www.turbo360.co/create
• IMPORTANT: It is best practice to run "$ npm run build" before deploying in order to package assets and minify imports.

Deploy to Production

$ turbo deploy --prod

• Deploys your site to the Turbo production environment. IMPORTANT: The production URL is NOT accessible on the internet and must be forwarded from a CNAME record in your DNS provider.
• When deploying updates, it may take a minute or two for the changes to take effect as we propagate your site to multiple servers
• IMPORTANT: To deploy, your app must be linked to a Turbo project. To create a Turbo project, see here: https://www.turbo360.co/create
• IMPORTANT: It is best practice to run "$ npm run build" before deploying in order to package assets and minify imports.

Turbo SDK Commands

The Turbo library SDK comes in two forms:

1. CDN

<script src="https://cdn.turbo360-dev.com/dist/turbo.min.js" type="text/javascript"></script>

2. NPM:

$ npm install turbo360

• IMPORTANT: In order to leverage the Turbo SDK, your project must be linked to an app on Turbo (https://www.turbo360.co/create). See "LINK TO TURBO PROJECT" above for instructions.

The CDN is suited for conventional HTML/CSS with Javascript and JQuery. The NPM is best for robust client-side frameworks like React and Angular 2. Both come packaged with every scaffolded Turbo project and they provide the functionality for leveraging the Turbo platform.

Default Resources

• By default, Turbo supports the following resources: USER, POST (blog posts), COMMENT
• Each resource comes with built-in attributes but you can add your own. For example, every USER entity has a 'username' attribute but if you want to add a 'nickname' field, you can do so by simply adding it as a parameter (with corresponding value) when creating new users. To see the built-in attributes, see here: https://www.turbo360.co/docs

To create a USER:

CDN

<script src="https://cdn.turbo360-dev.com/dist/turbo.min.js" type="text/javascript"></script>

Turbo({site_id:<MY_APP_ID>}).createUser(params, function(err, data){
    if (err){
      // handle error
    }
    else {
      // handle success
    }
  }
})

NPM

import turbo from 'turbo360'

turbo({site_id:<MY_APP_ID>}).create('user', params)
.then(data => {
  // handle success
})
.catch(err => {
  // handle error
})

• See here for full example: https://www.turbo360.co/docs

Turbo also includes a full suite of User-based operations for user management:

CDN

<script src="https://cdn.turbo360-dev.com/dist/turbo.min.js" type="text/javascript"></script>

Turbo({site_id:<MY_APP_ID>}).login(credentials, function(err, data){})
Turbo({site_id:<MY_APP_ID>}).logout(function(err, data){})
Turbo({site_id:<MY_APP_ID>}).currentUser(function(err, data){})

NPM

import turbo from 'turbo360'

turbo({site_id:<MY_APP_ID>}).login(credentials).then(data => {}).catch(err => {})
turbo({site_id:<MY_APP_ID>}).logout().then(data => {}).catch(err => {})
turbo({site_id:<MY_APP_ID>}).currentUser().then(data => {}).catch(err => {})

Custom Resources

Turbo supports custom resources as easily as the default ones. By simply specifying the resource name and its parameters when creating entities via the SDK, you can create as many resource types that your project requires.

To create a custom resource called TEAM:

CDN

<script src="https://cdn.turbo360-dev.com/dist/turbo.min.js" type="text/javascript"></script>

Turbo({site_id:<MY_APP_ID>}).create('team', params, function(err, data){
    if (err){
      // handle error
    }
    else {
      // handle success
    }
  }
})

NPM

import turbo from 'turbo360'

turbo({site_id:<MY_APP_ID>}).create('team', params)
.then(data => {
   // handle success
})
.catch(err => {
   // handle error
})

-- See here for full example: https://www.turbo360.co/docs

CRUD Operations

Turbo supports the standard CRUD operations as you would expect from an API. The following are the primary operations:

CDN

<script src="https://cdn.turbo360-dev.com/dist/turbo.min.js" type="text/javascript"></script>

Turbo({site_id:<MY_APP_ID>}).create(resourceName, params, function(err, data){})
Turbo({site_id:<MY_APP_ID>}).fetch(resourceName, params, function(err, data){})
Turbo({site_id:<MY_APP_ID>}).fetchOne(resourceName, id, function(err, data){})
Turbo({site_id:<MY_APP_ID>}).update(resource, originalEntity, updatedParams, function(err, data){})
Turbo({site_id:<MY_APP_ID>}).remove(resourceName, originalEntity, function(err, data){})

NPM

import turbo from 'turbo360'

turbo({site_id:<MY_APP_ID>}).create(resourceName, params).then(data => {}).catch(err => {})
turbo({site_id:<MY_APP_ID>}).create(resourceName, params).then(data => {}).catch(err => {})
turbo({site_id:<MY_APP_ID>}).create(resourceName, params).then(data => {}).catch(err => {})
turbo({site_id:<MY_APP_ID>}).create(resourceName, params).then(data => {}).catch(err => {})

Theme Support

Turbo supports a few html themes out of the box. To switch themes, from the root directory of a project:

$ turbo theme editorial

where 'editorial' is the theme name. Currently, Turbo supports the following themes: editorial, prologue, hyperspace, stack. These themes are free and can be found on HTML5UP.

Questions/Comments

If you have any questions, comments or feedback, feel free to contact us at katrina@velocity360.io