Setup

Front-end

Websites developed by S. Group are built with Sass, Javascript and HTML5 (with either Twig or Liquid).

We use Codekit to easily manage our projects, providing Sass preprocessing and minification/concatenation of CSS and Javascript. It's a must-have for developing any modern website, and helps by automating tedious tasks.

Workflow

Our workflow is heavily influenced by Git. Any changes to an existing project will require the website files to be downloaded from the corresponding Beanstalk repository for that site - should they not already be cloned. Developers must ensure the latest changes to the repository have been pulled before commencing work. If working on a content managed site, the production database should also be downloaded and used on your local database.

Any development will be completed and tested locally, then pushed to a Staging server for client and internal approval.

Once any changes have been signed off by both parties - and only then, may the changes be pushed to the Production server.

Craft

We almost exclusively use Craft CMS for website development, and requires a basic PHP & MySQL server. We use Mamp Pro to host locally. All sites should be created as a new host, with the server name set to *.craft.dev, and the document root set to public_html.

Clone the base-craft repository into a new repository and start work. This will create a project with all Craft defaults setup, along with providing a basic folder structure as per this guide.

Read more about getting started with Craft.

If creating your Craft install for the first time, you must use the following for the primary account.

Username: sgroup
Email: web@sgroup.com.au
Password: xxxxxxxx
Locale: en_au (Australian English)

Be sure to edit public_html/index.php to reflect the domain name of the project you are working on.

// Define domain names for Development, Staging and Production
switch ($_SERVER['SERVER_NAME']) {
    case '*.craft.dev':
        define('CRAFT_ENVIRONMENT', 'local');
        break;
    case '*.madebys.com.au':
        define('CRAFT_ENVIRONMENT', 'staging');
        break;
    default:
        define('CRAFT_ENVIRONMENT', 'production');
        break;
}

Along with entering the correct database details in craft/config/db.php.

return array(
    '*' => array(
        'server' => 'localhost',
        'tablePrefix' => 'craft',
    ),
    'local' => array(
        'user' => 'root',
        'password' => 'xxxxxxxx',
        'database' => 'sitename.com.au',
    ),
    'staging' => array(
        'user' => 'madebysc_usr',
        'password' => 'xxxxxxxx',
        'database' => 'madebysc_sitename',
    ),
    'production' => array(
        'user' => 'sitename_usr',
        'password' => 'xxxxxxxx',
        'database' => 'sitename_craft',
    ),
);

Your Craft settings should also include the following settings, which should be defined in craft/config/general.php. See Craft's Config Settings for a full list of options.

return array(
    '*' => array(

        // General
        'siteUrl' => CRAFT_SITE_URL, // Sets site URL depending on environment (Dev, Staging, Production) in index.php
        'phpSessionName' => 'PHPSESSID', // Remove CraftSessionId
        'sendPoweredByHeader' => false, // Remove X-Powered-By: Craft CMS
        'phpMaxMemoryLimit' => '4048M',

        // URLs
        'cpTrigger' => 'office', // change Control Panel url from 'admin'
        'omitScriptNameInUrls' => true, // Remove index.php for urls

        // Users
        'postCpLoginRedirect' => 'entries', // Head to Entries tab once logged into CP
        'loginPath' => 'account/login',
        'logoutPath' => 'account/logout',
        'autoLoginAfterAccountActivation' => true, // Auto-login after signup

        // Templating
        'errorTemplatePrefix' => '_errors/', // Group error templates

        // Assets
        'generateTransformsBeforePageLoad' => true,
        'maxUploadFileSize' => 524288000, // 500MB

        // SproutForms
        'sproutForms' => array(
            'enableTemplateOverrides' => true,
            'enableFileAttachments' => true,
        ),
    ),
    'local' => array(
    
        'devMode' => true,
        'userSessionDuration' => 'P1Y', // Stay logged in
    
    ),
    'staging' => array(
    
        //'isSystemOn' => false, // Shut down Staging when not in use
    
    ),
    'production' => array(

        // Updates
        'allowAutoUpdates' => 'minor-only', // Don't allow updates for major versions

    ),
);

Craft Plugins

While the collection of plugins needed for each site will vary depending on the project requirements, below are a few common plugins that should be installed on site.

Shopify

For any e-commerce heavy website, we use Shopify due to its widespread use, excellent client-facing interface and development freedom. S. Group are a Shopify Partner allowing multiple sites to be easily managed without time limits on development.

Local theme development is done using the Desktop Theme Editor app, which listens to any change made locally and automatically uploads it to Shopify's CDN. This allows any change made to files locally appear almost instantly on the Shopify site. This should only be used in development, and not after the site has launched.

Upon launch of the store, the Desktop Theme Editor app should be no longer used to make changes to the site. A new Beanstalk Shopify repository should be created to manage the website files post-launch.