Edit PUG files only
Don't edit the HTML files of the website directly! Instead, you have to update the PUG version of the pages and then generate the new HTML pages following the instructions on this page.
Check out the website from Git:
Note, that all the commits to the master branch update the production version of the website (https://ignite.apache.org) on-the-fly. Thus, we encourage all website contributors to set up a local version and check changes before pushing anything into production. Contributors have to send pull-requests through the Git repository. Committers should send changes at least for a post-commit review to the website maintainers ( Mauricio Stekl ).
The task-manager gulp.js (https://gulpjs.com/) is already set in the Apache Ignite Repository. If a new person starts working, they need to do the following:
- Clone Apache Ignite Repository;
- Install node.js, version 13.2 or later (support for ES-imports is needed) and npm;
- Install the gulp cli utility globally with the `
npm install --global gulp-cli` command (version 2.3.0 or later is required);
- Go to the root directory of the repository and install all dependencies with `
npm install` command;
- Run the development with the `
When the gulp command is run, the following will occur:
- All pug files of pages are recompiled;
- The local server at
localhost:3000 will be launched, and the browser will open;
- File-change tracking with automatic recompilation and live-reload will be activated (BrowserSync - https://browsersync.io/ is used).
- Page code is in the /_src folder. Files with the «.pug» extension are written using the PUG preprocessor, https://pugjs.org/. It allows embedding certain files inside others, prevents repetition of the same code on different pages, and also removes the need to keep track of HTML validity and formatting. When the site is under development and the pug files are being updated, gulp automatically compiles these files into html, saving the name and path to the root folder. The local server with live-reload works in this folder.
- The images are in the /img folder.
To build a website, run the `
gulp build` command. This recompiles all the pug files in the /_src folder and saves them in the root directory of the project.
Old code from the current branch has also been moved to the /build folder, namely the folders:
These folders and files are there as is, they are ignored when building the site with the gulp build command.
The tables with download links can be found in
Upcoming events are edited in the source code in /_src/events.pug. During development or when building, the code is compiled into /events.html
Past events are a little more complicated. Since there were more than 300 events on your website, we parsed all the content and decided to structure it as json arrays. The /_src/_components/events/ folder contains several pug files named according to the year. The json array is located at the top of these files. Each element of the array is a js-object. It has title, link, loc, speaker and data properties. Each element of the array is converted into a separate card of the past event. By analogy, you can add new objects to these arrays. Then, when compiling the files, they will automatically appear in the desired tabs.
/_src/_blog/ - blog post pages. After running the build command, the codes are compiled into *.html files and stored into /blog/ folder.
/_src/_components/templates - layouts that are used to create the blog pages
All blog posts must have front matter attributes.
title: "Blog post’s title"
author: "Blog post’s author"
date: YYYY-MM-DD (published date)
The full blog post will be displayed by default. If you want to show only a summary of this post on the blog list page, please use a special tag
<!-- end -->
You can add it anywhere in your blog post and everything before this tag will be displayed as a summary.
In addition to the standard commands (gulp build, gulp watch), we have added an additional one to speed up the development process:
It will generate ONLY blog pages.
Use the gulp sitemap command to update the sitemap - ./sitemap.xml file if necessary. Currently, the main pages, as well as the documentation from the /docs/2.11.0/ folder, get into the sitemap. The paths to the documentation files are transformed into /docs/latest/ and all the html files inside have the .html extension removed. If you want to change the documentation version in the sitemap, change the sitemap() code in the ./gulpfile.js file.