How to build your webpage using Jekyll
Hi there! This is my first post! Welcome to everyone…
…I’m starting the blog posting about how I built this webpage. However, this doesn’t intend to be a follow along tutorial. For that there are already a lot of resources, and here I will give you some links to them.
So, let’s start with the idea… I wanted a web to show up my projects. I always wanted to develop some cool ideas, but I didn’t had the time (too much TV shows…). Building this webpage it’s the first step to finish some of the projects I had in mind for a very long time. I read in twitter some “new year’s resolution” about finishing what you started… and I realized that I needed to address that problem. These were the steps I followed:
1. Using GitHub
I decided to host my webpage at GitHub, because it was very convenient. Here you can obtain more information.
2. Searching for a design
I wanted some inspiration so I began by googling: “personal web-pages”, “technical personal web”, “github personal page”… I found the personal website of Yevgeniy Brikman. I liked a lot, so I cloned it. However I had never been heard about Jekyll, and I didn’t know how to adapt their project to my website. So I decided to start from the beginning.
3. What is Jekyll?
Jekyll is a website generator developed in Ruby. It generates static websites, that works specially well with blogs, without needing a database. It uses Markdown, Liquid, HTML and CSS mainly, so it is easy to use. Additionally, you have a lot of additional resources available by the community, like themes and plugins. I was already convinced, so I jumped into learning a little bit more:
- I installed Jekyll: https://jekyllrb.com/docs/installation/
- Currently, I’m on Windows, but I use the Ubuntu Subsystem. In order to make it work I had to disable IPv6.
- After that, I followed the Quickstart tutorial: https://jekyllrb.com/docs/
- And the Step by Step tutorial, that one was specially useful: https://jekyllrb.com/docs/step-by-step/01-setup/ When I finished reading/doing those tutorials I felt more confident about Jekyll, so I jumped into creating my own website project.
4. Creating the website
As I said, I used GitHub as hosting, so I created my git repository. I chose the minima theme, the default Jekyll theme. I worked from it, changing what I wanted, having in mind the Yevgeniy Brikman website that I liked. At this point you need to know a little bit of HTML and CSS, but with a little bit of effort everything is possible.
And that’s all for today! I will continue to improve this website, and posting new things soon. I hope you find this post useful!! See you in a while, crocodile!!
