Merge pull request #12 from HackYourFuture-CPH/linting

adamblanchard · web-flow · commit 6f739031075d · 2025-04-21T09:58:13.000+02:00
Add linting workflow
diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml
@@ -0,0 +1,25 @@
+---
+name: Lint
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    types:
+      - opened
+      - synchronize
+      - reopened
+
+jobs:
+  build:
+    name: Lint
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+      - name: npm install
+        run: npm install
+      - name: Run the linter
+        run: ./lint
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
 # Ignore hidden Mac OS directory files
-**/.DS_Store
+**/.DS_Store
+node_modules/
diff --git a/.markdownlint.json b/.markdownlint.json
@@ -0,0 +1,4 @@
+{
+  "extends": "markdownlint/style/prettier",
+  "ignore": "node_modules/"
+}
diff --git a/LICENSE.md b/LICENSE.md
@@ -1,6 +1,7 @@
+# License
+
 The HackYourFuture programme is subject to CC BY NC SA copyright. This means you can freely use our materials, but just make sure to give us credit for it and don't use it commercially, as it is the intellectual property of our volunteers :)
 
 ![Creative Commons License ](https://github.com/user-attachments/assets/912a16ff-b11a-4dcf-9c07-7bdce3d72e64)
 
 This work is licensed under a [Creative Commons Attribution 4.0 International License](http://creativecommons.org/licenses/by-nc-sa/4.0/).
-
diff --git a/README.md b/README.md
@@ -1,2 +1,3 @@
 # programme
+
 Documents the HYF programme, courses and modules
diff --git a/contributing/README.md b/contributing/README.md
@@ -1,23 +1,28 @@
 # Contributing
 
-Everyone is welcome to fork/clone the repo and contribute to improving the programme. 
+Everyone is welcome to fork/clone the repo and contribute to improving the programme.
 
 If you would like to take a more active role in contributing as a volunteer of HYF Denmark, join #curriculum-crew on Slack to get involved.
 Write in there to introduce yourself, and a staff member will onboard you and set you up with permissions.
 
 ## How to contribute
+
 (We will flesh these processes more as we go...)
 
 ### Existing issues
+
 Very briefly: check the project board "Todo" column, choose one ideally near the top, assign it, clone the repo, do it, make a PR, get feedback, profit.
 
 ### New ideas
+
 Very briefly: Create an issue on this repo, get some feedback, and we'll prioritise them together at the next meeting.
 
 Note: You are always welcome to open issues/create PRs for new ideas, whenever you like. It's an open source project. If we are currently working together towards a project goal, then it would be most helpful to prioritise tasks for that first, though.
 
 ## How permissions work
+
 Permissions are managed through GitHub teams, their roles on this repo, and branch rules.
+
 - _HYF Staff_ members have the admin role (to do things like changing repo settings, inviting new contributors).
 - Members of the _Curriculum Crew_ team on GitHub have the write role (to do things like cloning, pushing branches, approving PRs - any volunteer is welcome here!).
 - Two approvals by anyone in _Curriculum Crew_ or _HYF Staff_ are required on a PR before merging is allowed.
diff --git a/contributing/meetings/2025 13th April.md b/contributing/meetings/2025 13th April.md
@@ -1,7 +1,11 @@
+# 2025-04-13
+
 Example of where we can keep meeting notes, decisions and other outcomes from meetings (like the workshop we had on 13th april).
 
-### Notes
+## Notes
+
 To be brief, here's the [slides](https://docs.google.com/presentation/d/1JdxBFEz9HsN7t4dkuVh_sy-wZsc3V1S-vRPjK2fLKgQ/edit?slide=id.p#slide=id.p) from this meeting.
 
-### Next steps:
+## Next steps
+
 - [ ] Adam: Send summary and next steps in slack (end of Tues 15th)
diff --git a/courses/Backend/README.md b/courses/Backend/README.md
@@ -1,4 +1,6 @@
-> [!IMPORTANT]  
+# Back-end
+
+> [!IMPORTANT]
 > Work in progress. Proposed content defined [here](https://docs.google.com/document/d/151MLm-8WA6jSk0-9JhBTuG1xZ9Fo9HRLplJx6Bhps6A/edit?tab=t.0).
 
-# Modules
+## Modules
diff --git a/courses/Foundation/HTML-CSS/Pre-course/readme.md b/courses/Foundation/HTML-CSS/Pre-course/readme.md
@@ -1,22 +1,20 @@
-# Pre-course materials
+# Pre-course
 
-This section lists the steps you have to complete **BEFORE** the bootcamp starts. <br>
+## Pre-course materials
 
-You are going to be fully self-learning `HTML` and `CSS`, so it is very important and **mandatory** that you complete the steps before the first sunday session at HackYourFuture. <br>
+This section lists the steps you have to complete **BEFORE** the bootcamp starts.
 
-You will also get a little introduction to `Javascript`, so that you can be more comfortable jumping into it when the course starts.
+You are going to be fully self-learning `HTML` and `CSS`, so it is very important and **mandatory** that you complete the steps before the first sunday session at HackYourFuture.
 
-<br>
+You will also get a little introduction to `Javascript`, so that you can be more comfortable jumping into it when the course starts.
 
-# HTML and CSS
+## HTML and CSS
 
-## freeCodeCamp certifications
+### freeCodeCamp certifications
 
 The `freeCodeCamp` courses are a good way to learn and their certifications are widely recognized, therefore we use this platform to give you a good start with learning `Web Development` and having a way to showcase your learning.
 
-<br>
-
-## What you have done so far
+### What you have done so far
 
 There are 5 parts in the [Responsive Web Design certification](https://www.freecodecamp.org/learn/2022/responsive-web-design/). Each part contains a few sections and a certification project at the end of each part.
 You have already finished at least 2 sections from the first part as part of the application assignment:
@@ -25,7 +23,7 @@ You have already finished at least 2 sections from the first part as part of the
 
 - [Learn Basic CSS by Building a Cafe Menu](https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-basic-css-by-building-a-cafe-menu/)
 
-## What you have to do before the first Sunday session
+### What you have to do before the first Sunday session
 
 You should finish the first part and the certification project that goes with it:
 
@@ -37,18 +35,14 @@ You should finish the first part and the certification project that goes with it
 
 This will familiarise you with `CSS` colors and building `Forms` with `HTML` and `CSS`, which are both essential parts of basic Web Development knowledge.
 
-<br>
-
 You should also complete 2 more sections from the second part:
 
 - [Learn the CSS Box Model by Building a Rothko Painting](https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-the-css-box-model-by-building-a-rothko-painting)
 - [Learn CSS Flexbox by Building a Photo Gallery](https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-css-flexbox-by-building-a-photo-gallery)
 
 Learning the CSS Box Model and Flexbox will give you very good foundational knowledge to deal with any styling or layout challenge.
 
-<br>
-
-# JavaScript
+## JavaScript
 
 Complete these steps in the freeCodeCamp [JavaScript Algorithms and Data Structures certification](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/):
 
@@ -77,17 +71,13 @@ Complete these steps in the freeCodeCamp [JavaScript Algorithms and Data Structu
 - [Compound Assignment With Augmented Multiplication](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication)
 - [Compound Assignment With Augmented Division](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division)
 
-<br>
-
 If you like the `freeCodeCamp` format, you should definitely continue beyond what we ask of you and attain the various relevant certifications - especially by finishing off the **Responsive Web Design** and **Javascript Algorithms and Data Structures** certifications!
 
-<br>
-
-## Submitting your preparation
+### Submitting your preparation
 
 Before the first Sunday session, you must have completed all the steps listed above. You then need to make your freeCodeCamp profile public - [Video here to show you how to do this](https://www.loom.com/share/019547eab49e4e198fd2d24f6cb27d3c) - and post a link to your profile in your class Slack channel. If you do not do this before the first Sunday session, you will not be able to continue with the course.
 
-## What if?
+### What if?
 
 - If you have completed all these parts already, just continue further with the certifications. You are here to learn after all and you are entering a journey of self-teaching!
 
diff --git a/courses/Foundation/HTML-CSS/The-one-and-only-week1/Session-exercise-template/order.html b/courses/Foundation/HTML-CSS/The-one-and-only-week1/Session-exercise-template/order.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
diff --git a/courses/Foundation/HTML-CSS/The-one-and-only-week1/readme.md b/courses/Foundation/HTML-CSS/The-one-and-only-week1/readme.md
@@ -3,7 +3,7 @@
 Use the `Session-exercise-template` to get started!
 
 Design:
-https://www.figma.com/file/VwksDkp1vSPhpfa62LWIAz/HTML%2FCSS-session1?type=design&node-id=0-1&mode=design&t=seawrJIXVyPoIt9L-0
+<https://www.figma.com/file/VwksDkp1vSPhpfa62LWIAz/HTML%2FCSS-session1?type=design&node-id=0-1&mode=design&t=seawrJIXVyPoIt9L-0>
 
 ![Desktop design](Session-exercise-template/images/order-desktop.png)
 
diff --git a/courses/Foundation/HTML-CSS/first-homework-submission.md b/courses/Foundation/HTML-CSS/first-homework-submission.md
@@ -2,63 +2,47 @@
 
 While you have not gone through [Git](https://github.com/HackYourFuture-CPH/Git) yet, you will submit your first homework in a different way. This applies only to the first homework. If you are confident with basic Git already, feel free to do the submission in a proper version-control way.
 
-`1.` go to your homework repository`*` on github and to the branches section: <br/>
-<img src="images/image.png" width="400">
+`1.` go to your homework repository`*` on github and to the branches section:
 
-<br/>
-<br/>
+![screenshot](images/image.png)
 
 `2.` find the "New branch" button and create a new branch, that follows the naming convention:
-`html-css/yourname`
 
-> ❌ html/css/maria <br/>
-> ❌ hmtl-css/maria <br/>
-> ❌ html-css-homework <br/>
-> ❌ html/maria <br/>
-> ❌ htmlcss/maria <br/>
-> ✅ html-css/maria <br/>
+`html-css/yourname`
 
-<br/>
-<br/>
+- ❌ html/css/maria
+- ❌ hmtl-css/maria
+- ❌ html-css-homework
+- ❌ html/maria
+- ❌ htmlcss/maria
+- ✅ html-css/maria
 
-`3.` go to the branch. It appears in the branch overview right after creation: <br/>
-<img src="images/image-1.png" width="500">
+`3.` Go to the branch. It appears in the branch overview right after creation:
 
-Or, if you are not there for some reason, go back to the repository overview and find your new branch in the drop-down: <br/>
-<img src="images/image-2.png" width="500">
+![screenshot](images/image-1.png)
 
-To verify that you have switched to the branch, it should appear selected: <br/>
-<img src="images/image-3.png" width="500">
+Or, if you are not there for some reason, go back to the repository overview and find your new branch in the drop-down:
 
-<br/>
-<br/>
+![screenshot](images/image-2.png)
 
-`4.` go to the html-css folder and upload your homework: <br/>
-<img src="images/image-4.png" width="700">
+To verify that you have switched to the branch, it should appear selected:
 
-<br/>
-<br/>
+![screenshot](images/image-3.png)
 
-`5.` write a commit message and press "Commit changes": <br/>
-<img src="images/image-5.png" width="500">
+`4.` Go to the html-css folder and upload your homework:
 
-<br/>
-<br/>
+![screenshot](images/image-4.png)
 
-`6.` go to "Pull requests" in the repository bar, and create a new pull request to the main branch <- from your branch: <br/>
-<img src="images/image-6.png" width="700">
+`5.` Write a commit message and press "Commit changes":
 
-<br/>
-<br/>
+![screenshot](images/image-5.png)
 
-`7.` that is it! You should see your pull request listed in the "Pull requests" tab.
+`6.` Go to "Pull requests" in the repository bar, and create a new pull request to the main branch <- from your branch:
 
-<br/>
-<br/>
+![screenshot](images/image-6.png)
 
-`8.` post a link to your homework Pull Request in your class channel.
+`7.` That is it! You should see your pull request listed in the "Pull requests" tab.
 
-<br/>
-<br/>
+`8.` Post a link to your homework Pull Request in your class channel.
 
-`*` it is either your own homework repository in your own GitHub account or the central class homework repository in the HackYourFuture-CPH GitHub account - depending on what approach is being followed for your class. Follow the information and instructions regarding this, and ask if you are still unsure.
+`*` It is either your own homework repository in your own GitHub account or the central class homework repository in the HackYourFuture-CPH GitHub account - depending on what approach is being followed for your class. Follow the information and instructions regarding this, and ask if you are still unsure.
diff --git a/courses/Foundation/HTML-CSS/homework.md b/courses/Foundation/HTML-CSS/homework.md
@@ -2,7 +2,7 @@
 
 Make your own `Developer CV / Portfolio page`!
 
-<br/>There is a long way to go in the learning journey, but why not start with a good online presence from the get-go?
+There is a long way to go in the learning journey, but why not start with a good online presence from the get-go?
 
 Make it as extravagant as you like and look around the internet for inspiration (f.x. [here](https://scrimba.com/articles/web-developer-portfolio-inspiration)), while the **minimum requirements** are:
 
@@ -15,21 +15,19 @@ Make it as extravagant as you like and look around the internet for inspiration
 - [ ] Portfolio section having the [FCC Survey Form](https://www.freecodecamp.org/learn/2022/responsive-web-design/build-a-survey-form-project/build-a-survey-form) as the first project.`*`
 - [ ] Advanced CSS and/or animations applied to implement interesting interactive elements
 - [ ] Website responsiveness so it looks good on different screen sizes and devices
-- [ ] Deploy your page on [Netlify](https://www.netlify.com)! 
+- [ ] Deploy your page on [Netlify](https://www.netlify.com)!
 
-<br/>
-
-`* ` it is not advisable to have tutorial or course projects in your portfolio, you should make sure to have unique and interesting self-driven projects. However, it is a bit too early for that. Start with the "Survey Form" and keep building and extending your project portfolio as you learn!
+`*` it is not advisable to have tutorial or course projects in your portfolio, you should make sure to have unique and interesting self-driven projects. However, it is a bit too early for that. Start with the "Survey Form" and keep building and extending your project portfolio as you learn!
 
 ❗ Remember: you have to submit the homework during the week, before the weekend, so plan your workload accordingly. You can keep working on this portfolio in the future, so just focus on doing a nice initial version for now!
-<br/>Check [the first homework submission](https://github.com/HackYourFuture-CPH/HTML-CSS/blob/main/first-homework-submission.md) instructions to make sure to submit the homework correctly!
+
+Check [the first homework submission](https://github.com/HackYourFuture-CPH/HTML-CSS/blob/main/first-homework-submission.md) instructions to make sure to submit the homework correctly!
 
 **Small tip:**
+
 - Got to [Loom.com](https://www.loom.com/) and download the app or plugin.
 - It's a great way to quickly share explainer videos or explain issues you are facing.
 
- <br/>
-
 Good luck! ✌️
 
-![](https://media.giphy.com/media/13GIgrGdslD9oQ/giphy.gif)
+![Jim Carrey as the eponymous "Bruce Almighty", busily typing away](https://media.giphy.com/media/13GIgrGdslD9oQ/giphy.gif)
diff --git a/courses/Foundation/HTML-CSS/readme.md b/courses/Foundation/HTML-CSS/readme.md
@@ -2,12 +2,12 @@
 
 This repository contains the course material for the one and only HTML/CSS session. During the session we will review the concepts learned from the [Pre-course](./Pre-course/readme.md) materials and work hands-on with a large [exercise](./The-one-and-only-week1/readme.md).
 
+| Week | Topic                                                                                                       | Preparation                          | Lesson Plan                                       | Homework                  |
+| ---- | ----------------------------------------------------------------------------------------------------------- | ------------------------------------ | ------------------------------------------------- | ------------------------- |
+| 1.   | Advanced HTML & CSS concepts, hands-on exercise turning Figma Wireframe into code, teamwork & peer-learning | [Pre-course](./Pre-course/readme.md) | [Lesson Plan](./The-one-and-only-week1/readme.md) | [Homework](./homework.md) |
 
-| Week | Topic | Preparation | Lesson Plan | Homework |
-| ---- | ----- | ---- |----------|--------|
-| 1. |  Advanced HTML & CSS concepts, hands-on exercise turning Figma Wireframe into code, teamwork & peer-learning  | [Pre-course](./Pre-course/readme.md) | [Lesson Plan](./The-one-and-only-week1/readme.md) | [Homework](./homework.md) |
+## Learning goals
 
-### Learning goals
 - Round-up the [Pre-course](./Pre-course/readme.md) materials
 - Talk about any possible questions regarding the concepts learned so far
 - Briefly introduce Figma
diff --git a/courses/Foundation/README.md b/courses/Foundation/README.md
@@ -1,5 +1,8 @@
-> [!IMPORTANT]  
+# Foundation
+
+> [!IMPORTANT]
 > Work in progress. Proposed content defined [here](https://docs.google.com/document/d/151MLm-8WA6jSk0-9JhBTuG1xZ9Fo9HRLplJx6Bhps6A/edit?tab=t.0).
 
-# Modules
+## Modules
+
 ### [HTML & CSS](./HTML-CSS)
diff --git a/courses/Frontend/README.md b/courses/Frontend/README.md
@@ -1,4 +1,6 @@
-> [!IMPORTANT]  
+# Front-end
+
+> [!IMPORTANT]
 > Work in progress. Proposed content defined [here](https://docs.google.com/document/d/151MLm-8WA6jSk0-9JhBTuG1xZ9Fo9HRLplJx6Bhps6A/edit?tab=t.0).
 
-# Modules
+## Modules
diff --git a/courses/Pre-Course/README.md b/courses/Pre-Course/README.md
@@ -1,4 +1,6 @@
-> [!IMPORTANT]  
+# Pre-course
+
+> [!IMPORTANT]
 > Work in progress. Proposed content defined [here](https://docs.google.com/document/d/151MLm-8WA6jSk0-9JhBTuG1xZ9Fo9HRLplJx6Bhps6A/edit?tab=t.0).
 
-# Modules
+## Modules
diff --git a/lint b/lint
@@ -0,0 +1,17 @@
+#!/bin/bash
+
+set -eu
+
+if [ "${1:-}" == "--fix" ] ; then
+  npm exec -- markdownlint --ignore 'node_modules/' --fix '**/*.md'
+  npm exec -- prettier --write .
+else
+  trap '
+    if [ $? -ne 0 ] ; then
+      echo "Try '\''./lint --fix'\'' to see if any automatic fixes are possible"
+    fi
+  ' 0
+
+  npm exec -- markdownlint --ignore 'node_modules/' '**/*.md'
+  npm exec -- prettier --check .
+fi
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
diff --git a/shared-modules/README.md b/shared-modules/README.md

-Original file line number
+Diff line change
@@ @@ -0,0 +1,4 @@ @@
 +{
 +  "extends": "markdownlint/style/prettier",
 +  "ignore": "node_modules/"
 +}
Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,3 @@`
`1`	`1`	`# programme`
	`2`	`+`
`2`	`3`	`Documents the HYF programme, courses and modules`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-<!DOCTYPE html>`
	`1`	`+<!doctype html>`
`2`	`2`	`<html lang="en">`
`3`	`3`	`<head>`
`4`	`4`	`<meta charset="UTF-8" />`