Web Fundamentals
material-branch
staging: https://material-dot-web-central.appspot.com/web/
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.
Installing Dependencies
To build and run this project you need to have Ruby, Node and NPM.
Mac
- Install XCode Command Line Tools
- Install node
- Install RVM
curl -sSL https://get.rvm.io | bash
- Set RVM Default to 2.2.0
rvm install ruby-2.2.0
rvm --default use 2.2.0
- Install Pygments
easy_install pygments
- Install bundler
gem install bundler
- Install RubyGems dependencies (Jekyll and Kramdown)
rvm . do bundle install
- Install the Gulp CLI
npm install -g gulp
- Install npm dependencies
npm install
- Get the App Engine SDK and unzip into the google_appengine folder inside the project root. Add it to your path accordingly (in bash,
$ PATH=./google_appengine:$PATH
)
Running the site
To run the site:
gulp
This will compile styles & javascript and build the site with Jekyll. If thats all working, it will start a server on port 7331 (which you can reach at http://localhost:7331/web/).
Any changes to files will result in the appropriate tasks be running in gulp.
Faster Jekyll Builds
To make the build faster you can define a language and/or section of the site be built.
If you want to build a single language then run this:
gulp --lang en
If you want to build a specific section then run this:
gulp --section shows
These can be combined like so:
gulp --lang en --section shows
Learning More About Jekyll and Liquid Used
We have a styleguide which you can access at http://localhost:7331/web/styleguide/ that should get you up and running with a lot of the custom and useful info.
Translations
Building Shows
You need the python Google API client
For Linux:
pip install --upgrade google-api-python-client
Content plan
Content plan for Web Fundamentals is tracked through GitHub Issues and our Site Structure + Content Inventory doc
Release status
The project was soft launched in late April with a formal v1 launch in June 2014. We've now moved to a six-week rolling release cycle.
Project Structure
This is a Jekyll build.
/appengine-config - The server to host the static content
/gulp-tasks - The tasks available to Gulp split by responsibility (styles, scripts etc.)
/src - The documentation
/content - The content in each language
/en - The base language folder. Sub folders are sections of the site
/fundamentals
/showcase
/shows
...etc...
/<langcode> - Overrides for that language, following the en structure.
/jekyll -
/_config - These are files which define specific settings for the setup of the page
/_data - These are static strings and their translations
/_includes - These a snippets of HTML you can include in a page
/_layouts - There are layouts you can reference in the YAML of your doc
/_plugins - This is the guts of Web Fundamentals.
/static
/imgs - Images used in Web Fundamentals
/scripts - Javascript - not used in final deployment of WF only local
/styles - Sass for web fundamentals
/third_party
/tests
/tools
The site is generated in /build
, which is never checked in.
Contributing
Web Fundamentals is an open source project and we welcome your contributions! Before submitting a pull request, please review CONTRIBUTING.md and make sure that there is an issue filed describing the fix or new content. If you don't complete these steps, we won't be able to accept your pull request, sorry.