Skip to content

Latest commit

 

History

History
81 lines (58 loc) · 2.49 KB

README.md

File metadata and controls

81 lines (58 loc) · 2.49 KB
Raw

Web Fundamentals

Web Fundamentals is a technical documentation center for multi-device web development. Our goal is to build a resource for modern web developers that’s as curated and thorough as developer.android.com or iOS Dev Center.

Links: Live site | Planned content

Release status

The project was initiated in late March and soft launched to the public on April 30th. We're planning for a more polished 1.0 release in June.

Technology

This is a Jekyll build.

/src
  /appengine - the server to host the static content
  /site - the documentation
    /getting-started - the getting started articles
    /multi-device-layouts - responsive design guide
    /introduction-to-media - the guide to using media
    /optimizing-performance - the perf articles
    /using-touch - managing touch
    /showcase - the case-studies

/build is never checked in but generated by Jekyll.

Installing Dependencies

Mac

  1. Install XCode Command Line Tools
  2. Install RVM
    • curl -sSL https://get.rvm.io | bash
  3. Set RVM Default to 2.0.0
    • rvm install ruby-2.0.0-p451
    • rvm --default use 2.0.0
  4. Install Pygments
    • easy_install pygments
  5. Install Kramdown
    • gem install kramdown
  6. Install Jekyll
    • gem install jekyll

Using project-level meta data

The table of contents is generated from src/site/_project.yaml

To parse the _project.yaml file, include {% injectdata content _project.yaml %} in the page. You then have access to the variables in the page object.

Generating Table of Contents

The table of contents is generated from src/site/_book.yaml

To parse the _book.yaml file, include {% injectdata content _book.yaml %} in the page and then iterate as follows:

 {% for section in page.content.toc %}
    SOME MARKUP
 {% endfor %}

Jekyll Special elements

  • Code import: {% highlight javascript %} {% include sample1.js %} {% endhighlight %}
  • {{ articles _category_}} a list of articles in divs, ordered by the "order" preamble.
  • {{ showcases _category_}} a list of showcases.