Merge branch 'main' into patch-65

.github/labeler.yml

@@ -31,5 +31,9 @@
 'Content: Foundations':
   - 'foundations/**/*'
 
+'Content: Markdownlint':
+  - 'markdownlint/**/*'
+  - '**/*.markdownlint-cli2.jsonc'
+
 'Type: Chore':
   - 'archive/**/*'

.github/workflows/testing.yml → .github/workflows/codespell.yml

@@ -14,5 +14,4 @@ jobs:
             check_filenames: true
             check_hidden: true
             skip: ./.git,*.png,*.csv,./archive,./legacy_submissions
-            only_warn: 1
             ignore_words_file: './.codespellignore'

.github/workflows/markdownlint-lessons.yml

@@ -0,0 +1,34 @@
+name: MarkdownLint
+on:
+    pull_request:
+        paths:
+            - '**.md'
+            - '!./*.md'
+            - '!**/project*.md'
+            - '!./archive/**.md'
+            - '!./templates/**.md'
+            - '!./markdownlint/docs/**.md'
+
+jobs:
+    lesson_lint:
+        name: Lint lesson files
+        runs-on: ubuntu-latest
+        steps:
+          - uses: actions/checkout@v4
+          - uses: tj-actions/changed-files@v41
+            id: changed-files
+            with:
+              files: |
+                **.md
+                !./*.md
+                !README.md
+                !**/project*.md
+                !./archive/**.md
+                !./templates/**.md
+                !./markdownlint/docs/**.md
+              separator: ','
+          - uses: DavidAnson/markdownlint-cli2-action@v14
+            with:
+              config: './lesson.markdownlint-cli2.jsonc'
+              globs: ${{ steps.changed-files.outputs.all_changed_files }}
+              separator: ','

.github/workflows/markdownlint-projects.yml

@@ -0,0 +1,32 @@
+name: MarkDownLint
+on:
+  pull_request:
+    paths:
+        - '**/project*.md'
+        - '!./*.md'
+        - '!./archive/**.md'
+        - '!./templates/**.md'
+        - '!./markdownlint/docs/**.md'
+
+jobs:
+    project_lint:
+        name: Lint project files
+        runs-on: ubuntu-latest
+        steps:
+          - uses: actions/checkout@v4
+          - uses: tj-actions/changed-files@v41
+            id: changed-files
+            with:
+              files: |
+                **/project*.md
+                !./*.md
+                !README.md
+                !./archive/**.md
+                !./templates/**.md
+                !./markdownlint/docs/**.md
+              separator: ','
+          - uses: DavidAnson/markdownlint-cli2-action@v14
+            with:
+              config: './project.markdownlint-cli2.jsonc'
+              globs: ${{ steps.changed-files.outputs.all_changed_files }}
+              separator: ','

CONTRIBUTING.md

@@ -31,4 +31,11 @@ To help enforce the layout specified in our layout style guide, we use [markdown
     - Lint projects: `npm run lint:project -- "./path/to/project"`
     - Autofix projects: `npm run fix:project -- "./path/to/project"`
 
-With either of these two methods, keep in mind that not all issues that get flagged will have an autofix available. Some rules require fixes that are more dependent on context and cannot - and should not - be automatically fixed, such as our custom rule `TOP001` for descriptive link text.
+> [!IMPORTANT]
+> You *must* run these npm scripts in the root of the curriculum repo (the same location as this file and `package.json`). If you navigate to a different directory and run a script on files there, it will not pick up the right configuration files and rules.
+
+> [!TIP]
+> In some cases, you may need to run a fix script more than once to catch and fix all fixable errors. This typically occurs when a line has multiple errors affecting the same parts and fix actions collide, so Markdownlint only applies some of the fixes.
+
+> [!NOTE]
+>With either of these two methods, keep in mind that not all issues that get flagged will have an autofix available. Some rules require fixes that are more dependent on context and cannot - and should not - be automatically fixed, such as our custom rule `TOP001` for descriptive link text.

README.md

@@ -13,15 +13,17 @@ Our community can be found on the [TOP Discord server](https://discord.gg/fbFCkY
 The Odin Project depends on open-source contributions to improve, grow, and thrive. We welcome contributors of all experience levels and backgrounds to help maintain this awesome curriculum and community. If you would like to contribute to our curriculum, be sure to thoroughly read our [contributing guide](https://github.com/TheOdinProject/.github/blob/main/CONTRIBUTING.md).
 
 Some of the things you can do to contribute to our curriculum include:
-* Correct typos and other grammar errors.
-* Rewrite parts of existing lessons to make them clearer and easier to understand.
-* Fix broken links.
-* Add new resource links you think would make a lesson better.
-* Work on entirely new lessons after getting approval.
+
+- Correct typos and other grammar errors.
+- Rewrite parts of existing lessons to make them clearer and easier to understand.
+- Fix broken links.
+- Add new resource links you think would make a lesson better.
+- Work on entirely new lessons after getting approval.
 
 **Happy Coding!**
 
-\* See [license.md](https://github.com/TheOdinProject/curriculum/blob/main/license.md) for usage details.
+See [license.md](https://github.com/TheOdinProject/curriculum/blob/main/license.md) for usage details.
 
 ___
-Created by [Erik Trautman](http://www.github.com/eriktrautman)
+
+Created by [Erik Trautman](http://www.github.com/eriktrautman).

advanced_html_css/accessibility/the_web_content_accessibility_guidelines_wcag.md

@@ -48,8 +48,10 @@ The second thing to keep in mind is that just taking those first few steps towar
 ### Assignment
 
 <div class="lesson-content__panel" markdown="1">
+
 1. Read through the [WCAG Overview](https://www.w3.org/WAI/standards-guidelines/wcag/) page. Don't worry about all of the other links for now. The goal of reading this page is to understand more of the included overview and to get familiar with the site itself for when you *do* need to visit other pages on it.
-2. Skim through [WebAIM's WCAG 2 Checklist](https://webaim.org/standards/wcag/checklist), keeping in mind to read the important disclaimer. For now the goal is just to get an idea of common accessibility issues, some of which you'll be ready to fix by the time you finish this set of lessons, rather than read through every issue listed on the page. Keep this resource bookmarked, though, as using it as your checklist when you start actively implementing accessibility will be really handy.
+1. Skim through [WebAIM's WCAG 2 Checklist](https://webaim.org/standards/wcag/checklist), keeping in mind to read the important disclaimer. For now the goal is just to get an idea of common accessibility issues, some of which you'll be ready to fix by the time you finish this set of lessons, rather than read through every issue listed on the page. Keep this resource bookmarked, though, as using it as your checklist when you start actively implementing accessibility will be really handy.
+
 </div>
 
 ### Knowledge check
@@ -63,4 +65,4 @@ The following questions are an opportunity to reflect on key topics in this less
 
 This section contains helpful links to related content. It isn't required, so consider it supplemental.
 
-- It looks like this lesson doesn't have any additional resources yet. Help us expand this section by contributing to our curriculum.
+- [The A11Y Project](https://www.a11yproject.com/): An open-source resource that provides information on how to make your web content more accessible. The A11Y Project includes checklists, guidelines, and tools that can help you implement WCAG standards effectively.

advanced_html_css/animation/transforms.md

@@ -157,7 +157,9 @@ on <a href="https://codepen.io">CodePen</a>.</span>
 
 <script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>
 
-If you guessed correctly, congratulations! But this is a tricky concept. There is a bit of debate on how to read a chain of transform functions. According to [MDN's transform docs](https://developer.mozilla.org/en-US/docs/Web/CSS/transform#values): "The transform functions are multiplied in order from left to right, meaning that composite transforms are effectively applied in order from right to left."
+If you guessed correctly, congratulations! But this is a tricky concept. MDN's transform docs state that "[composite transforms are effectively applied in order from right to left](https://developer.mozilla.org/en-US/docs/Web/CSS/transform#values)".
+
+The blue box rotates 45 degrees on the spot, then translates on the X axis by 200%, moving it directly to the right. The red box translates by 200% first, so moves to the right, but the transform origin is still where it used to be. Therefore, it rotates 45 degrees around that original point, making the red box "swing down" to end up diagonally from where it started.
 
 While you can generally chain multiple transforms in any order for various results, there is one exception: `perspective`. This brings us nicely to the next section where `perspective` is involved.
 
@@ -269,7 +271,7 @@ Another benefit of `transform` is that it can be hardware-accelerated via a devi
 
 <div class="lesson-content__panel" markdown="1">
 
-1. Take a look at this [MDN demonstration of `rotate3d`](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate3d()) then read more about the property in this [Quackit article on `rotate3d`](https://www.quackit.com/css/functions/css_rotate3d_function.cfm).
+1. Take a look at this [MDN demonstration of `rotate3d`](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate3d()) then read more about the property in this [Quackit article on `rotate3d`](https://www.qhmit.com/css/functions/css_rotate3d_function.cfm).
 1. Learn more about [the `perspective` property on CSS Tricks](https://css-tricks.com/how-css-perspective-works/).
 1. MDN has another great [demonstration using `translate3d`](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translate3d()).
 1. Go through [The World of CSS Transforms](https://www.joshwcomeau.com/css/transforms/) by Josh Comeau.

advanced_html_css/animation/transitions.md

@@ -24,7 +24,7 @@ CSS transitions let you animate a change from an element's initial state to an e
 
 <script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>
 
-When your mouse cursor is away from the button, the button is in the initial state. When you hover over it you introduce the end state, the hover state, causing the transition of the color smoothly fading from white to black to occur.
+When your mouse cursor is away from the button, the button is in the initial state. When you hover over it, you introduce the end state - the hover state - causing the background color to transition smoothly from white to black.
 
 This was achieved using the `transition` property, which is actually a shorthand property for `transition-property`, `transition-duration`, `transition-timing-function` and `transition-delay`.
 

databases/databases/databases.md

@@ -1,6 +1,6 @@
 ### Introduction
 
-We've talked about the client-side and the server-side but how do we keep ahold of all our user's data?  Who remembers that your login password is `CatLover1985` so you can sign into the website?  The bottom layer of any web application is the database and it handles all the remembering for you (we'll cover caching much later). It can be relatively simple, like an Excel spreadsheet, or incredibly complex and split into many giant pieces, like Facebook's.
+You might have wondered how you keep track of all your users' data.  Who remembers that your login password is `CatLover1985` so you can sign into the website?  The bottom layer of any web application is the database and it handles all the remembering for you (we'll cover caching much later). It can be relatively simple, like an Excel spreadsheet, or incredibly complex and split into many giant pieces, like Facebook's.
 
 Databases are kind of hidden in the back of the web application, so people approach them with a sense of suspicion and awe.  However, do not fret or feel intimidated.  As you dive deeper into the subject, your databases and you are going to become very good friends (or at least frenemies).  Rest assured, by the end of this curriculum, you're going to understand what's going on with your databases and be able to interact with them like a pro (and probably better than some people you'll work with).  This lesson is a teaser for that.
 
@@ -10,41 +10,42 @@ Compared to a normal programming language like you've already learned, SQL (Stru
 
 This section contains a general overview of topics that you will learn in this lesson.
 
--   What a database is.
--   What relational databases are.
--   In what way relational databases are different from XML.
--   What SQL is.
--   What SQL is used for.
--   How to get all the records from a table in SQL.
--   How to insert a record in SQL.
+- What a database is.
+- What relational databases are.
+- In what way relational databases are different from XML.
+- What SQL is.
+- What SQL is used for.
+- How to get all the records from a table in SQL.
+- How to insert a record in SQL.
 
 ### Assignment
 
 <div class="lesson-content__panel" markdown="1">
 
-  1.  Check out this [introduction](https://launchschool.com/books/sql/read/introduction) of how SQL can be used to organise and manage an overwhelming amount of data.
-      -   You do not need to go any further than the first page on introductions.
+  1. Check out this introduction of [how SQL can be used to organise and manage an overwhelming amount of data](https://launchschool.com/books/sql/read/introduction).
+      - You do not need to go any further than the first page on introductions.
 
-  2.  Watch this [short video introduction to relational databases](http://www.youtube.com/watch?v=z2kbsG8zsLM) to get a feel for why this stuff is useful and some more exposure to the terminology we'll use.
-  3.  Go through this [Khan Academy tutorial](https://www.khanacademy.org/computing/hour-of-code/hour-of-sql/v/welcome-to-sql), to get a feel for actually creating and manipulating databases.
+  1. Watch this [short video introduction to relational databases](http://www.youtube.com/watch?v=z2kbsG8zsLM) to get a feel for why this stuff is useful and some more exposure to the terminology we'll use.
+  1. Go through this [Khan Academy SQL tutorial](https://www.khanacademy.org/computing/hour-of-code/hour-of-sql/v/welcome-to-sql) to get a feel for actually creating and manipulating databases.
 
 </div>
 
 ### Knowledge check
-This section contains questions for you to check your understanding of this lesson on your own. If you’re having trouble answering a question, click it and review the material it links to.
 
--   [What is a database?](https://launchschool.com/books/sql/read/introduction#structureddata)
--   [What are relational databases?](https://launchschool.com/books/sql/read/introduction#rdbms)
--   [What is a Primary Key?](https://youtu.be/z2kbsG8zsLM?t=200)
--   [What is SQL?](https://launchschool.com/books/sql/read/introduction#sql)
--   [How do you get all the records from a table in SQL?](https://www.khanacademy.org/computing/hour-of-code/hour-of-code-lessons/hour-of-sql/pt/querying-the-table)
--   [How do you insert a record in SQL?](https://www.khanacademy.org/computing/hour-of-code/hour-of-code-lessons/hour-of-sql/pt/creating-a-table-and-inserting-data)
+The following questions are an opportunity to reflect on key topics in this lesson. If you can't answer a question, click on it to review the material, but keep in mind you are not expected to memorize or master this knowledge.
+
+- [What is a database?](https://launchschool.com/books/sql/read/introduction#structureddata)
+- [What are relational databases?](https://launchschool.com/books/sql/read/introduction#rdbms)
+- [What is a Primary Key?](https://youtu.be/z2kbsG8zsLM?t=200)
+- [What is SQL?](https://launchschool.com/books/sql/read/introduction#sql)
+- [How do you get all the records from a table in SQL?](https://www.khanacademy.org/computing/hour-of-code/hour-of-code-lessons/hour-of-sql/pt/querying-the-table)
+- [How do you insert a record in SQL?](https://www.khanacademy.org/computing/hour-of-code/hour-of-code-lessons/hour-of-sql/pt/creating-a-table-and-inserting-data)
 
 ### Additional resources
-This section contains helpful links to related content. It isn’t required, so consider it supplemental.
 
--   [What is a Relational Database?](http://computer.howstuffworks.com/question599.htm) from HowStuffWorks.com
--   A brief [Simple Wiki article describing relational databases](http://simple.wikipedia.org/wiki/Relational_database)
--   Hunter Ducharme created [an e-book](https://hunter-ducharme.gitbook.io/sql-basics/) which is a great documentation on how to do all the basics in SQL.
--   David J. Malan's excellent SQL lecture and resources in [Harvard's CS50x](https://cs50.harvard.edu/x/2023/weeks/7/).
--   Relational databases aren't the only way to store data. Non-relational (aka NoSQL) databases have emerged over the last couple decades. Check out [this article](https://circleci.com/blog/SQL-vs-NoSQL-databases/) to learn the difference between SQL and NoSQL.
+This section contains helpful links to related content. It isn't required, so consider it supplemental.
+
+- [What is a Relational Database?](http://computer.howstuffworks.com/question599.htm) from HowStuffWorks.com
+- A brief [Simple Wiki article describing relational databases](http://simple.wikipedia.org/wiki/Relational_database)
+- [David J. Malan’s excellent SQL lecture](https://cs50.harvard.edu/x/2024/weeks/7/) and resources in Harvard’s CS50x.
+- Relational databases aren't the only way to store data. Non-relational (aka NoSQL) databases have emerged over the last couple decades. Check out this article to learn the [difference between SQL and NoSQL](https://circleci.com/blog/SQL-vs-NoSQL-databases/).