INTRO
In this tutorial, we will get to know a way to how hackers create their website. This method is mostly used by CTF players who need to publish their writeups of CTF challenges. I have seen this almost on all websites of CTF players. it is basically used when you need to make a simple blog where you will post some articles but not on daily basics. it is used by Netflix, Spotify and some other famous websites. you can check it out yourself from HERE. well, you can do this via Jekyll.
Jekyll is a static site generator. You give it text written in your favorite markup language and it uses layouts to create a static website. You can tweak how you want the site URLs to look, what data gets displayed on the site, and more.
by the way, it is written in Ruby. you can call it Falsk of the Ruby. but before you leave this post, I would love to say that there is no need to learn Ruby to use Jekyll. until you want to make a Jekyll plugin of your own. But I assure you that you won’t need to make a plugin. there are already a lot of plugins that you can use on your website.
CREATION
Before going furthermore on this topic, I would like to say with honesty that I have learned Jekyll from its official documentation. They are providing very nice documentation which is created by Jekyll itself.
Let’s go to the official Jekyll website. you can find things and read docs there. but anyway, to use Jekyll, we will need Ruby. Type this command to install Ruby:
apt install ruby
It is not necessary, because almost every Linux has Ruby pre-installed. but installing Jekyll and Bundler is a necessary step. Type this command:
gem install bundler jekyll
Screenshot:
For your curiosity, gem is basically ‘pip‘ of Ruby language. you can install Ruby packages via gem.
Now that you have installed it. I would like to introduce you to the files of a Jekyll website. it is like a filesystem of Linux. or better example, files of Flask if you have ever made a website with Flask.
——————————————————————————————————————————————-
_layout -> when you need a default HTML/CSS/Javascript code for every page but you don’t want you to write it for every page. this folder contains such codes.
_include -> when you need some code for some special pages. for example, you have created a contact page for your website and you need to include code to for sending an email. maybe or maybe not, you will need this email submitting code for any other page. you can store such code in the _include folder.
_posts -> this is the folder where we will write our posts. it matters most in all files and folders.
assets -> you can store images, GIFs, and other media related things in this folder.
_config.yml -> it is a file where you will define author names, a plugin that is being used in the website, theme of the website, and some other unnecessary stuff for a hacker.
——————————————————————————————————————————————-
Now let’s move on to some basics commands of Jekyll.
Type this command to see the help menu of Jekyll:
jekyll --help
Screenshot:
If you want to create a default theme-based website, you can use this command:
jekyll new <path>
Screenshot:
Now go to the folder you have created. you will see that there are some files that I have explained above.
you can run this command in website folder to see how it really looks in a browser:
bundle exec jekyll serve
Screenshot:
it seems good at default theme. but we can make it more beautiful with other themes. you can use –port flag with the command to run the website on a special port.
Type this command:
bundle exec jekyll serve --port 80
Screenshot:
If you also use –host to choose the hostname on which you want to start the site.
type this command:
bundle exec jekyll serve --port 80 --host kingkong.pop
there are some other flags that might be useful for you while creating running your own website.
Visit it here –> LINK
well, I don’t want to make this long and boring. because I know you guys never my read long articles, I have seen your response. so, I guess, I will make part 2 of this post. I am ending it right here.
Thanks For Visiting.
