diff --git a/Gemfile b/Gemfile index 2e260b06f7b..718d148751a 100644 --- a/Gemfile +++ b/Gemfile @@ -1,6 +1,6 @@ source "https://rubygems.org" -gem "jekyll", "~> 3.0" +gem "jekyll" gem "jekyll-sitemap" gem "jekyll-gist" -gem "octopress" +gem "jekyll-feed" diff --git a/Gemfile.lock b/Gemfile.lock index 16837142850..9bc6754816b 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,12 +1,13 @@ GEM remote: https://rubygems.org/ specs: - addressable (2.3.8) + addressable (2.4.0) colorator (0.1) faraday (0.9.2) multipart-post (>= 1.2, < 3) ffi (1.9.10) - jekyll (3.1.1) + ffi (1.9.10-x64-mingw32) + jekyll (3.1.6) colorator (~> 0.1) jekyll-sass-converter (~> 1.0) jekyll-watch (~> 1.1) @@ -15,56 +16,42 @@ GEM mercenary (~> 0.3.3) rouge (~> 1.7) safe_yaml (~> 1.0) + jekyll-feed (0.5.1) jekyll-gist (1.4.0) octokit (~> 4.2) jekyll-sass-converter (1.4.0) sass (~> 3.4) jekyll-sitemap (0.10.0) - jekyll-watch (1.3.1) - listen (~> 3.0) - kramdown (1.9.0) + jekyll-watch (1.4.0) + listen (~> 3.0, < 3.1) + kramdown (1.11.1) liquid (3.0.6) - listen (3.0.5) - rb-fsevent (>= 0.9.3) - rb-inotify (>= 0.9) - mercenary (0.3.5) + listen (3.0.8) + rb-fsevent (~> 0.9, >= 0.9.4) + rb-inotify (~> 0.9, >= 0.9.7) + mercenary (0.3.6) multipart-post (2.0.0) - octokit (4.2.0) - sawyer (~> 0.6.0, >= 0.5.3) - octopress (3.0.11) - jekyll (>= 2.0) - mercenary (~> 0.3.2) - octopress-deploy - octopress-escape-code (~> 2.0) - octopress-hooks (~> 2.0) - redcarpet (~> 3.0) - titlecase - octopress-deploy (1.3.0) - colorator - octopress-escape-code (2.1.1) - jekyll (~> 3.0) - octopress-hooks (2.6.1) - jekyll (>= 2.0) + octokit (4.3.0) + sawyer (~> 0.7.0, >= 0.5.3) rb-fsevent (0.9.7) - rb-inotify (0.9.5) + rb-inotify (0.9.7) ffi (>= 0.5.0) - redcarpet (3.3.4) rouge (1.10.1) safe_yaml (1.0.4) - sass (3.4.21) - sawyer (0.6.0) - addressable (~> 2.3.5) + sass (3.4.22) + sawyer (0.7.0) + addressable (>= 2.3.5, < 2.5) faraday (~> 0.8, < 0.10) - titlecase (0.1.1) PLATFORMS ruby + x64-mingw32 DEPENDENCIES - jekyll (~> 3.0) + jekyll + jekyll-feed jekyll-gist jekyll-sitemap - octopress BUNDLED WITH - 1.11.2 + 1.12.5 diff --git a/README.md b/README.md index e4cb2046449..425149ee4d4 100644 --- a/README.md +++ b/README.md @@ -21,9 +21,8 @@ See a [live version of So Simple](http://mmistakes.github.io/so-simple-theme/) h ## Getting Started -So Simple takes advantage of Sass and data files to make customizing easier. These features require Jekyll 2.x and will not work with older versions of Jekyll. +So Simple takes advantage of Sass and data files to make customizing easier and requires Jekyll 3.x. To learn how to install and use this theme check out the [Setup Guide](http://mmistakes.github.io/so-simple-theme/theme-setup/) for more information. [![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/mmistakes/so-simple-theme/trend.png)](https://bitdeli.com/free "Bitdeli Badge") - diff --git a/_config.yml b/_config.yml index e7f00541415..553c3b528bc 100644 --- a/_config.yml +++ b/_config.yml @@ -18,8 +18,10 @@ sass: gems: - jekyll-sitemap - jekyll-gist + - jekyll-feed kramdown: + input: GFM auto_ids: true footnote_nr: 1 entity_output: as_char diff --git a/_posts/articles/2011-03-10-sample-post.md b/_posts/articles/2011-03-10-sample-post.md index 24c1cb4d593..14147a2b4be 100644 --- a/_posts/articles/2011-03-10-sample-post.md +++ b/_posts/articles/2011-03-10-sample-post.md @@ -2,7 +2,7 @@ layout: post title: Sample Post excerpt: "Just about everything you'll need to style in the theme: headings, paragraphs, blockquotes, tables, code blocks, and more." -modified: 2013-05-31 +modified: 2016-06-01T14:17:25-04:00 categories: articles tags: [sample-post] image: @@ -73,17 +73,17 @@ HTML and CSS are our tools. Mauris a a ## Code Snippets -Syntax highlighting via Pygments and Rouge +Syntax highlighting via Rouge -{% highlight css %} +```css #container { float: left; margin: 0 -240px 0 0; width: 100%; } -{% endhighlight %} +``` -Non Pygments/Rouge code example +Non Rouge code example

This is great isn't it?

@@ -93,4 +93,4 @@ Non Pygments/Rouge code example Make any link standout more when applying the `.btn` class. -
This is a button
+
This is a button
diff --git a/_posts/articles/2013-05-22-sample-post-images.md b/_posts/articles/2013-05-22-sample-post-images.md index df05bc9d902..45a7d317d21 100644 --- a/_posts/articles/2013-05-22-sample-post-images.md +++ b/_posts/articles/2013-05-22-sample-post-images.md @@ -6,6 +6,7 @@ categories: articles tags: [sample-post, images, test] comments: true share: true +modified: 2016-06-01T14:17:50-04:00 --- Here are some examples of what a post with images might look like. If you want to display two or three images next to each other responsively use `figure` with the appropriate `class`. Each instance of `figure` is auto-numbered and displayed in the caption. @@ -23,13 +24,13 @@ Here are some examples of what a post with images might look like. If you want t Apply the `half` class like so to display two images side by side that share the same caption. -{% highlight html %} +```html
image image
Caption describing these two images.
-{% endhighlight %} +``` And you'll get something that looks like this: @@ -45,14 +46,14 @@ And you'll get something that looks like this: Apply the `third` class like so to display three images side by side that share the same caption. -{% highlight html %} +```html
image image image
Caption describing these three images.
-{% endhighlight %} +``` And you'll get something that looks like this: @@ -64,4 +65,4 @@ And you'll get something that looks like this: image image
Three images.
- \ No newline at end of file + diff --git a/_posts/articles/2013-06-25-video-post.md b/_posts/articles/2013-06-25-video-post.md index fdd5a573128..4c92be93396 100644 --- a/_posts/articles/2013-06-25-video-post.md +++ b/_posts/articles/2013-06-25-video-post.md @@ -6,18 +6,17 @@ categories: articles tags: [sample-post, video] comments: true share: true +modified: 2016-06-01T14:18:26-04:00 --- Video embeds are responsive and scale with the width of the main content block with the help of [FitVids](http://fitvidsjs.com/). -Not sure if this only effects Kramdown or if it's an issue with Markdown in general. But adding YouTube video embeds causes errors when building your Jekyll site. To fix add a space between the ` -{% endhighlight %} +``` And here's a Vimeo embed for testing purposes. - \ No newline at end of file + diff --git a/_posts/articles/2013-08-16-code-highlighting-post.md b/_posts/articles/2013-08-16-code-highlighting-post.md index 890af44d3e2..27fc40bddb2 100644 --- a/_posts/articles/2013-08-16-code-highlighting-post.md +++ b/_posts/articles/2013-08-16-code-highlighting-post.md @@ -10,6 +10,7 @@ image: creditlink: http://wegraphics.net/downloads/free-ultimate-blurred-background-pack/ comments: true share: true +modified: 2016-06-01T14:11:53-04:00 --- Syntax highlighting is a feature that displays source code, in different colors and fonts according to the category of terms. This feature facilitates writing in a structured language such as a programming language or a markup language as both structures and syntax errors are visually distinct. Highlighting does not affect the meaning of the text itself; it is intended only for human readers.[^1] @@ -20,15 +21,15 @@ Syntax highlighting is a feature that displays source code, in different colors To modify styling and highlight colors edit `/_sass/_syntax.scss`. -{% highlight css %} +```css #container { float: left; margin: 0 -240px 0 0; width: 100%; } -{% endhighlight %} +``` -{% highlight html %} +```html {% raw %} {% endraw %} -{% endhighlight %} +``` -{% highlight ruby %} +```ruby module Jekyll class TagIndex < Page def initialize(site, base, dir, tag) @@ -59,8 +60,7 @@ module Jekyll end end end -{% endhighlight %} - +``` ### Standard Code Block diff --git a/_posts/articles/2014-06-19-author-override.md b/_posts/articles/2014-06-19-author-override.md index 76e880f6cbb..37f5f824e97 100644 --- a/_posts/articles/2014-06-19-author-override.md +++ b/_posts/articles/2014-06-19-author-override.md @@ -7,6 +7,7 @@ tags: [sample-post, readability, test] author: billy_rick comments: true share: true +modified: 2016-06-01T14:18:57-04:00 image: feature: so-simple-sample-image-7.jpg credit: WeGraphics @@ -19,7 +20,7 @@ Previously the theme used a global author for the entire site and those attribut Start by modifying or creating a new `authors.yml` file in the `_data` folder and add your authors using the following format. -{% highlight yaml %} +```yaml # Authors billy_rick: @@ -40,10 +41,10 @@ cornelius_fiddlebone: twitter: rhymeswithsackit google: plus: CorneliusFiddlebone -{% endhighlight %} +``` To assign Billy Rick as an author for our post. You'd add the following YAML front matter to a post: -{% highlight yaml %} +```yaml author: billy_rick -{% endhighlight %} \ No newline at end of file +``` diff --git a/_posts/blog/2014-08-08-hello-world.md b/_posts/blog/2014-08-08-hello-world.md index 5a069b05005..0bd616c257e 100644 --- a/_posts/blog/2014-08-08-hello-world.md +++ b/_posts/blog/2014-08-08-hello-world.md @@ -8,6 +8,7 @@ tags: [] image: feature: date: 2014-08-08T15:39:55-04:00 +modified: 2016-06-01T14:19:19-04:00 --- You'll find this post in your `_posts` directory - edit this post and re-build (or run with the `-w` switch) to see your changes! @@ -19,13 +20,13 @@ To add new posts, simply add a file in the `_posts` directory that follows the c Jekyll also offers powerful support for code snippets: -{% highlight ruby %} +```ruby def print_hi(name) puts "Hi, #{name}" end print_hi('Tom') #=> prints 'Hi, Tom' to STDOUT. -{% endhighlight %} +``` Check out the [Jekyll docs][jekyll] for more info on how to get the most out of Jekyll. File all bugs/feature requests at [Jekyll's GitHub repo][jekyll-gh]. diff --git a/_posts/blog/2015-08-10-mathjax-example.md b/_posts/blog/2015-08-10-mathjax-example.md index eaebdfd87ea..a2f012b959e 100644 --- a/_posts/blog/2015-08-10-mathjax-example.md +++ b/_posts/blog/2015-08-10-mathjax-example.md @@ -16,15 +16,15 @@ date: 2015-08-10T08:08:50-04:00 To enable MathJax support be sure Kramdown is your Markdown flavor of choice and MathJax is set to true in your `_config.yml` file. -~~~ +```yaml markdown: kramdown mathjax: true -~~~ +``` -~~~ +``` Here is an example MathJax inline rendering \\( 1/x^{2} \\), and here is a block rendering: \\[ \frac{1}{n^{2}} \\] -~~~ +``` Here is an example MathJax inline rendering \\( 1/x^{2} \\), and here is a block rendering: \\[ \frac{1}{n^{2}} \\] diff --git a/_templates/archive b/_templates/archive deleted file mode 100644 index 82bab0017e7..00000000000 --- a/_templates/archive +++ /dev/null @@ -1,9 +0,0 @@ ---- -layout: post-index -title: {{ title }} -permalink: -modified: -excerpt: -image: - feature: ---- \ No newline at end of file diff --git a/_templates/page b/_templates/page deleted file mode 100644 index 54646cbad28..00000000000 --- a/_templates/page +++ /dev/null @@ -1,9 +0,0 @@ ---- -layout: {{ layout }} -title: {{ title }} -date: {{ date }} -modified: -excerpt: -image: - feature: ---- diff --git a/_templates/post b/_templates/post deleted file mode 100644 index 009e333b572..00000000000 --- a/_templates/post +++ /dev/null @@ -1,10 +0,0 @@ ---- -layout: {{ layout }} -title: {{ title }} -modified: -categories: {{ dir }} -excerpt: -tags: [] -image: - feature: ---- diff --git a/feed.xml b/feed.xml deleted file mode 100644 index 9938c5b67b0..00000000000 --- a/feed.xml +++ /dev/null @@ -1,42 +0,0 @@ ---- -sitemap: false ---- - - -{{ site.title }} -Jekyll - - -{{ site.time | date_to_xmlschema }} -{{ site.url }}/ - - {{ site.owner.name }} - {{ site.url }}/ - {% if site.owner.email %}{{ site.owner.email }}{% endif %} - -{% for post in site.posts limit:20 %} -{% if post.author %} - {% assign author = site.data.authors[post.author] %} -{% else %} - {% assign author = site.owner %} -{% endif %} - - <![CDATA[{{ post.title | cdata_escape }}]]> - - {{ site.url }}{{ post.id }} - {% if post.modified %}{{ post.modified | to_xmlschema }}T00:00:00-00:00 - {{ post.date | date_to_xmlschema }} - {% else %}{{ post.date | date_to_xmlschema }} - {{ post.date | date_to_xmlschema }}{% endif %} - - {{ author.name }} - {{ site.url }} - {% if author.email %}{{ author.email }}{% endif %} - - - {{ post.content | xml_escape }} - {% include feed-footer.html %} - - -{% endfor %} - \ No newline at end of file diff --git a/theme-setup/index.md b/theme-setup/index.md index 64d9511d589..1419de196db 100644 --- a/theme-setup/index.md +++ b/theme-setup/index.md @@ -2,7 +2,7 @@ layout: page title: Theme Setup excerpt: "Instructions on how to install and customize the Jekyll theme So Simple." -modified: 2016-01-19 +modified: 2016-06-01T14:07:07-04:00 image: feature: so-simple-sample-image-6.jpg credit: WeGraphics @@ -22,14 +22,14 @@ If you are creating a new Jekyll site using So Simple follow these steps: 1. Fork the [So Simple repo](http://github.com/mmistakes/so-simple-theme/fork). 2. Clone the repo you just forked and rename it. -3. [Install Bundler](http://bundler.io) `gem install bundler` and Run `bundle install` to install all dependencies (Jekyll, [Jekyll-Sitemap](https://github.com/jekyll/jekyll-sitemap), [Octopress](https://github.com/octopress/octopress), etc) +3. [Install Bundler](http://bundler.io) `gem install bundler` and Run `bundle install` to install Jekyll and all dependencies. 4. Update `_config.yml`, add navigation, and replace demo posts and pages with your own. Full details below. If you want to use So Simple with an existing Jekyll site follow these steps: 1. [Download So Simple](https://github.com/mmistakes/so-simple-theme/archive/master.zip) and unzip. 2. Rename `so-simple-theme-master` to something meaningful ie: `new-site` -3. Run `bundle install` to install all dependencies (Jekyll, [Jekyll-Sitemap](https://github.com/jekyll/jekyll-sitemap), [Octopress](https://github.com/octopress/octopress), etc) +3. Run `bundle install` to install Jekyll and all dependencies. 4. Remove demo posts/pages and replace with your own posts, pages, and any other content you want to move over. 5. Update posts' and pages' YAML to match variables used by So Simple. Full details below. 6. Update `_config.yml` and add navigation links and additional author data if applicable. Full details below. @@ -47,11 +47,11 @@ The preferred method for running Jekyll is with `bundle exec`, but if you're wil > >However, this is unreliable and is the source of considerable pain. Even if it looks like it works, it may not work in the future or on another machine. -{% highlight text %} +```bash bundle exec jekyll build bundle exec jekyll serve -{% endhighlight %} +``` --- @@ -59,23 +59,22 @@ bundle exec jekyll serve How So Simple is organized and what the various files are. All posts, layouts, includes, stylesheets, assets, and whatever else is grouped nicely under the root folder. The compiled Jekyll site outputs to `_site/`. -{% highlight text %} +```bash so-simple-theme/ ├── _includes/ -| ├── browser-upgrade.html # prompt to install a modern browser for < IE9 -| ├── disqus-comments.html # Disqus comments script -| ├── feed-footer.html # post footers in feed -| ├── footer.html # site footer -| ├── head.html # site head -| ├── navigation.html # site top navigation -| ├── open-graph.html # meta data for Open Graph and Twitter cards -| └── scripts.html # site scripts +| ├── browser-upgrade.html # prompt to install a modern browser for < IE9 +| ├── disqus-comments.html # Disqus comments script +| ├── feed-footer.html # post footers in feed +| ├── footer.html # site footer +| ├── head.html # site head +| ├── navigation.html # site top navigation +| ├── open-graph.html # meta data for Open Graph and Twitter cards +| └── scripts.html # site scripts ├── _layouts/ | ├── page.html # single column page layout | └── post.html # main content with sidebar for author/post details ├── _posts/ # MarkDown formatted posts ├── _sass/ # Sass stylesheets -├── _templates/ # used by Octopress to define YAML variables for new posts/pages ├── about/ # sample about page ├── articles/ # sample articles category page ├── assets/ @@ -92,7 +91,7 @@ so-simple-theme/ ├── feed.xml # Atom feed template ├── index.md # sample homepage. lists 5 latest posts └── theme-setup/ # theme setup page. safe to remove -{% endhighlight %} +``` --- @@ -116,19 +115,16 @@ Your site's logo, appears in the header below the navigation bar and is used as #### url -Used to generate absolute URLs for sitemaps, feeds and for generating canonical URLs in a page's ``. When developing locally either comment this out or use something like `http://localhost:4000` so all assets load properly. *Don't include a trailing `/`*. [Protocol-relative URLs](http://www.paulirish.com/2010/the-protocol-relative-url/) are a nice option but there are a few caveats[^protocol]. +Used to generate absolute URLs for sitemaps, feeds and for generating canonical URLs in a page's ``. When developing locally either comment this out or use something like `http://localhost:4000` so all assets load properly. *Don't include a trailing `/`*. Examples: -{% highlight yaml %} -url: http://mmistakes.github.io/so-simple-theme +```yaml +url: https://mmistakes.github.io/so-simple-theme url: http://localhost:4000 -url: http://mademistakes.com -url: //mademistakes.com +url: http://yourdomain.com url: -{% endhighlight %} - -[^protocol]: If you decide to use a protocol-relative URL know that it will most likely break sitemap.xml that the Jekyll-Sitemap gem creates. If a valid sitemap matters to you I'd suggest [creating your own sitemap.xml](http://davidensinger.com/2013/03/generating-a-sitemap-in-jekyll-without-a-plugin/) and apply some Liquid logic to prepend links to posts/pages with `https:`. +``` #### Google Analytics and Webmaster Tools @@ -138,47 +134,21 @@ Google Analytics UA and Webmaster Tool verification tags can be entered under `o To set what links appear in the top navigation edit `_data/navigation.yml`. Use the following format to set the URL and title for as many links as you'd like. *External links will open in a new window.* -{% highlight yaml %} +```yaml - title: Portfolio url: /portfolio/ - title: Made Mistakes url: http://mademistakes.com -{% endhighlight %} +``` --- -## Adding New Content with Octopress - -While completely optional, I've included Octopress and some starter templates to automate the creation of new posts and pages. To take advantage of it start by installing the [Octopress](https://github.com/octopress/octopress) gem if it isn't already. - -{% highlight bash %} -$ gem install octopress -{% endhighlight %} - -### New Post - -Default command for creating a new post. - -{% highlight bash %} -$ octopress new post "Post Title" -{% endhighlight %} - -Default works great if you want all your posts in one directory, but if you're like me and want to group them into subfolders like `/posts`, `/portfolio`, etc. Then this is the command for you. By specifying the DIR it will create a new post in that folder and populate the `categories:` YAML with the same value. - -{% highlight bash %} -$ octopress new post "New Article Title" --dir articles -{% endhighlight %} - -### New Page - -To create a new page use the following command. +## Adding New Content -{% highlight bash %} -$ octopress new page new-page/ -{% endhighlight %} +Posts are stored in the `_posts` directory and named according to the `YEAR-MONTH-DAY-title.MARKUP` format as per [the usual](https://jekyllrb.com/docs/posts/). -This will create a page at `/new-page/index.md` +To streamline the creation of posts and pages, [Jekyll::Compose](https://github.com/jekyll/jekyll-compose) and [Octopress](https://github.com/octopress/octopress) are great plugins you can install to automate this process. --- @@ -196,11 +166,11 @@ In the sample posts folder you may have noticed `categories: articles` in the YA For example. Say you want to group all your posts under blog/ instead of articles/. In your post add `categories: blog` to the YAML front matter, rename or duplicate articles/index.md to blog/index.md and update the *for loop* to limit posts to just the blog category. -{% highlight text %} +```liquid {% raw %} {% for post in site.categories.blog %} {% endraw %} -{% endhighlight %} +``` If done correctly /blog/ should be a page index of only posts with a category of `blog`. @@ -212,20 +182,20 @@ A good rule of thumb is to keep feature images nice and wide so you don't push t The post and page layouts make the assumption that the feature images live in the `images/` folder. To add a feature image to a post or page just include the filename in the front matter like so. -{% highlight yaml %} +```yaml image: feature: feature-image-filename.jpg thumb: thumbnail-image.jpg #keep it square 200x200 px is good -{% endhighlight %} +``` To add attribution to a feature image use the following YAML front matter on posts or pages. Image credits appear directly below the feature image with a link back to the original source if supplied. -{% highlight yaml %} +```yaml image: feature: feature-image-filename.jpg credit: Michael Rose #name of the person or site you want to credit creditlink: http://mademistakes.com #url to their site or licensing -{% endhighlight %} +``` ### Videos @@ -233,9 +203,9 @@ Video embeds are responsive and scale with the width of the main content block w Not sure if this only effects Kramdown or if it's an issue with Markdown in general. But adding YouTube video embeds causes errors when building your Jekyll site. To fix add a space between the ` -{% endhighlight %} +``` ### Link Post Type @@ -247,7 +217,7 @@ By making use of data files you can assign different authors for each post. Start by modifying `authors.yml` file in the `_data` folder and add your authors using the following format. -{% highlight yaml %} +```yaml # Authors billy_rick: @@ -268,13 +238,13 @@ cornelius_fiddlebone: twitter: rhymeswithsackit google: plus: +CorneliusFiddlebone -{% endhighlight %} +``` To assign Billy Rick as an author for our post. We'd add the following YAML front matter to a post: -{% highlight yaml %} +```yaml author: billy_rick -{% endhighlight %} +``` --- @@ -282,9 +252,9 @@ author: billy_rick To add Facebook, Twitter, and Google+ share links to a post add the following YAML front matter. -{% highlight yaml %} +```yaml share: true -{% endhighlight %} +``` Share links appear below author details in the sidebar. @@ -294,17 +264,17 @@ Share links appear below author details in the sidebar. To enable comments [signup for a Disqus account](https://disqus.com/admin/signup/?utm_source=New-Site) and create a shortname for your site. Then add it to your `_config.yml` under the site owner section like so: -{% highlight yaml %} +```yaml site: owner: disqus-shortname: shortname -{% endhighlight %} +``` If you would like comments to appear on every post or page that uses the `post.html` layout simply add the following line to your `_config.yml` and you're done. -{% highlight yaml %} +```yaml comments: true -{% endhighlight %} +``` To be more selective and granualar with which posts and pages Disqus comments appear on, add `comments: true` to the YAML Front Matter of each post or page instead. @@ -339,9 +309,9 @@ For example if you wanted a red background instead of white you'd change `$body- To modify the site's JavaScript files I setup a Grunt build script to lint/concatenate/minify all scripts into `scripts.min.js`. [Install Node.js](http://nodejs.org/), then [install Grunt](http://gruntjs.com/getting-started), and then finally install the dependencies for the theme contained in `package.json`: -{% highlight bash %} +```bash npm install -{% endhighlight %} +``` From the theme's root, run `grunt` to concatenate JavaScript files, and optimize all .jpg, .png, and .svg files in the `images/` folder. You can also use `grunt dev` in combination with `jekyll build --watch` to watch for updates JS files that Grunt will then automatically re-build as you write your code which will in turn auto-generate your Jekyll site when developing locally.