{"id":16396383,"url":"https://github.com/clhenrick/jekyll-tutorial","last_synced_at":"2026-02-28T14:31:13.428Z","repository":{"id":147261327,"uuid":"428770905","full_name":"clhenrick/jekyll-tutorial","owner":"clhenrick","description":"Working through the official Jekyll tutorial because I never learned it!","archived":false,"fork":false,"pushed_at":"2021-11-19T01:41:01.000Z","size":19,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-07-21T23:47:10.967Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/clhenrick.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-11-16T18:28:29.000Z","updated_at":"2021-11-19T01:41:04.000Z","dependencies_parsed_at":null,"dependency_job_id":"ff1e709f-bf81-4939-a1bd-d51aa330d442","html_url":"https://github.com/clhenrick/jekyll-tutorial","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/clhenrick/jekyll-tutorial","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clhenrick%2Fjekyll-tutorial","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clhenrick%2Fjekyll-tutorial/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clhenrick%2Fjekyll-tutorial/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clhenrick%2Fjekyll-tutorial/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/clhenrick","download_url":"https://codeload.github.com/clhenrick/jekyll-tutorial/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/clhenrick%2Fjekyll-tutorial/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":281713535,"owners_count":26548732,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-29T02:00:06.901Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-11T05:07:13.277Z","updated_at":"2025-10-29T23:03:38.117Z","avatar_url":"https://github.com/clhenrick.png","language":"HTML","readme":"# Jekyll Tutorial\n\nTo run the site locally make sure all dependencies are installed (see [setup](#Setup) below) and do:\n\n```bash\nbundle exec jekyll serve\n```\n\nTo create a production bundle that gets outputted in the `_site` directory do:\n\n```bash\nJEKYLL_ENV=production bundle exec jekyll build\n```\n\n## 01 [Setup](https://jekyllrb.com/docs/step-by-step/01-setup/)\n\n1. install [rbenv](https://github.com/rbenv/rbenv) to manage Ruby installs\n2. install ruby. I installed version `3.0.2`\n3. set local ruby version (e.g. to `3.0.2`) via `rbenv local 3.0.2`\n4. run `gem install jekyll bundler` to create a Gemfile\n5. edit the `Gemfile` and add the following gems:\n    ```\n    gem \"jekyll\"\n    gem \"webrick\"\n    ```\n6. Run `bundle` to install gems\n7. Create an `index.html` file with basic HTML\n8. Run either `bundle exec jekyll serve` to start a local server or `bundle exec jekyll build` to build the site.\n\n## 02 [Liquid](https://jekyllrb.com/docs/step-by-step/02-liquid/)\n\nLiquid templates have three main components: objects, tags, and filters.\n\n- objects represent data that can be written to a template using curly braces, e.g. `{{ object.property }}`\n\n- tags are used for logic and control flow, and use the syntax `{% %}`; e.g. `{% if page.show_sidebar %} \u003c!-- show the sidebar --\u003e {% endif %}`\n\n- filters change the output of a Liquid object\n\n**Note:** to use Liquid in your pages you need to append \"front matter\" to the top of the file, e.g.\n\n```html\n---\n---\n\u003c!DOCTYPE html\u003e\n```\n\n## 03 [Front Matter](https://jekyllrb.com/docs/step-by-step/03-front-matter/)\n\nFront matter is a snippet of YAML placed between two triple-dashed lines at the start of a file:\n\n```\n---\n---\n```\n\n- You may set variables in a page and use them in the Liquid template\n- Front matter is required for Jekyll to interpret / process a file\n- Any variable assigned in the front matter is accessible in the page's layout or includes\n- You don't need to have any variables defined between the triple dashes, you can leave them empty. This is useful for things like CSS.\n\n## 04 [Layouts](https://jekyllrb.com/docs/step-by-step/04-layouts/)\n\nLayouts are templates that can be used by any page in your site and wrap around page content. They are stored in a directory called `_layouts`.\n\n**Note:** `content` is a special variable that returns the rendered content of the page on which it’s called.\n\n## 05 [Includes](https://jekyllrb.com/docs/step-by-step/05-includes/)\n\nThe `include` tag allows you to include content from another file stored in an _includes folder. Includes are useful for having a single source for source code that repeats around the site or for improving the readability.\n\nJekyll's [variables](https://jekyllrb.com/docs/variables/) can be used to alter what is in each `include`, for example the styling of an element.\n\n## 06 [Data Files](https://jekyllrb.com/docs/step-by-step/06-data-files/)\n\nJekyll supports loading data from YAML, JSON, and CSV files located in a `_data` directory. Data files are a great way to separate content from source code to make the site easier to maintain.\n\n- Data is made available through the variable `site.data.data_file_name`\n- You can use it for example to dynamically create page navigation links and properties\n\n## 07 [Assets](https://jekyllrb.com/docs/step-by-step/07-assets/)\n\nUsing CSS, JS, images and other assets is straightforward with Jekyll. Place them in your site folder and they’ll copy across to the built site.\n\n- typically these are placed in a directory called `assets`\n\n### Sass\n\nJekyll supports Sass out of the box:\n\n1. create a directory called `_scss` for your `.scss` partials\n2. create a `styles.scss` in the `assets` directory that `@import`s your `main.scss`\n3. link to your primary style sheet from the `assets` directory where needed, e.g. in any `layout`\n\n## 08 [Blogging](https://jekyllrb.com/docs/step-by-step/08-blogging/)\n\nIn true Jekyll style, blogging is powered by text files only.\n\nBlog posts live in a folder called `_posts`. The filename for posts have a special format: the publish date, then a title, followed by an extension.\n\nNote the `date_to_string` filter, this formats a date into a nicer format.\n\nAll blog posts data will be accessible in a variable called `site.posts`\n\nEach `post` has the following variables:\n\n- `post.url` is automatically set by Jekyll to the output path of the post\n- `post.title` is pulled from the post filename and can be overridden by setting title in front matter\n- `post.excerpt` is the first paragraph of content by default\n\n## 09 [Collections](https://jekyllrb.com/docs/step-by-step/09-collections/)\n\nCollections are similar to posts except the content doesn’t have to be grouped by date.\n\nIMO it's a bit complex to set up...\n\n## 10 [Deployment](https://jekyllrb.com/docs/step-by-step/10-deployment/)\n\nPreparing for deployment to a production environment.\n\n### Gemfile\n\nIt’s good practice to have a `Gemfile` for your site. This ensures the version of Jekyll and other gems remains consistent across different environments.\n\nBundler installs the gems and creates a `Gemfile.lock` which locks the current gem versions for a future `bundle install`. If you ever want to update your gem versions you can run `bundle update`.\n\nWhen using a `Gemfile`, you’ll run commands like `jekyll serve` with `bundle exec` prefixed. So the full command is: `bundle exec jekyll serve`\n\nThis restricts your Ruby environment to only use gems set in your `Gemfile`.\n\n### Plugins\nJekyll plugins allow you to create custom generated content specific to your site. There’s many plugins available or you can even write your own.\n\nThere are three official plugins which are useful on almost any Jekyll site:\n\n- `jekyll-sitemap` - Creates a sitemap file to help search engines index content\n- `jekyll-feed` - Creates an RSS feed for your posts\n- `jekyll-seo-tag` - Adds meta tags to help with SEO\n\nTo use these first you need to add them to your Gemfile. If you put them in a `jekyll_plugins` group they’ll automatically be required into Jekyll.\n\nAdd them to your `_config.yml` as well.\n\n### Environments\n\nYou can set the environment by using the `JEKYLL_ENV` environment variable when running a command.\n\nBy default `JEKYLL_ENV` is development. The `JEKYLL_ENV` is available to you in liquid using `jekyll.environment`.\n\nUseful for only outputting an analytics script in production.\n\n```liquid\n{% if jekyll.environment == \"production\" %}\n  \u003cscript src=\"my-analytics-script.js\"\u003e\u003c/script\u003e\n{% endif %}\n```\n\n### Deployment\nThe final step is to get the site onto a production server. The most basic way to do this is to run a production build\n\n```\nJEKYLL_ENV=production bundle exec jekyll build\n```\n\nAnd then copy the contents of _site to your server.\n\nA better way is to automate this process using a CI or 3rd party.\n\n**Note:**  The contents of `_site` are automatically cleaned, by default, when the site is built. Files or folders that are not created by your site's build process will be removed. Some files could be retained by specifying them within the `keep_files` configuration directive. Other files could be retained by keeping them in your assets directory.","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclhenrick%2Fjekyll-tutorial","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fclhenrick%2Fjekyll-tutorial","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fclhenrick%2Fjekyll-tutorial/lists"}