biobulkbende.org/README.md

64 lines
2.4 KiB
Markdown
Raw Normal View History

2020-11-23 09:57:52 +00:00
# biobulkbende.org
2020-09-16 12:23:28 +00:00
2020-11-23 09:57:52 +00:00
> https://biobulkbende.org
2020-09-16 13:03:32 +00:00
2021-08-11 11:46:25 +00:00
Our public website made by members.
2020-11-23 09:57:52 +00:00
## Hacking
2020-09-16 13:03:32 +00:00
2020-11-23 09:57:52 +00:00
- 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`
2021-05-22 06:57:59 +00:00
## Structure
2021-05-26 09:59:11 +00:00
The website is served from the folder `/app`
2021-05-26 09:59:11 +00:00
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:
2021-08-11 11:46:25 +00:00
2021-05-26 09:59:11 +00:00
- `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:
2021-08-11 11:46:25 +00:00
2021-05-26 09:59:11 +00:00
- /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.
2021-05-26 09:59:11 +00:00
The final file is stored in `/bundle/styles` and provide the CSS to `index.html` and `/en/index.html`.
### JS
2021-05-26 09:59:11 +00:00
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.
2021-05-26 09:59:11 +00:00
The final file is stored in `/bundle/scripts` and provide the JS to `index.html` and `/en/index.html`.
### Media
2021-05-26 09:59:11 +00:00
The media are stored in `/assets/media` containing:
2021-08-11 11:46:25 +00:00
2021-05-26 10:12:28 +00:00
- 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`.
2021-05-26 09:59:11 +00:00
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`.
2021-05-26 09:59:11 +00:00
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.