Skip to content

Clean code s1e1#1

Open
ksarise wants to merge 22 commits into
mainfrom
clean-code-s1e1
Open

Clean code s1e1#1
ksarise wants to merge 22 commits into
mainfrom
clean-code-s1e1

Conversation

@ksarise

@ksarise ksarise commented Jan 6, 2024 •
edited
Loading

Copy link
Copy Markdown
Owner
  1. Task "Clean Code S1E1"
  2. Screenimage
  3. Deploy
  4. Done 07.01.2024 / deadline 09.01.2024
  5. Score 45/45

HTML & CSS. Beginner level: +30

  • Basic rule 1.1. Indentation: implemented in the whole project. Two spaces are used for one indentation. Tabs are not used. The two indentation types (tabs and spaces) are not mixed together. +2
  • Basic rule 1.2. Use lowercase: implemented in the whole project. All HTML-tags, attributes and their values, CSS selectors, CSS properties and their values must be in lowercase. <!DOCTYPE html> is an exception to this rule. +2
  • Basic rule 1.3. Quotes in HTML & CSS files: implemented in the whole project. Only double quotes are used for HTML attributes and CSS properties. +2
  • Basic rule 2.1. HTML. Formatting: implemented in the whole project. Every block, table or list element starts with a new line, regardless of their styles. Each nested element is indented respecting the nesting ladder. Inline elements can (but do not have to) be put onto a new line and indented to improve code readability. +2
  • Basic rule 2.2. Document Type. <!DOCTYPE html> is the first tag in the HTML file which corresponds to a basic HTML5 document. +2
  • Basic rule 2.3. Named character references: implemented in the whole project. Named character references (such as&mdash;(—), &rdquo;(”)) are not used in the html file. +2
  • Basic rule 2.4. 'type' attribute: implemented in the whole project. type attributes are not used when connecting styles and scripts (they can only be used when connecting not CSS or JS). +2
  • Basic rule 3.1. Single style for selectors naming: implemented in the whole project. The naming style is consistent throughout the project. All the selectors (classes / ids) are named either according to BEM or using lower case words separated by a hyphen. +2
  • Basic rule 3.2. Meaningful naming of identifiers and classes: implemented in the whole project. Meaningful classes and identifiers names reflect their purpose (!but NOT APPEARANCE!). Templates can also be used in which case they indicate the purpose of the element as well. +2
  • Basic rule 3.3. Keep the names of identifiers and classes concise: implemented in the whole project. For identifiers and classes, names that are long enough to indicate their purpose and as short as possible are used. +2
  • Basic rule 3.4. Tag selectors: implemented in the whole project. Tag selectors are not used (except for intentionally resetting the default styles). +2
  • Basic rule 3.5. Indentation in blocks: implemented in the whole project. Any content in a block (blocks are separated by curly braces {}) is always indented. +2
  • Basic rule 3.6. Space after property name: implemented in the whole project. One space is always used after (not before) a colon in properties. +2
  • Basic rule 3.7. Semicolon after properties: implemented in the whole project. Semicolon is used after each property. +2
  • Basic rule 3.8. Separate selectors and properties: implemented in the whole project. Each selector and property in a group is separated with a line break. +2

HTML & CSS. Advanced level: +15

  • Extended rule 1.1. HTML. Semantics: implemented in the whole project. HTML tags are used the way they are intended to be used. div elements are replaced by appropriate semantic tags where possible. +5
  • Extended rule 1.2. Media alternatives: implemented in the whole project. Alternative content for multimedia is specified for each element. Each img element has an alt-attribute with a meaningful alternative text which reflects its content. If the picture is used only for decorative purposes, an empty alt attribute (alt="") is used. +5
  • Extended rule 2.1. BEM: implemented in the whole project. BEM notation is used to form all class names throughout the project. +5

ksarise added 22 commits December 28, 2023 22:32
@ksarise
refactor(basic-1.1 & basic-2.1):formatting html to nesting ladder;usi…
671c7f6 
…ng two spaces for indentation
@ksarise
fix(basic-2.2):add HTML5 DOCTYPE tag
6195676
@ksarise
refactor(basic-2.3): replace named character reference by question mark
751d951
@ksarise
refactor(basic-2.4):remove 'type' atributes of styles and scripts
6a26238
@ksarise
refactor(basic-2.5):break long line
1fcbf4f
@ksarise
refactor(basic-1.1):use two spaces for intendation in CSS
df035de
@ksarise
refactor(basic-1.2):use lowercase in HTML and CSS
ba6c17a
@ksarise
refactor(basic-1.3):Use double quotes instead of single quotes in HTM…
b7b4838 
…L and CSS
@ksarise
refactor(basic-3.1):single style for selectors naming in HTML, CSS an…
191b779 
…d js
@ksarise
refactor(basic-3.2):use template or meaningful class names and identi…
37174ff 
…fiers
@ksarise
refactor(basic-3.3):use names of identifiers and classes concise
a770835
@ksarise
refactor(basic-3.4):remove default tag selectors
8059f46
@ksarise
refactor(basic-3.5):indent the content of blocks
ef3937f
@ksarise
refactor(basic-3.6): use one space after property name
e6d571d
@ksarise
refactor(basic-3.7): Put semicolon after each property
8d53ca7
@ksarise
refactor(basic-3.8): Separate selectors and properties
d8cf96e
@ksarise
refactor(extended-1.1):add semantic tags
12f6232
@ksarise
fix(extended-1.1):fix forgotten heading
4944b3a
@ksarise
fix(basic-3.4):fix app functionality after renaming classes
dfb9459
@ksarise
refactor(extended-1.2):add media alternatives
f5532db
@ksarise
refactor(extended-2.1):use bem notation to form class names
8a55f00
@ksarise
fix(extended-1.1):fix and downgrade back headings
81d6e98
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@ksarise