Pizza Website

Backlogg: https://docs.google.com/spreadsheets/d/131Dxy4QplduNJaxo41rS0nOelqbk0bQTxoG1y0TOsho/edit#gid=0

Website: https://fantastic4group.gitlab.io/pizza-website (GitLab pages is used to host this website)

Coding Conventions

Spaces: 4
Comments: English, space between // and the comment, capitalized.
Namngivning: Engelska, Klasser med storbokstav (UpperCamelCase)
Variable naming: CSS/HTML: kebab-case, JS: camelCase, classes: UpperCamelCase, Python: snake_case
HTML/CSS: Only use inline CSS with JavaScript actions.

Programming Languages

HTML 5
CSS 3
Javascript (ECMAScript 2018)
Python 3.8.2

Development environment

Editor - Personal preference

Version Control Host - GitLab
OS - WSL/Ubuntu
Browsers - Firefox
Tests - Python selenium library with the unreleased version 4
Static validation - HTML Validator, CSS Validator
Documentation - English
Git Branches

• Branch names should use kebab-case.
• Needs to be approved by at least 2 members of the group, besides the marge request creator.

Git Command Reference - https://about.gitlab.com/images/press/git-cheat-sheet.pdf

Definition of Done

• All code, content, and documentation should be read and approved by all group members onsite.
• Approved by the group, both and code structure. All code needs to follow the standards we have in place.
• Get feedback from group members.
• Tests should be green.
• The code shall be documented.
• Everyone in the group shall understand the code.
• Allt ska vara presenterbart.
• Everything shall be presentable. (If it's frontend)
• All documents shall cover the whole sprint.

Compiling

Compile the website

1. First you need to install the dependencies with the following commands: (if firefox-esr does not exist on your distro, use firefox)

apt update && sudo apt upgrade && sudo apt install -yqq curl jq sudo firefox-esr ruby-full build-essential zlib1g-dev
gem install jekyll bundler jekyll-less therubyracer

1. With the dependencies installed, to compile/run the website you can run:

# To compile the website
jekyll build -s site -d public
# To compile and run webserver
jekyll serve -s site -d public -P 8080

Test Documentation

How to run the tests

1. Jekyll needs to compile the code.
2. A webserver needs to run the directory containing the compiled site, this can be done with jekyll, or with python3 -m http.server --directory=public. (What webserver you use does not matter)
3. Go to the tests folder, cd tests/webtests
4. Install required dependencies with pip3 install selenium==4.0.0a6.post2 requests
5. Now simply run python3 -m unittest

How to add a new test

1. Head to the tests directory with cd tests/webtests
2. Here you can create a new file with the name prefix test_ (e.g test_example.py)
3. Inside your file you can create a test with this template:

from selenium import webdriver
from selenium.webdriver.common.by import By
from web_test_base import WebTestBase
class ExampleTest(WebTestBase):
    def test_example(self):
        driver = self.driver
        driver.get(self.WEBSITE_URL)

1. When you save this file you can simply run all tests with python3 -m unittest or to run a specific with python3 -m unittest test_example

Automatic screenshots

1. Run a webserver like described earlier in this document.
2. Go to the folder tests and run ./screenshots.py
3. The script will then create a new folder called screenshots containing the different pages with different resolutions, including full pages.

Static validation

1. Compile the website as described earlier. (No need to run it)
2. Run the following commands to validate CSS and HTML:

./tests/validators/css_validator.sh public
./tests/validators/html_validator.sh public

CI/CD

CI/CD will run all these tests and validations automatically before deploying, please refer to the .gitlab-ci.yml file for more information.

Various licenses this project use

• Fonts are from Google Fonts.
• All images are either from the owner or Unsplash.