Our public website made by members.
Go to file
2022-05-27 14:10:49 +02:00
app Merge pull request #7 from biobulkbende/survey 2022-05-27 14:10:49 +02:00
gulp/templates Completed automatic sprite generation (not logo and icon-1) 2020-10-21 17:43:28 +02:00
.gitignore dutch index and en version 2020-11-24 17:56:41 +01:00
compose.yml Revert "Remove compose config out of repo" 2021-05-22 09:00:41 +02:00
Dockerfile Use serve instead 2020-11-25 09:33:31 +01:00
gulpfile.js more info on the website and how it works 2021-05-26 11:53:59 +02:00
package-lock.json Added a Tripetto form 2022-05-27 11:07:02 +02:00
package.json everything moved in app 2021-05-26 10:55:18 +02:00
README.md Fix README with new deets 2021-08-11 13:46:25 +02:00
webpack.config.js Run formatter, work out README further 2020-11-23 10:57:52 +01:00

biobulkbende.org

https://biobulkbende.org

Our public website made by members.

Hacking

  • Make sure you have installed git, node.js and npm
  • Clone this repo: git clone https://github.com/biobulkbende/biobulkbende.org
  • From within the folder install all packages: npm install
  • Run gulp for automation: gulp watch

Structure

The website is served from the folder /app

The folder /assets is only for developement while the folde /bundle contains the files linked to index.html and /en/index.html

Html

There are two pages:

  • index.html (Dutch)
  • /en/index.html (English)

Changes to the text can be done directly to these files without having to run any automation.

(S)CSS

The CSS files to be changed are stored in /assets/scss which contains:

  • /base (global CSS declarations)
  • /modules (specific CSS declarations)

The CSS is written in SCSS and after changing it must be compiled and bundled togheter. The command gulp watch runs automation and make sure that when you save the change in atuomatic everything is compiled and bundled. The final file is stored in /bundle/styles and provide the CSS to index.html and /en/index.html.

JS

The JS file to be changed are stored in assets/js/modules The JS is writted in ES6 and after changing it must be compiled in ES5 and bundled togheter. The command gulp watch runs automation and make sure that when you save the change in atuomatic everything is compiled and bundled. The final file is stored in /bundle/scripts and provide the JS to index.html and /en/index.html.

Media

The media are stored in /assets/media containing:

  • Icons
  • Fonts
  • Images

Icons are compressed in a sprite through the command gulp icons. (This is complicated as it generates a single sprite with all the icons togheter and a CSS which points at the right icon in the sprite). After this command automation for the CSS must be runned. Images are minified through the command gulp images. All the media are copied with the command gulp copyMediaInBundle (it also minified the images) into the folder /bundle/media which provide the media to index.html and /en/index.html.

If you want to change an Image you have to put it in /assets/media/images and run gulp copyMediaInBundle. The html must refer to the image that has been copied and minified in /bundle/media/images.

Video

The video is stored on vimeo.