Getting Started Mac

0. Did you set up the Environment?

1. Cloning the repository

git clone https://github.com/microsoftny/civic-graph.git

2. Setting up your Local Environment

1. Turn on your Stack Server (WAMP/MAMP)
2. Inside a browser, access the database's dashboard with:

localhost:8888/phpMyAdmin/?lang=en

3. [optional] If you would like to change your root password, you can do so in your localhost.
4. Navigate to the config.inc.php file to retrieve your local database's credentials.

applications/mamp/phpMyAdmin/config.inc.php

You can check your port, user, and password from lines 68-88. Here's a snippet of what these lines look like:

// The $cfg['Servers'] array starts with $cfg['Servers'][1].  Do not use $cfg['Servers'][0].
// You can disable a server config entry by setting host to ''.
$i++;
$cfg['Servers'][$i]['host']          = 'localhost'; // MySQL hostname or IP address
$cfg['Servers'][$i]['port']          = '8889';          // MySQL port - leave blank for default port
$cfg['Servers'][$i]['socket']        = '';          // Path to the socket - leave blank for default socket
$cfg['Servers'][$i]['connect_type']  = 'tcp';       // How to connect to MySQL server ('tcp' or 'socket')
$cfg['Servers'][$i]['extension']     = 'mysql';     // The php MySQL extension to use ('mysql' or 'mysqli')
$cfg['Servers'][$i]['compress']      = FALSE;       // Use compressed protocol for the MySQL connection
                                                    // (requires PHP >= 4.3.0)
$cfg['Servers'][$i]['controluser']   = '';          // MySQL control user settings
                                                    // (this user must have read-only
$cfg['Servers'][$i]['controlpass']   = '';          // access to the "mysql/user"
                                                    // and "mysql/db" tables).
                                                    // The controluser is also
                                                    // used for all relational
                                                    // features (pmadb)
$cfg['Servers'][$i]['auth_type']     = 'config';    // Authentication method (config, http or cookie based)?
$cfg['Servers'][$i]['user']          = 'root';      // MySQL user
$cfg['Servers'][$i]['password']      = 'root';          // MySQL password (only needed
                                                    // with 'config' auth_type)

5. Update the credentials.js file with the localhost login.
   • If you are a collaborator, you'll be provided the cleardb credentials.
   • Otherwise, both can be your localhost credentials.
   • Double check your port setup (MAMP-Preferences-Ports) and change the credentials to match

exports.cred = {
    'cleardb' : { //you will be provided these credentials if you are a collaborator
      port: 3306, //should match your mySQL port in MAMP
      host: 'localhost',
      user: 'root',
      password: 'root',
      database: 'cdb_c7da98943c'
    },
    'localhost' : {
      port: 3306, //should match your mySQL port in MAMP
      host: 'localhost',
      user: 'root', 
      password: 'root', //you can change this password in your local phpmyadmin
      database: 'cdb_c7da98943c'
    }
};

7. Execute the mysqllocal.js script to parse the database

node mysqllocal

3. Running the Application

1. While inside the repo folder, execute the following command:

npm start

2. Launch the application in a browser:

http://localhost:3000

3. Your terminal (if you're using one will look like this)

> [email protected] start /directory/leading/to/civic/graph/repo
> node ./bin/www

GET / 304 630ms
GET /stylesheets/custom/reset.css 304 10ms
GET /stylesheets/custom/normalize.css 304 9ms
GET /stylesheets/metro/css/metro-bootstrap.css 304 8ms
GET /stylesheets/metro/css/metro-bootstrap-responsive.css 304 8ms
GET /stylesheets/metro/min/iconFont.min.css 304 10ms
GET /stylesheets/font-awesome/css/font-awesome.css 304 10ms
GET /stylesheets/custom/style.css 304 2ms
GET /stylesheets/custom/herograph.css 304 4ms
GET /stylesheets/custom/checkboxes.css 304 3ms
GET /stylesheets/custom/footer.css 304 2ms
GET /scripts/underscore-min.js 304 2ms
GET /stylesheets/custom/left-nav.css 304 5ms
GET /stylesheets/custom/developer-style.css 304 5ms
GET /scripts/vis.js 404 98ms - 2.92kb
GET /images/ms_logo.png 304 1ms
GET /stylesheets/font-awesome/fonts/fontawesome-webfont.woff?v=4.1.0 304 1ms
GET /stylesheets/custom/reset.css 304 15ms
GET /stylesheets/custom/normalize.css 304 13ms
GET /stylesheets/metro/css/metro-bootstrap-responsive.css 304 15ms
GET /stylesheets/metro/css/metro-bootstrap.css 304 15ms
GET /stylesheets/font-awesome/css/font-awesome.css 304 10ms
GET /stylesheets/metro/min/iconFont.min.css 304 18ms
GET /stylesheets/custom/style.css 304 2ms
GET /stylesheets/custom/herograph.css 304 2ms
GET /stylesheets/custom/checkboxes.css 304 2ms
GET /stylesheets/custom/footer.css 304 3ms
GET /stylesheets/custom/left-nav.css 304 3ms
GET /stylesheets/custom/developer-style.css 304 2ms
GET /scripts/underscore-min.map 304 1ms
GET / 200 332ms - 7.64kb
GET /stylesheets/custom/normalize.css 304 14ms
GET /stylesheets/custom/reset.css 304 12ms
GET /stylesheets/metro/css/metro-bootstrap.css 304 9ms
GET /stylesheets/metro/css/metro-bootstrap-responsive.css 304 26ms
GET /stylesheets/metro/min/iconFont.min.css 304 32ms
GET /stylesheets/font-awesome/css/font-awesome.css 304 36ms
GET /stylesheets/custom/herograph.css 304 10ms
GET /stylesheets/custom/footer.css 304 9ms
GET /stylesheets/custom/checkboxes.css 304 7ms
GET /stylesheets/custom/style.css 304 7ms
GET /stylesheets/custom/left-nav.css 304 6ms
GET /stylesheets/custom/developer-style.css 304 6ms
GET /scripts/underscore-min.js 304 18ms
GET /scripts/visualization.js 200 29ms - 127.77kb
GET /images/ms_logo.png 304 5ms
GET /athena 200 178ms - 1.59mb
GET /scripts/underscore-min.map 304 1ms