How to Start with GitHub Pages Using Jekyll

Nov 9, 2023 | Programming

Welcome to your journey of creating and managing a website using GitHub Pages and Jekyll. In this article, we’ll guide you through the steps required to get started, troubleshoot common setup issues, and add your contributions.

Getting Started with Jekyll

Starting with Jekyll is as easy as pie! Here’s how you can set up your environment:

  • First, ensure you have the correct version of Ruby installed according to the .ruby-version file in your repository.
  • Next, install the bundler gem to manage Ruby project dependencies.
  • Run these commands in your terminal:
bundle install
bundle exec jekyll serve --watch

Finally, open your browser and navigate to http://localhost:4000 to view your newly created site!

Updating or Adding New Tutorials

If you’re looking to just update or add new tutorials, you only need to follow the above steps again, and your changes should be reflected seamlessly.

Making Structural Changes

Do you wish to modify the site’s JavaScript files? Follow these steps:

  • Install Node if you haven’t done so.
  • Run the following commands:
npm install
gulp

Now, go to http://localhost:4000/test/spec_runner.html to run your tests. Ensure they are all passing (green).

How the Code Works: A Fun Analogy

Imagine you are a chef in a kitchen:

  • The bundle install command is like gathering all your ingredients, making sure you have everything you need to create a delicious dish.
  • The command bundle exec jekyll serve --watch is akin to setting the oven to the right temperature and keeping an eye on it as your food cooks.
  • By navigating to http://localhost:4000, you’re checking if your dish is ready to be served to guests, giving you a preview of your website!

Troubleshooting Tips

If you run into issues during the setup or while serving your pages, consider the following:

  • Check if you have the correct version of Ruby and Bundler installed. Sometimes, version mismatches can cause friction.
  • Ensure Node.js is correctly installed if you’re attempting to change JavaScript files.
  • If the site doesn’t appear as expected in the browser, try clearing your browser cache.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

Contributing to the Project

Have suggestions or corrections? You’re encouraged to contribute! Head over to the issues page to report or discuss changes.

The Structure of Tutorials

When creating tutorials, they should:

  • Align with clear objectives and goals.
  • Follow a repetitive structure to reinforce learning.
  • Focus on one new concept at a time to avoid overwhelming students.

Your Environment Setup with RVM

Alternatively, if you prefer, you can manage dependencies using RVM. Here’s how:

rvm install 2.2.1  # within codebar-tutorials folder
rvm gemset use codebar-tutorial --create
gem install bundler -v 1.17.3
bundle install
jekyll serve  # Visit http://127.0.0.1:4000

Remember, modifying JavaScript files will also require Node.js.

Final Thoughts

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.

Stay Informed with the Newest F(x) Insights and Blogs

Tech News and Blog Highlights, Straight to Your Inbox