Hola amigos!
Hope you learnt something new in my previous post- How to deploy your Jekyll Website on Github pages.
This post is also a HOWTO Tutorial in which I will help you to write your first post on your Jekyll static site on Github.
➜ We learnt how to install Jekyll with the help of ruby installer using Git.
➜ We learnt how to deploy your Jekyll site on GitHub pages using Git.
➜ This time we will learn how to deploy your first post/project on the Jekyll site using git.
NOTE: Now before writing posts on Jekyll, you must know about the files and folder present in the Jekyll blog folder that is actually stored on your system.
➜ _post - This folder will contain all our posts.
➜ _site - This folder will contain the final/finished version of our blog.
➜ Index.html -It is the home page of our website.
➜ Gemfile - This file will store all the dependencies for our blog.
NOTE: Each page on Jekyll site contains FRONT MATTER.
FRONT MATTER contains the information like when the page was created, its title, author etc. So it basically gives info about our page.
Lets write our first post!
For this you need:
⚡ Github account
⚡ Jekyll blog -If you want to create your demo Jekyll blog/ static site. Then refer to my previous post.
⚡ Git installed on your system.
➜ So hope you have created your Jekyll blog with the help of my previous tutorial.
➜ Now switch to the folder where you want to do your complete work. So I will be switching to my Documents folder._
cd Documents
➜ Then again, switch to the blog folder- vikasblog
cd vikasblog
➜ Open the vikasblog folder using your text editor.
➜ Create a new file within -post folder.
➜ Properly edit the Front matter. Add the content you want in your post.
➜ Save this folder as .markdown extension
Example: newpost.markdown
➜ Now open Git and switch to the blog folder
cd Documents
cd vikasblog
cd _post
➜ Switch to the GitHub pages branch
git checkout gh-pages
➜ Stage the changes.
git add .
➜ Commit the changes
git commit -m "first-commit"
NOTE: Meanwhile you can check the status of the current repository.
git status
with git log, you can check the entire history of the current repo.
➜ Finally, push the changes.
git push origin [branch-name]
git push origin gh-pages
➜ Now use this command to see your new post on your localhost 4000
jekyll serve
➜ Now go to this address to see your first Jekyll post.
Link: (https://localhost:4000/)
Now you can see your Jekyll blog on localhost: 4000. Congrats, we did it together. If you get stuck on any point, ask in the comments sections.
Connect with me on
Instagram
https://www.instagram.com/p/CFqrvobFlsL/?igshid=j3lhn2qi3og0
Top comments (0)