Start your Jekyll project with this straightforward, minimalistic and modern boilerplate.
- Clone this git repository into your project directory.
- Open a terminal and navigate into that directory.
- Make sure you have current versions of Ruby, Rubygems and NPM or YARN installed.
- Type the command
gem install jekyll bundler - Then, run the command
bundle install && yarn install(Run both commands one by one if you are on Windows)
- Run
yarn run buildonce initially to create all assets. - To run a local development server type
yarn start- then open localhost:4000. - Run
yarn run buildto run a build for production.
- Babel / ES6 Compiling
- Webpack
- Livereload
- Autoprefixer
- Normalize
- All set for Cloudcannon & Forestry
- Renamed default Jekyll folders to
srcanddistfor better overview. - Put pages into
_pagessubfolder for better overview. - Useful folder structure with minimalistic demo content.
- Frontmatter examples.
- Data examples.
- Simple Mainnavigation based on pages with active state.
- Index file with basic output of all
- Useful of comments and explanations.
You might have noticed, that there is a _webpack folder outside the src/assets directory which contains all your Javascript and SCSS folders and files.
Heres why:
Since we wan't to be able to use node_modules and won't push them to Git, we needed a solution to develop locally with all the modern tools. But then on the server, we just wanna run jekyll build everytime we push.
The jekyll build functionality is also integrated into Cloudcannon, npm is not.
So, with Mojebo we are using Babel and Webpack to transpile and bundle modern javascript code and SCSS via Webpack and place the output (main.js and main.css) in the src/assets folder where Jekyll can trigger the changes and put them in the dist directory.
- Add sourcemaps for SCSS
- If you have any installation issues on MacOS check this
- If you run into a no-acceptor issue (port in use) check this