Skip to content
This repository has been archived by the owner on Nov 3, 2020. It is now read-only.

First Steps: Code Standards

sjagoori edited this page Jun 24, 2020 · 7 revisions

📝 Code standards

To improve our collaboration for this project, we have set up a set of conventions for our HTML, (S)CSS, and Javascript files. On this page, we will go through the standard for each filetype and the contexts.

HTML

  • Write semantically correct HTML, use validators in your IDE or online validators.
  • Mind the indentations; use two spaces instead of four.
  • Use IDs for unique elements.
  • Use classes for repeating elements/components.
  • Use html5 elements and their attributes.

(S)CSS

  • Nest declarations if it's related to the parent.
  • Declare colors globally.
  • Use variables for colors.
  • Avoid repeating yourself.
  • Design for desktop and mobile but also a tablet.

Javascript

  • Declare variables at the top of your file.
  • Write ES6.
  • Use JSDocs to describe your function in short.
  • Make use of the JSDocs tags.
  • Use const, let and var.
  • Use the arrow function.
  • Follow ESlinter linting (Google's style)

Code standards

When we are working on our project we communicate with each other a lot. Mostly trough Slack and Discord. When one of us has a question about code or about the way of working we directly asks in the Slack group. When the others read this they will help wherever they can. Is this an easy question then we will figure it out within Slack and when the question is more advanced we will use the share screen function on Discord to have a better idea of what going on. This worked really well for us.

It goes without saying that we use GitHub for our version control tool. If we talk about hierarchy our highest branch in our project is the “master” branch. Underneath this we will get the development branch which we merge with the master if there are new working features without bugs. For each new feature, bug or functionality we create a new brach from our development branch. This is the brach we will be working on.

When the feature is done and working without bugs we will open a pull/merge request on Github and assign the other teammates to it. When assigning a teammate you can ask them to review your code. When there are problems or question with your code you can ask it in the pull request or call them to explain their choses. Most of the time we used slack or we were programming in a Discord channel so we handled it trough these programs.

This way of working was familiar for all of us. Because of this our teamwork went great and we’re happy with the final application.

Here is an example of our community through GitHub.