diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index b63c871e3..656b97869 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -34,8 +34,7 @@ In order to create a new snippet, you should follow the steps below: - Snippet types must be one of the following: `story`, `list`, `tip`, `cheatsheet` or `question`. - Snippet tags must be comma-separated. You are allowed to specify a single language tag (e.g. `react` or `javascript`), preferably as the first tag. - Snippets must have their `firstSeen` dates formatted using [ISO 8601](https://en.wikipedia.org/wiki/ISO_8601). -- Snippet authors must be added in JSON format as seen in `blog_data/blog_authors.json`. -- Snippet covers must be added inside the `blog_images` directory and have the exact same name as the snippet filename. Snippet covers must be Unsplash images of appropriate theme and content and their links must be provided as part of the PR, so that they can be added to the appropriate collection. +- Snippet authors must be added in JSON format as seen in `blog_data/blog_authors.json`. Snippet covers must be Unsplash images of appropriate theme and content and their links must be provided as part of the PR, so that they can be added to the appropriate collection. - Snippet excerpts must be a very short description of the snippet's content, up to 180 characters in length. The excerpt must contain some of the main keywords and a general intro to the snippet, as it will be used for social sharing and previewing the snippet itself. - Snippets that are of the `list` type must be written as such, check previously submitted snippets for more details. - Snippet code and examples must be enclosed in appropriate, language-tagged blocks, be short and use modern techniques and features. Also make sure to test your code before submitting. Always use soft tabs (2 spaces), never hard tabs. diff --git a/blog_posts/4-javascript-array-methods.md b/blog_posts/4-javascript-array-methods.md index 2311db9e7..b1c8576fb 100644 --- a/blog_posts/4-javascript-array-methods.md +++ b/blog_posts/4-javascript-array-methods.md @@ -32,7 +32,7 @@ const isOdd = x => x % 2 === 1; arr.filter(isOdd); // [1, 3] ``` -![JavaScript Array Methods](./blog_images/js-array-methods.png) +![JavaScript Array Methods](./illustrations/js-array-methods.png) ### Array.prototype.reduce() diff --git a/blog_posts/big-o-cheatsheet.md b/blog_posts/big-o-cheatsheet.md index b51ebcd7e..259dd0a1e 100644 --- a/blog_posts/big-o-cheatsheet.md +++ b/blog_posts/big-o-cheatsheet.md @@ -12,7 +12,7 @@ firstSeen: 2023-01-08T05:00:00-04:00 Big-O notation, represents an algorithm's **worst-case complexity**. It uses algebraic terms to describe the complexity of an algorithm, allowing you to measure its efficiency and performance. Below you can find a chart that illustrates Big-O complexity: -![Big-O Complexity Chart](./blog_images/big-o-complexity.png) +![Big-O Complexity Chart](./illustrations/big-o-complexity.png) Simply put, `O(1)` stands for **constant time complexity**, which is the most efficient, while `O(n!)` stands for **factorial time complexity**, which is the least efficient. The `n` in the complexity represents the size of the input, so `O(n)` means that the algorithm's time complexity will grow linearly with the size of the input. diff --git a/blog_posts/css-nested-border-radius.md b/blog_posts/css-nested-border-radius.md index 551c3f5f9..640523fc3 100644 --- a/blog_posts/css-nested-border-radius.md +++ b/blog_posts/css-nested-border-radius.md @@ -11,7 +11,7 @@ firstSeen: 2022-04-03T05:00:00-04:00 Nesting elements with rounded borders can look very wrong if not done correctly. Luckily, there's a simple math trick to make it look right. All you need to do is **calculate the border radius of one of the elements and the distance between them**. The border radius of the outer element should be equal to the sum of the border radius of the inner element and the distance between the two elements. This can be mathematically expressed as `innerRadius + distance = outerRadius` or more tersely `R1 + D = R2`. -![Nested border radius formula](./blog_images/border-radius.png) +![Nested border radius formula](./illustrations/border-radius.png) Let's take a look at a simple CSS example. Say we want to style two nested boxes with rounded borders. The outer box has a `border-radius` of `24px` and a `padding` of `8px`. Using the previous formula, we can deduce that the inner box should have a `border-radius` of `16px`. diff --git a/blog_posts/flexbox-cheatsheet.md b/blog_posts/flexbox-cheatsheet.md index 60f72abca..6ff47ec26 100644 --- a/blog_posts/flexbox-cheatsheet.md +++ b/blog_posts/flexbox-cheatsheet.md @@ -54,7 +54,7 @@ lastUpdated: 2021-06-12T19:30:41+03:00 - `space-evenly`: distribute items evenly, ensuring equal space between any two items - `stretch`: distribute items evenly, stretching auto-sized items to fit the container -![Diagram of Flexbox properties](./blog_images/flexbox-diagram.png) +![Diagram of Flexbox properties](./illustrations/flexbox-diagram.png) ### Items diff --git a/blog_posts/git-fast-forward.md b/blog_posts/git-fast-forward.md index 31ac4fda8..31bdae97f 100644 --- a/blog_posts/git-fast-forward.md +++ b/blog_posts/git-fast-forward.md @@ -11,7 +11,7 @@ firstSeen: 2021-07-15T05:00:00-04:00 Merging a branch is one of the most common operations when working with Git. Depending on your team and projects you've been a part of, you might have heard of or even used Git's **fast-forward** mode when merging. Fast-forward mode is the default in Git, however GitHub will essentially override this by default and create a merge commit instead. -![Git fast forward explained](./blog_images/git-fast-forward.png) +![Git fast forward explained](./illustrations/git-fast-forward.png) ### Fast-forward merge diff --git a/blog_posts/javascript-variable-scope.md b/blog_posts/javascript-variable-scope.md index 8f9540d5b..b42fd2f5b 100644 --- a/blog_posts/javascript-variable-scope.md +++ b/blog_posts/javascript-variable-scope.md @@ -20,7 +20,7 @@ JavaScript provides two ways to define a variable (`var` and `let`) and one way It is generally preferred to use `let` and `const` to avoid confusion when it comes to scoping. However, it is important to note that `var` can be a useful JavaScript feature when used in the correct circumstances. -![Visualization of JavaScript variable scope](./blog_images/js-variable-scope.png) +![Visualization of JavaScript variable scope](./illustrations/js-variable-scope.png) ### Scope diff --git a/blog_posts/js-async-defer.md b/blog_posts/js-async-defer.md index 08280af71..bde6fbff1 100644 --- a/blog_posts/js-async-defer.md +++ b/blog_posts/js-async-defer.md @@ -11,7 +11,7 @@ firstSeen: 2022-09-04T05:00:00-04:00 When it comes to loading JavaScript files, there are a few different options available. Understanding exactly how scripts are loaded and executed is crucial for website performance, as well as for the overall quality of the user experience. Let's take a look at how the `