From a046b5269c9fd3cdbc414a4287e013a730cb6c06 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Fri, 17 Jan 2020 14:47:24 +0200 Subject: [PATCH] Update existing posts to include excerpts --- blog_posts/10-vs-code-extensions-for-js-developers.md | 3 ++- blog_posts/testing-stateful-ui-components.md | 7 ++++--- snippet-template.md | 10 +++++++--- 3 files changed, 13 insertions(+), 7 deletions(-) diff --git a/blog_posts/10-vs-code-extensions-for-js-developers.md b/blog_posts/10-vs-code-extensions-for-js-developers.md index 84ec0e114..818e0db37 100644 --- a/blog_posts/10-vs-code-extensions-for-js-developers.md +++ b/blog_posts/10-vs-code-extensions-for-js-developers.md @@ -1,9 +1,10 @@ --- title: 10 must-have VS Code extensions for JavaScript developers type: list -tags: devtools,vscode,javascript +tags: devtools,vscode authors: chalarangelo cover: blog_images/10-vs-code-extensions-for-js-developers.jpg +excerpt: As VS Code is steadily gaining popularity, here are my top 10 essential extensions for JavaScript developers that aim to increase productivity. --- Developers will most likely argue for the rest of eternity about the most productive code editor and the best extensions. Here are my personal extension preferences for VS Code as a JavaScript developer: diff --git a/blog_posts/testing-stateful-ui-components.md b/blog_posts/testing-stateful-ui-components.md index c25e41bf0..0fc053100 100644 --- a/blog_posts/testing-stateful-ui-components.md +++ b/blog_posts/testing-stateful-ui-components.md @@ -1,9 +1,10 @@ --- title: An approach to testing stateful React components -type: post -tags: react,javascript,testing +type: story +tags: react,testing authors: chalarangelo cover: blog_images/testing-stateful-ui-components.jpg +excerpt: Testing stateful React components is by no means a difficult task, but did you know there is an elegant solution that doesn't involve testing state directly? --- Some time ago, I was tasked with writing tests for a handful of React components, an otherwise mundane and uninspiring task, that somehow ended with a "Eureka!" moment for me. The specifics of the project and its components are of little importanc, however the key detail is that I was working with stateful React components that are used daily by a large team and, as such, are refactored and updated quite often. @@ -48,6 +49,6 @@ context('the component is initialized in a collapsed state', function() { Our test is still easy to read and understand, but it's a better test in general. -Directly checking the DOM instead of the component's state, we directly provide information about the component's output to future code authors, instead of asking them to keep the existing implementation intact. It seems like a better way to document the component and it's easier to track future changes should someone refactor the UI in such a way that the DOM representation of the component is altered. +By directly checking the DOM instead of the component's state, we provide information about the component's output to future code authors, instead of asking them to keep the existing implementation intact. It seems like a better way to document the component and it's easier to track future changes should someone refactor the UI in such a way that the DOM representation of the component is altered. **Image credit:** [Evan Clark](https://unsplash.com/@evanrclark?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) diff --git a/snippet-template.md b/snippet-template.md index 6384840c1..f834719f0 100644 --- a/snippet-template.md +++ b/snippet-template.md @@ -1,9 +1,13 @@ --- -title: My amazing blog post -type: post -tags: devtools,javascript +title: My amazing story +type: story +tags: javascript,webdev authors: someauthor,someotherauthor cover: blog_images/my-image.png +credit: [Someone](https://unsplash.com/...?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/code?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) +excerpt: A short summary of your story up to 180 characters long. --- Write your blog post here. + +**Image credit:** [Someone](https://unsplash.com/...?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/code?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)