Shoaib Burq sabman

If you are running a large website where you will need to test new features on a seperate url before pushing them live then the following instructions are for you ;)

For this example imagine your url is apple.com and you want a development/staging site on a subdomain which is dev.apple.com

Setup

First thing you'll want to do is go ahead and create your website in plesk and add the subdomain dev.apple.com at the same time.
ssh into the server e.g. $ ssh username@ipaddress
Once logged in cd into the private directory (this will be where all git repos are stored) e.g. $ cd ~/private
Create the main repo e.g. $ git init --bare apple.git

CartoDB's MVT service + Mapbox GL

Check index.html for some examples. These use a beta feature of CartoDB's Maps API: fixed URLs. So there is no need to use cartodb.js and tiles can be consumed using a named map name.

cartodb.js example

Check cartodb.js.html to see the integration with cartodb.js and in particular with cartodb.core.js.

Mapbox GL resources

API reference

This example shows how to create a Leaflet map with a basemap and an empty CartoDB.js layer. Once the layer is created a function is attached the event of the layers selector checkboxes so on any state change, the sublayers are removed and recreated according to the user selection.

	<!doctype html>

	<html lang="en">
	<head>
	<meta charset="utf-8">

	<title>carto-mapboxgl-demo</title>
	<link href='https://api.mapbox.com/mapbox-gl-js/v0.26.0/mapbox-gl.css' rel='stylesheet' />
	<style>
	body {

	<!doctype html>
	<html>
	<head>
	<title>Tornadoes total versus max damage</title>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.1.1/Chart.min.js"></script>
	<meta name = "viewport" content = "initial-scale = 1, user-scalable = no">
	<script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script>
	<style>
	canvas{
	}

	var map = L.map('map', {
	scrollWheelZoom: false,
	center: [-18, -46],
	zoom: 8
	});

	L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
	attribution: '<a href="http://cartodb.com">CartoDB</a> © 2014',
	maxZoom: 18
	}).addTo(map);

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">

	<title>Collapsible Tree Example</title>

	<style>

	.node circle {