{"componentChunkName":"component---src-pages-author-author-yaml-id-js","path":"/author/malathi-t/","result":{"data":{"allMarkdownRemark":{"edges":[{"node":{"id":"002a56f1-671d-56ec-bd0a-d1ba0a464e04","html":"<p>A blog lets a person express his/her thoughts, and everyone craves to have his/her blog. Creating a blog is quite simple as of today. Open-source software such as <a href=\"https://wordpress.com/\">wordpress</a>, <a href=\"https://jekyllrb.com/\">jekyll</a>, <a href=\"https://gohugo.io/\">hugo</a> can help you create &#x26; set up your blog. In this post, we will see about Jekyll and how to host it in Github for free.</p>\n<h2 id=\"create-a-brand-new-jekyll-blog\" style=\"position:relative;\"><a href=\"#create-a-brand-new-jekyll-blog\" aria-label=\"create a brand new jekyll blog permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Create a brand new Jekyll blog</h2>\n<p>Install Jekyll using the instructions provided <a href=\"https://jekyllrb.com/docs/installation/\">here</a>. You mainly need <code>ruby</code>, <code>ruby gems</code>, <code>gcc</code>, <code>make</code> as pre-requisite. Run the below commands to get a new blog up and running.</p>\n<pre class=\"grvsc-container dark-default-dark\" data-language=\"sh\" data-index=\"0\"><code class=\"grvsc-code\"><span class=\"grvsc-line\"><span class=\"mtk1\">gem install jekyll bundler</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">jekyll new my-new-blog</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk11\">cd</span><span class=\"mtk1\"> my-new-blog</span></span>\n<span class=\"grvsc-line\"><span class=\"mtk1\">bundle </span><span class=\"mtk11\">exec</span><span class=\"mtk1\"> jekyll serve</span></span></code></pre>\n<p>That's it. You can navigate to <code>http://localhost:8080</code> and see your blog up and running like this</p>\n<p><img src=\"/fe1a74bbf6a7a48daee0512b4df1f22b/new-blog.webp\" alt=\"A new jekyll blog\"></p>\n<h2 id=\"customizing-the-blog\" style=\"position:relative;\"><a href=\"#customizing-the-blog\" aria-label=\"customizing the blog permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Customizing the blog</h2>\n<p>As you see, the blog is a bare minimum, and the default values mentioned in the config file (<code>_config.yml</code>) are used. You can use the <code>_config.yml</code> file to add new plugins, provide metadata about the blog, add your social media profiles, modify themes, etc. </p>\n<h3 id=\"plugins\" style=\"position:relative;\"><a href=\"#plugins\" aria-label=\"plugins permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Plugins</h3>\n<p>Some well-known plugins, to name a few are,</p>\n<ul>\n<li><a href=\"https://github.com/jekyll/jekyll-sitemap\">jekyll-sitemap</a> - Plugin that generates sitemap for the blog</li>\n<li><a href=\"https://github.com/jekyll/jekyll-admin\">jekyll-admin</a> - Plugin that provides an admin console to write the post</li>\n<li><a href=\"https://github.com/jekyll/jekyll-seo-tag\">jekyll-seo-tag</a> - Plugin that adds metadata tags for search engines and social networks to better index and displays your site's content.</li>\n</ul>\n<p>You can know about other useful plugins <a href=\"https://planetjekyll.github.io/plugins/top\">here</a>.</p>\n<h3 id=\"themes\" style=\"position:relative;\"><a href=\"#themes\" aria-label=\"themes permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Themes</h3>\n<p><a href=\"https://github.com/jekyll/minima\">Minima</a> is the default theme for Jekyll. There are many <a href=\"https://jekyll-themes.com/free/\">other</a> themes that you can use too. It is possible to <a href=\"https://github.com/jekyll/minima#customizing-templates\">customize</a> the minima theme by adding your CSS and Html. Adding support for <a href=\"https://github.com/jekyll/minima#enabling-comments-via-disqus\">comments</a> using Disqus is in-built. Also, there is a provision to enable <a href=\"https://github.com/jekyll/minima#enabling-google-analytics\">Google Analytics</a>.</p>\n<h3 id=\"liquid-templating\" style=\"position:relative;\"><a href=\"#liquid-templating\" aria-label=\"liquid templating permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Liquid templating</h3>\n<p>It need not be that all the contents in the blog have to be static. You can add dynamic content using <a href=\"https://shopify.github.io/liquid/\">Liquid</a> templating. Jekyll provides tag and filter options on <a href=\"https://jekyllrb.com/docs/liquid/\">top of liquid</a>.</p>\n<h3 id=\"using-the-custom-domain-name-for-the-blog\" style=\"position:relative;\"><a href=\"#using-the-custom-domain-name-for-the-blog\" aria-label=\"using the custom domain name for the blog permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Using the custom domain name for the blog</h3>\n<p>You can specify your custom domain by adding a file <code>CNAME</code> in the git repo, as mentioned <a href=\"https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/about-custom-domains-and-github-pages\">here</a>.</p>\n<h2 id=\"hosting--deploying-the-blog-with-github-pages\" style=\"position:relative;\"><a href=\"#hosting--deploying-the-blog-with-github-pages\" aria-label=\"hosting  deploying the blog with github pages permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Hosting &#x26; deploying the blog with Github pages</h2>\n<p>Using your GitHub account, create a new repository. Push the contents of the jekyll blog created above to the new repository. Go to the github project settings page, generally available in the url\n<code>https://github.com/&#x3C;github-id>/my-new-blog/settings</code>.\nIn the settings page, under the <code>Github pages</code> section, specify the branch to use for the github source. This can be the <code>main</code> branch or some other branch in the repository.</p>\n<p><img src=\"/bb2032c2acc645b6fe9456297e5878cd/enable-github-pages.webp\" alt=\"Enable github page for the repo\"></p>\n<p>As soon as the github page is enabled on a branch, github automatically creates actions to build the jeyll blog on a new commit to the branch.</p>\n<p><img src=\"/ef132b24d8fea5688517cc16ca4115f5/github-pages-action.webp\" alt=\"Github pages build action\"></p>\n<h2 id=\"advantages-of-using-jekyll--github-pages\" style=\"position:relative;\"><a href=\"#advantages-of-using-jekyll--github-pages\" aria-label=\"advantages of using jekyll  github pages permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>Advantages of using Jekyll &#x26; Github pages</h2>\n<ul>\n<li>Open-source</li>\n<li>Free hosting by Github, though there is some restriction as mentioned <a href=\"https://docs.github.com/en/free-pro-team@latest/github/working-with-github-pages/about-github-pages#usage-limits\">here</a>. But the restriction would be more than enough for personal websites and for getting started with a blog</li>\n<li>You don't need to be a HTML or CSS expert to get started. The blog posts are written in markdown. One can even use an online markdown editor such as <a href=\"http://dillinger.io/\">Dillinger</a>.</li>\n<li>It is faster as there is no database and the content is mostly static</li>\n<li>You can use your domain name or use the free github.io subdomain</li>\n<li>Free SSL support</li>\n<li>Version control for your blog, out of the box since the blog is on Github. Easy collaboration(new blog posts or site changes) using github pull requests.</li>\n<li>You can use Github actions and even update your site content dynamically. The Jekyll blog need not be dynamic after all. For example, you can run a python script in a github action as a cron and update the pages in your blog daily/hourly</li>\n<li>Plugin ecosystem is awesome. You can add <a href=\"https://jekyllrb.com/docs/plugins/\">plugins</a>, or you can even write your plugins and get additional functionalities to your blog.</li>\n</ul>\n<h2 id=\"when-not-to-use-jekyll\" style=\"position:relative;\"><a href=\"#when-not-to-use-jekyll\" aria-label=\"when not to use jekyll permalink\" class=\"anchor before\"><svg aria-hidden=\"true\" focusable=\"false\" height=\"16\" version=\"1.1\" viewBox=\"0 0 16 16\" width=\"16\"><path fill-rule=\"evenodd\" d=\"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"></path></svg></a>When not to use Jekyll</h2>\n<ul>\n<li>If you are not familiar with git or a person who is not a developer, setting up and customizing jekyll may be a bit tough for you. You can look at WordPress or blogger, where all the things are getting done using UI. </li>\n<li>You don't know much about blogging, and looking for a ready-made solution, jekyll may not be the right fit. </li>\n</ul>\n<p>Let's get started with blogging using Jekyll &#x26; Github pages. Happy blogging!!</p>\n<style class=\"grvsc-styles\">\n  .grvsc-container {\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    padding-top: 1rem;\n    padding-top: var(--grvsc-padding-top, var(--grvsc-padding-v, 1rem));\n    padding-bottom: 1rem;\n    padding-bottom: var(--grvsc-padding-bottom, var(--grvsc-padding-v, 1rem));\n    border-radius: 8px;\n    border-radius: var(--grvsc-border-radius, 8px);\n    font-feature-settings: normal;\n  }\n  \n  .grvsc-code {\n    display: inline-block;\n    min-width: 100%;\n  }\n  \n  .grvsc-line {\n    display: inline-block;\n    box-sizing: border-box;\n    width: 100%;\n    padding-left: 1.5rem;\n    padding-left: var(--grvsc-padding-left, var(--grvsc-padding-h, 1.5rem));\n    padding-right: 1.5rem;\n    padding-right: var(--grvsc-padding-right, var(--grvsc-padding-h, 1.5rem));\n  }\n  \n  .grvsc-line-highlighted {\n    background-color: var(--grvsc-line-highlighted-background-color, transparent);\n    box-shadow: inset var(--grvsc-line-highlighted-border-width, 4px) 0 0 0 var(--grvsc-line-highlighted-border-color, transparent);\n  }\n  \n  .dark-default-dark {\n    background-color: #1E1E1E;\n    color: #D4D4D4;\n  }\n  .dark-default-dark .mtk1 { color: #D4D4D4; }\n  .dark-default-dark .mtk11 { color: #DCDCAA; }\n</style>","frontmatter":{"title":"Setup a blog in minutes with Jekyll & Github","author":{"id":"Malathi T","github":"malathit","avatar":null},"date":"October 26, 2020","updated_date":null,"tags":["jekyll","blogging","blog","github-pages"],"coverImage":{"childImageSharp":{"fluid":{"aspectRatio":1.5037593984962405,"src":"/static/4c39b8cf22b319a7c32f6351ea746be2/58556/jekyll-github-pages.webp","srcSet":"/static/4c39b8cf22b319a7c32f6351ea746be2/61e93/jekyll-github-pages.webp 200w,\n/static/4c39b8cf22b319a7c32f6351ea746be2/1f5c5/jekyll-github-pages.webp 400w,\n/static/4c39b8cf22b319a7c32f6351ea746be2/58556/jekyll-github-pages.webp 800w,\n/static/4c39b8cf22b319a7c32f6351ea746be2/210c1/jekyll-github-pages.webp 900w","sizes":"(max-width: 800px) 100vw, 800px"}}}},"fields":{"authorId":"Malathi T","slug":"/engineering/setup-blog-in-minutes-with-jekyll/"}}}]},"authorYaml":{"id":"Malathi T","bio":"Software developer","github":"malathit","stackoverflow":"1237402","linkedin":"malathit","medium":null,"twitter":null,"avatar":null}},"pageContext":{"id":"Malathi T","__params":{"id":"malathi-t"}}},"staticQueryHashes":["1171199041","1384082988","2100481360","23180105","528864852"]}