gtk-web

gtk-web

šŸ§ My GSoC'19 Project: GNOME Toolkit's Official Website | Original Project on Gitlab

GTK's Official Website

The source for the GTK website

About

GTK.org is a official website for GTK Project. The site is developed with and maintained using Jekyll, a Static Site Generator developed with Ruby. The site uses following types of files for the content generation:

  • HTML files with extension .html
  • Markdown files with extension .md

The data used by the site is stored in the form of following files:

  • YAML files with extension .yml
  • JSON files with extension .json

Project Structure

...
ā”œā”€ā”€ _data                               #contains site's data files
ā”‚   ā”œā”€ā”€ apps.yml                        #list of apps to show on index.html slider section
ā”‚   ā”œā”€ā”€ navigation.yml                  #links to be added to the site's header and footer sections
ā”‚   ā”œā”€ā”€ sample_codes.yml                #codes for language bindings
ā”‚   ā””ā”€ā”€ labels.json
ā”œā”€ā”€ _includes                           #contains site's include files
ā”‚   ā”œā”€ā”€ footer.html                     #the footer of the site
ā”‚   ā”œā”€ā”€ header.html                     #the meta data of the site
ā”‚   ā””ā”€ā”€ navbar.html                     #the navbar of the site
ā”œā”€ā”€ _layouts                            #contains layout designs for site's pages
ā”‚   ā””ā”€ā”€ documentation.html              #layout design for pages that belong to GTK documentation
ā”œā”€ā”€ .gitlab                             #contains gitlab template files for bugs and merge requests
ā”œā”€ā”€ assets                              #contains site's valuable entities
ā”‚   ā”œā”€ā”€ font                            #contains site's font: Red Hat Display
ā”‚   ā”œā”€ā”€ img                             #contains site's images and illustrations
ā”‚   ā””ā”€ā”€ scss                            #contains site's preprocessor stylesheets
ā”‚       ā”œā”€ā”€ colorful.scss               #stylesheet for syntax highlighting
ā”‚       ā”œā”€ā”€ index.scss                  #stylesheet for user defined styles
ā”‚       ā”œā”€ā”€ markdown.scss               #stylesheet for styling the markdown content
ā”‚       ā””ā”€ā”€ theme.scss                  #stylesheet for website's theme. Generated from Bootstrap
ā”œā”€ā”€ _pages                              #contains site's main pages
ā”œā”€ā”€ _docs                               #contains pages for GTK documentation
ā”œā”€ā”€ _config.yml                         #contains Jekyll settings for the site
ā”œā”€ā”€ .gitignore
ā”œā”€ā”€ .gitlab-ci.yml                      #for Gitlab Continuous Integration and Deployment
ā”œā”€ā”€ 404.html
ā”œā”€ā”€ CODE_OF_CONDUCT.md
ā”œā”€ā”€ CONTRIBUTING.md
ā”œā”€ā”€ Gemfile                             #contains gem dependencies for the site.
ā”œā”€ā”€ Gemfile.lock
ā”œā”€ā”€ LICENSE.txt
ā”œā”€ā”€ package-lock.json
ā”œā”€ā”€ package.json                        #contains node dependencies for the site.
ā”œā”€ā”€ README.md
ā”œā”€ā”€ setuid.html                #referenced in code, **cannot be moved**
ā””ā”€ā”€ setup.sh                            #script for setting up the website

Contributing

We always welcome people who want to contribute towards our project. For suitable information on how can you contribute to the website, on how to report bugs, on how to request new features or anything that can make the website a better experience for the end users, please read on how to contribute.

Setup the website locally

To get the site up and running locally, follow the below steps:

  1. Install a full Ruby development environment.
  2. Create a local clone of the website:
git clone https://gitlab.gnome.org/Infrastructure/gtk-web.git
  1. Change into the gtk-web directory
cd gtk-web
  1. Perform the following commands to install dependencies and structure the website properly:
chmod +x setup.sh && bash setup.sh
  1. Build the site and make it available on your local server
$ bundle exec jekyll serve
  1. Browse to http://localhost:4000 to view the website.

Dependencies

GTK.org relies on the dependencies as well. These dependencies are provided in the Ruby Gemfile or NPM's package.json. Following table shows the list of dependencies used by this project:

Package Version File Source
bootstrap 4.6.0 [package.json][package.json] Github
@fortawesome/fontawesome-free 5.15.3 [package.json][package.json] Github
jquery 3.6.0 [package.json][package.json] Github
popper.js 1.16.1 [package.json][package.json] Github
slick-carousel 1.8.1 [package.json][package.json] Github
moment 2.29.1 [package.json][package.json] Github
node-sass 5.0.0 [package.json][package.json] Github
html-minifier 4.0.0 [package.json][package.json] Github
jekyll 4.0.1 [Gemfile][gemfile] Github

Read about adding/updating/removing dependencies on how to contribute.

Pipeline

The pipeline used by the website is the top-level component of continuous integration, delivery, and deployment.

The pipeline defined by the GTK.org uses the Ruby2.5 image. The pipeline consists of a script that runs before the site is tested/deployed. The script that runs before the test/deployment of the website basically installs all the gem/npm dependencies, fetches the API data regarding the GTK from its gitlab instance and then structurizes the website before testing/deploying.

test stage is performed on all branches but master. deploy stage on the other hand is performed only on master branch.

Maintainers

You can reach out to the following individuals if you have any doubt or suggestion regarding the GTK.org:

Ravgeet Dhillon

  • You can contact me via my email or through my website.
  • You can also find me on IRC. I am ravgeetdhillon on irc.gnome.org in the #gtk or #gnome-hackers channels.

Emmanuele Bassi

  • You can contact me via my email.

Code of Conduct

GTK is an open source project with a contributor community that spans across the globe. We want everyone in our community to feel safe and encourage the participation of people from all forms of backgrounds, regardless of experience level, age, gender, identity, race, religion, or nationality. We expect all contributors to uphold the Code of Conduct.

License Information

GTK.org is licensed under the Creative Commons BY-SA-4.0.

jekyll logo

Want a Jekyll website built?

Hire a Jekyll developer