DEVit Conference Website Sources

DEVit the 360° Web Development Conference http://devitconf.org

Setup

The site is made with Jekyll.

You need node, yarn, Ruby and bundler gem installed in order to build the site.

Please use Node v4 and above.

Build Environment

We use Gulp to manage the development workflow, build and deploy, if you don't have it installed:
npm install gulp-cli -g

We use Bundler to manage the Jekyll dependencies, if you don't have it installed:
gem install bundler

Setup Commands

• Clone

git clone git@github.com:skgtech/devit.git
cd devit

• Install Jekyll and its dependencies

bundle install

• Install node packages

yarn

Troubleshooting nokogiri

nokogiri can be a big PITA, first try this:

bundle update nokogiri

And if that fails maybe try this:

brew unlink libxml2
brew unlink libxslt
brew unlink libiconv
sudo xcode-select --install
gem install nokogiri

Build Commands

• gulp: Launch the website locally, a development workflow with livereloads and watches.
• gulp deploy: Build & Deploy the website using github pages.
• gulp deploy --config _config-sta.yml --gh-pages sta-gh-pages: Build & Deploy the website to Heroku.

Directory Structure

For the underscore prefixed (_*) directories, except _js, please refer to the Jekyll's documentation.

• _js: This is where we keep all the JavaScript source code.
• assets: Those are all our assets. css and js folders are auto-generated, DO NOT edit those files directly.
• pages: Separated Jekyll pages.
• 2015, 2016: Legacy DEVit sites.

CSS

We write CSS using SASS but with not a specific methodology. Hence, it is known that our current code is a bit messed up. First step is to clean our current CSS codebase and then find a proper methodology to use.

Step up if you think you can help!

JS

We use webpack to compile our JavaScript. All assets/dependencies(except the critical ones, such as base CSS) are being loading through JS files.

An example is the _js/homepage.js file, where:

• utils/common.js is common for every page, so include it in your file
• require.ensure will make sure that the dependencies are being load but not evaluated untill you say so.

Webpack will then do it's thing, based on the configuration provided in gulpfile.js.

Again, we could use some help from everyone, so step up!

Troubleshooting

Nothing so far. YAY!

License

Copyright ©2016 SKGTech. Licensed under the MIT license.