Portfolio static site generated by jekyll. The site is deployed to https://mydatahack.github.io/portfolio/.
- HTML: Using Jekyll to generate static site
- CSS: Using sass and gulp to compile & minify
- JS: For non-react page, using TypeScript and gulp & rollup to compile & minify
- React: Using TypeScript and Webpack
- Ruby: ~> 2.6.6 (https://rubyinstaller.org/ - Choose recommended version of Ruby+Devkit)
- Node.js: ~> 12.14
- Install Ruby
For Windows, https://rubyinstaller.org/ - Choose recommended version of Ruby+Devkit.
For Mac, brew install ruby
- Install Jekyll after installing Ruby
gem install bundler jekyll
- Build JavaScript & CSS
cd code
npm i
_include # this is where partial html fragments are defined
_layouts # this is where Jekyll layouts are defined
_site # not commited, jekyll generate static site to this folder
assets # static assests - where react bundle, css bundle, js bundles are pushed. Images are directly added and source controlled
code # where we develop css and js. Bundle will be pushed to assets/js and assets/css folders
prototype # where we use it to prototype front end look
react # where we develop react. Bundle will be pushed to assets/js folder
404.html # error page
index.html # entrypoint, using default template
*.html # other pages
There are 3 steps to build the Jekyll site.
- Build js and css bundle from /code
- Build react bundle from /react
- Build Jekyll site
cd code
npm run deploy:prod
cd ..
jekyll build
# Local development
# may need to use bundle exec jekyll serve for the firs time
# may need to run `bundle install`
jekyll serve --host localhot
# for local js and css hot loading
npm run watch
chaining or in where_exp can be only done two
this works.
{% assign writingList = site.posts
| where_exp: "post", "post.title == site.data.carousel.carouselItems.creativeWriting[0]
or post.title == site.data.carousel.carouselItems.creativeWriting[1]"
%}
this errors
{% assign writingList = site.posts
| where_exp: "post", "post.title == site.data.carousel.carouselItems.creativeWriting[0]
or post.title == site.data.carousel.carouselItems.creativeWriting[1]
or post.title == site.data.carousel.carouselItems.creativeWriting[2]"
%}
We can reverse sorting (meaning in an ascending order). Post used to be sorted in ascending order. Now without reversed, this becomes descending (which is the default behaviour).
{% for post in site.posts reversed %}
This suddenly started happening...
Removed Gemfile.lock and it worked. I think it was a bundler update and bundler version in the lock file got outdated.
usr/lib/ruby/2.5.0/rubygems.rb:289:in `find_spec_for_exe': can't find gem bundler (>= 0.a) with executable bundle (Gem::GemNotFoundException)
from /usr/lib/ruby/2.5.0/rubygems.rb:308:in `activate_bin_path'
from /usr/local/bin/bundle:23:in `<main>'