Home

Before you begin

Before diving in to editing the theme, there are a few tools and concepts you need to be familiar with. Details and helpful tutorial/doc links are in each tool's section, lower on this page.

1. Git

• Git versioning allows us to track changes in an organized manner.
• Although Git can get complex, we are using in a very simple, straight forward way. [Link to workflow docs]

2. LESS

• A CSS "preprocessor" which extends the functionality of CSS (e.g., variables, functions, and more).
• CSS is easy enough right? LESS is easy too! If you know CSS, then LESS will feel very comfortable.
• Browsers can't read LESS, so we use tools to translate LESS into good ole' fashioned CSS. The tools used to do this all operate off of the Node.js platform.

3. Node.js

• Think of Node.js like the "Java" for web development tools. You don't have to know how to use Node.js directly, but you do need it installed on your computer to run the tools that automate some of the tasks required to test and release updates to the theme.

4. Grunt.js

• Grunt is a configurable "task runner" built on the Node.js platform. This is used to automate otherwise teadious, time consuming tasks.
• You don't have to actually learn grunt to contribute to the theme. But you will have to install it and run various grunt tasks (e.g, commands) to apply those changes (i.e., grunt build).

5. Bower.io

• Bower is a package manager for web developers. It allows you to easily update, install, and manage third-party dependencies. (i.e., instead of going to the Bootstrap website, downloading, unzipping the download, and then uploading you just use the command bower install bootstrap).

Getting Started

Install the tools

Git

1. Go to Git's website and download the installer for your OS.
2. For Windows, when you hit the "Adjusting your PATH environment" installer step, be sure to choose "Use Git from the Windows Command Prompt"

TODO List helpful Git links

Node

1. Go to Node.js website and download the installer.
2. ... install!

Install PhpStorm

1. Go to the PhpStorm website and download the installer.
2. Apply for their free education license

It may take a few days for your approval, but PhpStorm comes with a 30 day free trial, so you can use it right away.

Clone the roots-ualib repository

1. Check out from Github

• For fresh PhpStorm installs: Choose "Check out from Version Control" on the welcome screen, then choose Github.
• Or, go to VCS -> Check out from Version Control -> Github

2. After typing in your Github credentials, Choose the ualibweb/roots-ualib repo

• If you have contribute access to the ualib Github machine account, Do not checkout the ualib/ualib-roots repo

Install the repo dependencies

1. In PhpStorm click open the terminal by clicking the Terminal button on the bottom left or press 'Alt + F12`.
2. Type in the command to install the repository's Node dependencies npm install
3. Install the Bower dependencies: bower install

The Node dependencies are defined in the package.json file. Bower dependencies are in the bower.json file.