<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="4.2.0">Jekyll</generator><link href="/feed.xml" rel="self" type="application/atom+xml" /><link href="/" rel="alternate" type="text/html" /><updated>2021-09-17T23:23:03+10:00</updated><id>/feed.xml</id><title type="html">Hartti Suomela</title><subtitle>Business, software and sports</subtitle><entry><title type="html">Experimenting with Movesense — Flying Discs / Frisbee</title><link href="/blog/experimenting-with-movesense" rel="alternate" type="text/html" title="Experimenting with Movesense — Flying Discs / Frisbee" /><published>2019-01-13T00:00:00+11:00</published><updated>2019-01-13T00:00:00+11:00</updated><id>/blog/experimenting-with-movesense</id><content type="html" xml:base="/blog/experimenting-with-movesense">&lt;p&gt;During the 30 years I have played ultimate, I have always marveled how beautiful the flight of a frisbee is. So one could guess that when I got a couple of Movesense sensors in my hands, my first experiment had be to find out what the data from a flying disc throw looks like.&lt;/p&gt;

&lt;p&gt;The Movesense sensor is a programmable, nicely packaged Bluetooth (BLE) capable small device, which (among others) contains 9-axis motion sensor (Accelerometer, Gyro and Magnetometer). Additionally, Suunto has developed an API to communicate with the device, which makes it a great experimentation &amp;amp; development platform.&lt;/p&gt;

&lt;p&gt;The first task was to get the device attached to the disc. Luckily Movesense sensor contains two metal “legs”. My solution was to drill a couple of holes symmetrically around the center of an old disc and snap the sensor legs through these holes to hand on the bottom side of the disc. Based on my vague memories of high-school physics classes, bottom side would be aerodynamically better to (read: affect less) the flying characteristics of the disc. See the photos below of my setup.&lt;/p&gt;

&lt;p&gt;As a result the top of the disc had two slight bumps in there as the legs of the device went all the way through the disc. The bumps were however minor and I hoped that the effect on flight of the disc would be minor.&lt;/p&gt;

&lt;p&gt;Note to myself: Test if the device affects the flight differently when attached on the top of the disc.&lt;/p&gt;

&lt;p&gt;The 10 additional grams on the 175-gram disc made the disc feel heavier and I had to mentally adjust my throws a little higher, but after a couple of throws the disc felt ok.&lt;/p&gt;

&lt;p&gt;My simple hack to get the data out from the device was to use the sample mobile phone app provided by Suunto and stream the data during the throws to the phone and get the data later off the phone. This involves quite a few preparatory steps, as I had to build the iOS app from the source code and get it on the phone (quite ok description of the process is in here). I have described the steps to get the data off the phone in a separate article.&lt;/p&gt;

&lt;h1 id=&quot;the-results-are-in&quot;&gt;The results are in…&lt;/h1&gt;

&lt;p&gt;This is how 14 right-handed backhand throws and catches look like in the eyes of a gyroscope (sample rate is 104Hz). The throws were quite relaxed and the throwing distance was about 10 meters. The disc was dropped once. That drop caused the chaos-like data between the 9th and 10th throws.&lt;/p&gt;

&lt;p&gt;Not surprisingly the throws can be easily distinguished as the z-axis rotation values are high and stable for a while. But wait! Why are the rotation “peaks” completely level on some throws and in some throws the rotation seems to decrease slightly during the flight?&lt;/p&gt;

&lt;p&gt;Well, that’s because during some of the throws the disc spun so fast that the Movesense gyro maxxed out. The maximum value for the gyro on the Movesense device seems to be 2293.47998 degrees, which translates roughly to 6.4 revolutions per second (Hz). This means that in my test the disc rotated faster than 6.4 times per second in 11 of the throws, and I still did not have a clue how fast the disc really rotates during a normal throw.&lt;/p&gt;

&lt;p&gt;However, in this initial data set there are 3 throws where the gyroscope provided some useful data to calculate the rate of change of the speed of revolutions of a normal throw (of course this can be affected by the device attached to the flying disc, so I am not stating that this is the correct value for a normal ultimate disc). The rate of change of angular velocity seems to be roughly between -0.84 and -1.01 rad/sˆ2 (or in other words, the disc’s rotation slows down 0.13–0.16 revolutions per every second).&lt;/p&gt;

&lt;h1 id=&quot;magnetometer-to-the-rescue&quot;&gt;Magnetometer to the rescue&lt;/h1&gt;

&lt;p&gt;Thanks to the magnetometer, which is also available on Movesense device, we can estimate the rotation for those throws were the gyro maxxed out. Here is the magnetometer data from the same 14 throws.&lt;/p&gt;

&lt;p&gt;The throws are again clearly visible as quick oscillations on all axis. Below you can see the graph for one throw only. The rotation creates a quite nice sin-wave looking oscillations, right?&lt;/p&gt;

&lt;p&gt;With some manual data analysis (mark the local maxima of the oscillations and then divide the number of oscillations during one throw with the time interval between the last and first oscillations), I concluded that the fastest rotation was on the ninth throw — about 8.5 Hz. I also calculated the rotation using magnetometer data for the three throws for which I had useful gyrsocope data and the results matched quite nicely. So far so good.&lt;/p&gt;

&lt;p&gt;The one thing which bothered me a little is the varying amplitude of magnetometer oscillations between the throws going opposite directions. (The amplitude of the oscillations is larger on all axis for odd-numbered throws than on even-numbered throws — check it yourself!) I later asked this from a person way more knowledgeable about magnetometer data and he was able to explain the data to me. Unfortunately I did not write the explanation down, so I need to study that issue more to be able to describe the phenomenon myself.&lt;/p&gt;

&lt;p&gt;Note that I did also record the accelerometer data for these first 14 throws, but that does not help in finding out the maximum rotation. I am planning to study the accelerometer data in future posts to see the differences in backhands, forehands and hammers.&lt;/p&gt;

&lt;h1 id=&quot;next-steps&quot;&gt;Next steps&lt;/h1&gt;

&lt;p&gt;As the new firmware version for Movesense device (1.8.0) contains much improved and more reliable Bluetooth streaming I decided to wait until that version is available to continue my tests. I was recently able to update the device firmware using iPhone, so I should get more data soon to carry out tests like:&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;What is the maximum rps I can crank out in a throw?&lt;/li&gt;
  &lt;li&gt;How much difference does it make to have sensor attached to the top / under the disc&lt;/li&gt;
  &lt;li&gt;Can I estimate the speed of the throw from the accelerometer data?&lt;/li&gt;
  &lt;li&gt;Can I recognize the throw type based on the available sensor data?&lt;/li&gt;
  &lt;li&gt;Can I recognize the thrower from the available sensor data? In other words: Does throwers have their throwing fingerprint? (I hope so, but I do not think so :-)&lt;/li&gt;
&lt;/ul&gt;</content><author><name></name></author><category term="flying disc" /><category term="movesense" /><category term="data" /><summary type="html">During the 30 years I have played ultimate, I have always marveled how beautiful the flight of a frisbee is. So one could guess that when I got a couple of Movesense sensors in my hands, my first experiment had be to find out what the data from a flying disc throw looks like.</summary></entry><entry><title type="html">How to Install and use WhatATheme?</title><link href="/blog/how-to-install-whatatheme" rel="alternate" type="text/html" title="How to Install and use WhatATheme?" /><published>2018-04-22T00:00:00+10:00</published><updated>2018-04-22T00:00:00+10:00</updated><id>/blog/how-to-install-whatatheme</id><content type="html" xml:base="/blog/how-to-install-whatatheme">&lt;h1 id=&quot;what-is-whatatheme&quot;&gt;What is WhatATheme?&lt;/h1&gt;
&lt;blockquote&gt;
  &lt;p&gt;You’ll find this post in your &lt;strong&gt;&lt;em&gt;_posts&lt;/em&gt;&lt;/strong&gt; directory. Go ahead and edit it and re-build the site to see your changes. &amp;gt;You can rebuild the site in many different ways, but the most common way is to run &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;bundle exec jekyll serve&lt;/code&gt;, which launches a web server and auto-regenerates your site when a file is updated.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;iframe width=&quot;560&quot; height=&quot;315&quot; src=&quot;https://www.youtube.com/embed/VfPa2c9kwhQ&quot; frameborder=&quot;0&quot; allow=&quot;accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;

&lt;hr /&gt;

&lt;p&gt;&lt;strong&gt;WhatATheme&lt;/strong&gt; is a customizable Jekyll Portfolio theme which supports blogging. You can use this theme in order to create an elegant, fully responsive portfolio which includes&lt;/p&gt;

&lt;h3 id=&quot;home-page--&quot;&gt;Home Page -&lt;/h3&gt;
&lt;ul&gt;
  &lt;li&gt;A Hero section - A section where you can outsource an image which will work as the background for the particular section; it also will include your name and a tagline which can be easily manipulated via the _config.yml file.&lt;/li&gt;
  &lt;li&gt;An About section - A section where you can include your image and a 60 word paragraph which again you can easily manipulate using the _config.yml file.&lt;/li&gt;
  &lt;li&gt;A Contact section - A section where you can include 3 direct ways to contact&lt;br /&gt;
&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Ping on Messenger&lt;/code&gt;&lt;br /&gt;
&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Send an Email&lt;/code&gt;&lt;br /&gt;
&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Tweet on Twitter&lt;/code&gt;&lt;br /&gt;
The contact section will also include 10 different social media buttons for your audience to follow.&lt;br /&gt;
&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Facebook&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Twitter&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Instagram&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;LinkedIn&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;GitHub&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;YouTube&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Reddit&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Behance&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Dribbble&lt;/code&gt; &amp;amp; &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Spotify&lt;/code&gt;.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3 id=&quot;blog--&quot;&gt;Blog -&lt;/h3&gt;
&lt;p&gt;The blog includes a horizontal card list where the latest articles are fetched from the _posts folder automatically in top-down format. It also includes an instant search box which matches your query from the title, description &amp;amp; content of your post and shows the result as soon as you type.&lt;br /&gt;
The blog card includes&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;Post Title&lt;/li&gt;
  &lt;li&gt;300 words from the content of the post&lt;/li&gt;
  &lt;li&gt;The publish date&lt;/li&gt;
  &lt;li&gt;The time which will be required to read the post.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3 id=&quot;projects--&quot;&gt;Projects -&lt;/h3&gt;
&lt;p&gt;The Projects page will include all the projects from the &lt;strong&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;projects.yml&lt;/code&gt;&lt;/strong&gt; file which is present in the _data folder.&lt;br /&gt;
Projects will be showcased in a card-list format where each card will contain&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;An image related to the project&lt;/li&gt;
  &lt;li&gt;A Project Title&lt;/li&gt;
  &lt;li&gt;A Project Description of about 80 words&lt;/li&gt;
&lt;/ul&gt;

&lt;h3 id=&quot;footer--&quot;&gt;Footer -&lt;/h3&gt;
&lt;p&gt;The footer includes&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;A small about the author widget which show the same &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Author Image&lt;/code&gt; as mentioned in the about section of the Home page which includes &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Name of the Author&lt;/code&gt;, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Around 75 words about the author&lt;/code&gt;.&lt;/li&gt;
  &lt;li&gt;A more link widget which includes a link to any extra page that you’ve created and a &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Subscribe via RSS&lt;/code&gt; link.&lt;/li&gt;
  &lt;li&gt;A Recent posts widget which will include latest 3 posts.&lt;/li&gt;
&lt;/ul&gt;

&lt;h4 id=&quot;extra-features--&quot;&gt;Extra Features -&lt;/h4&gt;
&lt;p&gt;WhatATheme comes pre installed with&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;strong&gt;HTML Compressor&lt;/strong&gt; - It’ll compress all the pages by removing any extra space or blank lines.&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Google Analytics&lt;/strong&gt; - A web analytics service offered by Google that tracks and reports website traffic. For more information &lt;a href=&quot;https://analytics.google.com&quot; target=&quot;blank&quot;&gt;click here&lt;/a&gt;.&lt;/li&gt;
  &lt;li&gt;
    &lt;p&gt;&lt;strong&gt;Disqus&lt;/strong&gt; - A worldwide blog comment hosting service for web sites and online communities that use a networked platform. For more information about Disqus &lt;a href=&quot;https://help.disqus.com/en/articles/1717053-what-is-disqus&quot; target=&quot;blank&quot;&gt;click here&lt;/a&gt;&lt;/p&gt;

    &lt;p&gt;##### For more information about WhatATheme &lt;a href=&quot;https://github.com/thedevslot/WhatATheme/blob/gh-pages/README.md&quot; target=&quot;blank&quot;&gt;click here&lt;/a&gt;.&lt;/p&gt;
  &lt;/li&gt;
&lt;/ul&gt;

&lt;hr /&gt;

&lt;h1 id=&quot;installation&quot;&gt;Installation&lt;/h1&gt;
&lt;h3 id=&quot;step-1---setting-up-whatatheme&quot;&gt;Step 1 - Setting up WhatATheme&lt;/h3&gt;
&lt;blockquote&gt;
  &lt;ul&gt;
    &lt;li&gt;Fork the &lt;a href=&quot;https://github.com/thedevslot/WhatATheme/tree/master&quot; target=&quot;blankl&quot;&gt;repository&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;Go to repository settings and set Github Pages source as master.&lt;/li&gt;
    &lt;li&gt;Your new site should be ready at &lt;a href=&quot;#&quot; target=&quot;blank&quot;&gt;https://username.github.io/WhatATheme/&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
&lt;/blockquote&gt;

&lt;h3 id=&quot;step-2---making-changes-via-_configyml&quot;&gt;Step 2 - Making changes via &lt;strong&gt;_config.yml&lt;/strong&gt;&lt;/h3&gt;
&lt;blockquote&gt;
  &lt;ul&gt;
    &lt;li&gt;Open _config.yml file&lt;/li&gt;
    &lt;li&gt;Fill the available details accordingly&lt;/li&gt;
    &lt;li&gt;Commit the changes&lt;/li&gt;
  &lt;/ul&gt;
&lt;/blockquote&gt;</content><author><name></name></author><category term="how to" /><category term="setup" /><category term="theme" /><summary type="html">What is WhatATheme? You’ll find this post in your _posts directory. Go ahead and edit it and re-build the site to see your changes. &amp;gt;You can rebuild the site in many different ways, but the most common way is to run bundle exec jekyll serve, which launches a web server and auto-regenerates your site when a file is updated. WhatATheme is a customizable Jekyll Portfolio theme which supports blogging. You can use this theme in order to create an elegant, fully responsive portfolio which includes Home Page - A Hero section - A section where you can outsource an image which will work as the background for the particular section; it also will include your name and a tagline which can be easily manipulated via the _config.yml file. An About section - A section where you can include your image and a 60 word paragraph which again you can easily manipulate using the _config.yml file. A Contact section - A section where you can include 3 direct ways to contact Ping on Messenger Send an Email Tweet on Twitter The contact section will also include 10 different social media buttons for your audience to follow. Facebook, Twitter, Instagram, LinkedIn, GitHub, YouTube, Reddit, Behance, Dribbble &amp;amp; Spotify. Blog - The blog includes a horizontal card list where the latest articles are fetched from the _posts folder automatically in top-down format. It also includes an instant search box which matches your query from the title, description &amp;amp; content of your post and shows the result as soon as you type. The blog card includes Post Title 300 words from the content of the post The publish date The time which will be required to read the post. Projects - The Projects page will include all the projects from the projects.yml file which is present in the _data folder. Projects will be showcased in a card-list format where each card will contain An image related to the project A Project Title A Project Description of about 80 words Footer - The footer includes A small about the author widget which show the same Author Image as mentioned in the about section of the Home page which includes Name of the Author, Around 75 words about the author. A more link widget which includes a link to any extra page that you’ve created and a Subscribe via RSS link. A Recent posts widget which will include latest 3 posts. Extra Features - WhatATheme comes pre installed with HTML Compressor - It’ll compress all the pages by removing any extra space or blank lines. Google Analytics - A web analytics service offered by Google that tracks and reports website traffic. For more information click here. Disqus - A worldwide blog comment hosting service for web sites and online communities that use a networked platform. For more information about Disqus click here ##### For more information about WhatATheme click here. Installation Step 1 - Setting up WhatATheme Fork the repository Go to repository settings and set Github Pages source as master. Your new site should be ready at https://username.github.io/WhatATheme/ Step 2 - Making changes via _config.yml Open _config.yml file Fill the available details accordingly Commit the changes</summary></entry><entry><title type="html">What is Jekyll? How to use it?</title><link href="/blog/what-is-jekyll-how-to-use-it" rel="alternate" type="text/html" title="What is Jekyll? How to use it?" /><published>2018-04-21T00:00:00+10:00</published><updated>2018-04-21T00:00:00+10:00</updated><id>/blog/what-is-jekyll-how-to-use-it</id><content type="html" xml:base="/blog/what-is-jekyll-how-to-use-it">&lt;p&gt;Jekyll is a simple, blog-aware, static site generator perfect for personal, project, or organization sites. Think of it like a file-based CMS, without all the complexity. Jekyll takes your content, renders Markdown and Liquid templates, and spits out a complete, static website ready to be served by Apache, Nginx or another web server. Jekyll is the engine behind GitHub Pages, which you can use to host sites right from your GitHub repositories and if you don’t know what GitHub Pages are you can visit on click &lt;a href=&quot;https://help.github.com/en/github/working-with-github-pages/about-github-pages&quot; target=&quot;blank&quot;&gt;here&lt;/a&gt; or &lt;a href=&quot;https://pages.github.com/&quot; target=&quot;blank&quot;&gt;here&lt;/a&gt;&lt;/p&gt;
&lt;h6 id=&quot;source--jekyll-docs&quot;&gt;Source : &lt;a href=&quot;https://jekyllrb.com/docs/&quot;&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Jekyll Docs&lt;/code&gt;&lt;/a&gt;&lt;/h6&gt;

&lt;blockquote&gt;
  &lt;h3 id=&quot;to-know-more-and-get-started-with-jekyll-you-can-click-here&quot;&gt;To know more and get started with Jekyll you can click &lt;a href=&quot;https://jekyllrb.com/&quot; targe=&quot;_blank&quot;&gt;here&lt;/a&gt;&lt;/h3&gt;
&lt;/blockquote&gt;

&lt;h1 id=&quot;installation&quot;&gt;Installation&lt;/h1&gt;
&lt;p&gt;&lt;strong&gt;Jekyll is a Ruby Gem that can be installed on most systems.&lt;/strong&gt;&lt;/p&gt;
&lt;h3 id=&quot;requirements&quot;&gt;Requirements&lt;/h3&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://www.ruby-lang.org/en/downloads/&quot; target=&quot;_blank&quot;&gt;Ruby&lt;/a&gt; version 2.5.0 or above, including all development headers (ruby version can be checked by running ruby -v)&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://rubygems.org/pages/download&quot; target=&quot;_blank&quot;&gt;Ruby Gems&lt;/a&gt; (which you can check by running gem -v)&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://gcc.gnu.org/install/&quot; target=&quot;_blank&quot;&gt;GCC&lt;/a&gt; and &lt;a href=&quot;https://www.gnu.org/software/make/&quot; target=&quot;_blank&quot;&gt;Make&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3 id=&quot;after-installing-the-requirements-you-can-follow-these-guides&quot;&gt;After Installing the Requirements you can follow these guides:&lt;/h3&gt;
&lt;p&gt;&lt;strong&gt;For detailed install instructions have a look at the guide for your operating system.&lt;/strong&gt;&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/installation/macos/&quot; target=&quot;_blank&quot;&gt;macOS&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/installation/ubuntu/&quot; target=&quot;_blank&quot;&gt;Ubuntu&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/installation/other-linux/&quot; target=&quot;_blank&quot;&gt;Other Linux Distros&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://jekyllrb.com/docs/installation/windows/&quot; target=&quot;_blank&quot;&gt;Windows&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h3 id=&quot;creating-a-new-jekyll-site&quot;&gt;Creating a new Jekyll site&lt;/h3&gt;
&lt;p&gt;&lt;strong&gt;We can create a new Jekyll site just by a simple command:&lt;/strong&gt;&lt;br /&gt;&lt;/p&gt;
&lt;blockquote&gt;
  &lt;h1 id=&quot;jekyll-new-my-site&quot;&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;jekyll new my-site&lt;/code&gt;&lt;/h1&gt;
&lt;/blockquote&gt;

&lt;p&gt;Jekyll will create a new directory named as &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;my-site&lt;/code&gt; which is customizable (i.e., you can change the name from &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;my-site&lt;/code&gt; to anything you want for example &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;jekyll new brutus&lt;/code&gt;).&lt;/p&gt;

&lt;h3 id=&quot;changing-into-the-directory&quot;&gt;Changing into the Directory&lt;/h3&gt;
&lt;p&gt;&lt;strong&gt;We have to go inside the directory:&lt;/strong&gt;&lt;br /&gt;&lt;/p&gt;
&lt;blockquote&gt;
  &lt;h1 id=&quot;cd-my-site&quot;&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;cd my-site&lt;/code&gt;&lt;/h1&gt;
&lt;/blockquote&gt;

&lt;p&gt;Again, &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;my-site&lt;/code&gt; is just a random name which is customizable.&lt;/p&gt;

&lt;h3 id=&quot;building-the-site-and-making-it-available-on-a-local-server&quot;&gt;Building the site and making it available on a local server&lt;/h3&gt;
&lt;blockquote&gt;
  &lt;h1 id=&quot;bundle-exec-jekyll-serve&quot;&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;bundle exec jekyll serve&lt;/code&gt;&lt;/h1&gt;
&lt;/blockquote&gt;

&lt;h3 id=&quot;browsing-your-jekyll-site&quot;&gt;Browsing your Jekyll site&lt;/h3&gt;
&lt;blockquote&gt;
  &lt;h1 id=&quot;browse-to-httplocalhost4000&quot;&gt;Browse to &lt;a href=&quot;http://localhost:4000/&quot; target=&quot;_blank&quot;&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;http://localhost:4000/&lt;/code&gt;&lt;/a&gt;&lt;/h1&gt;
&lt;/blockquote&gt;

&lt;h6 id=&quot;on-encountering-any-problem-while-building-and-serving-your-jekyll-site-you-can-consider-visiting-to-the-troubleshooting-page&quot;&gt;On encountering any problem while building and serving your Jekyll site you can consider visiting to the &lt;a href=&quot;https://jekyllrb.com/docs/troubleshooting/#configuration-problems&quot; target=&quot;_blank&quot;&gt;troubleshooting&lt;/a&gt; page&lt;/h6&gt;</content><author><name></name></author><category term="jekyll" /><category term="informative" /><category term="technology" /><summary type="html">Jekyll is a simple, blog-aware, static site generator perfect for personal, project, or organization sites. Think of it like a file-based CMS, without all the complexity. Jekyll takes your content, renders Markdown and Liquid templates, and spits out a complete, static website ready to be served by Apache, Nginx or another web server. Jekyll is the engine behind GitHub Pages, which you can use to host sites right from your GitHub repositories and if you don’t know what GitHub Pages are you can visit on click here or here Source : Jekyll Docs To know more and get started with Jekyll you can click here Installation Jekyll is a Ruby Gem that can be installed on most systems. Requirements Ruby version 2.5.0 or above, including all development headers (ruby version can be checked by running ruby -v) Ruby Gems (which you can check by running gem -v) GCC and Make After Installing the Requirements you can follow these guides: For detailed install instructions have a look at the guide for your operating system. macOS Ubuntu Other Linux Distros Windows Creating a new Jekyll site We can create a new Jekyll site just by a simple command: jekyll new my-site Jekyll will create a new directory named as my-site which is customizable (i.e., you can change the name from my-site to anything you want for example jekyll new brutus). Changing into the Directory We have to go inside the directory: cd my-site Again, my-site is just a random name which is customizable. Building the site and making it available on a local server bundle exec jekyll serve Browsing your Jekyll site Browse to http://localhost:4000/ On encountering any problem while building and serving your Jekyll site you can consider visiting to the troubleshooting page</summary></entry></feed>