teleren/devto huggingface dataset:
Minhas extensões no VS Code
Tags: beginners, vscode, extension
Published: 2022-05-13 13:28:36

## Temas

[Dracula Official]
(https://marketplace.visualstudio.com/items?itemName=dracula-theme.theme-dracula) - O clássico e mais amado tema.

[OM Theme (A Darker Dracula Theme)](https://marketplace.visualstudio.com/items?itemName=omthemes.omthemes) - Uma alternativa ao Dracula, só que mais escura.


## Extensões

[Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag) - Me ajuda muito na produtividade, pois quando preciso alterar alguma tag ele altera tanto a de abertura como a de fechamento.

[Color Highlight](https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight) - Muito bom para visualizar a cor de um código HEX no código.

[DotENV](https://marketplace.visualstudio.com/items?itemName=mikestead.dotenv) - Ajuda muito na hora de gerar um arquivo .env no código.

[EditorConfig for VS Code](https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig) - Gera automaticamente o arquivo .editorconfig para podermos definir padrões para o código, independente de editor/IDE que cada membro da equipe usa.

[ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) - Gera o arquivo .eslintrc de forma fácil e automática.

[GitLens — Git supercharged](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens) - Adiciona algumas funções do Git dentro do VS Code.

[Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) - Cria um servidor de desenvolvimento local com *live reload*.

[Material Icon Theme](https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme) - Muda os ícones de arquivos/pastas do VS Code para o padrão Material.

[Polacode](https://marketplace.visualstudio.com/items?itemName=pnp.polacode) - Ótimo para gerar imagens de códigos para posts, por exemplo.

[Prettify JSON](https://marketplace.visualstudio.com/items?itemName=mohsen1.prettify-json) - Deixa os arquivos do tipo JSON mais bonitos e de melhor visualização.

[Thunder Client](https://marketplace.visualstudio.com/items?itemName=rangav.vscode-thunder-client) - Uma ótima alternativa ao Insomnia/Postman dentro do próprio VS Code.

[Turbo Console Log](https://marketplace.visualstudio.com/items?itemName=ChakrounAnas.turbo-console-log) - Ajuda muito na hora do debug gerando logs automaticamente.
How to deploy multiple web apps on the same Azure App Service
Tags: azure, webdev, cloud
Published: 2022-05-13 13:22:12

It is not always necessary to use more than one App Service to publish our applications.
a typical case is when we have a frontend and a backend in two different projects on Visual Studio, but we can publish them to the same app service.

It's very easy. Let's see how we can achieve this goal.

## Create a virtual path on the Azure App Service
Navigate on the Azure Portal and click on your app service.
Click on the "**Configuration**" menu and then on the "**Path Mappings**" at the top of the page.

Click on the button "**New virtual application or directory**".
Fill the new form and remember to uncheck the "**Directory**" checkbox.

![virtual path](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l7gizgxeqft5b4fetnmc.png)

## Deploy from Visual Studio
Azure now is ready to host your two web applications on the same Azure App Service.

From Visual Studio, publish the first web application directly from the wizard.
You don't have to change any settings for this deploy.

Follow the same steps for the second application (in this case the api), but before click on "**Publish**", click on the link "**Show all settings**" in the main publish page.

Add "api" in the site name and in the destination url.
Click on "**Save**" and "**Publish**".

![Publish Settings](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0nb3zlj1hqcqpovxjy2j.png)

Now you have two web applications on the same app service.
Pay attention just to one detail. In this case the settings are shared between the apps and the settings for the application in a virtual directory need to be configured in the main application settings.
Counting Sort
Tags: javascript, programming, algorithms
Published: 2022-05-12 08:48:40

What do we understand about Counting Sort?
 - One of the most effecient sorting algorithm
 - Has at least 3 loops to be implemented
 - Should be implemented mathematically
 - Is **NOT** a comparison sort
 - **ONLY** Interger values from negative to positive
 - **Stable algorithm**
 - Returns a new Array
 - Time complexity 
  - Best      is O(n+k)
  - Average   is O(n+k)
  - Worst     is O(n+k)
 - Space complexity
  - O(k)

```js
function CountingSort(arr) {
    let max = arr[0];
    let min = arr[0];
    arr.forEach(val => {
        if (val > max) max = val;
        if (val < min) min = val;
    });

    //! to account for negative numbers, we use max and min.
    //! e.g. 10 - (-4) = 14 Array size.
    //! we need a +1 position to the right for counting of left & right values
    let counter_size = max - min + 1;
    let counter = new Array(counter_size).fill(0);
    //! the index of counter Array indicates the value of the number in arr Array
    //! count the number of times the number repeats and store in index of counter Array
    arr.forEach((_, i) => counter[arr[i] - min]++);

    //! to get the starting position of the number from arr Array,
    //! count the previous value with current value of counter Array
    for (let i = 1; i < counter.length; i++) {
        counter[i] += counter[i - 1];
    }

    let results = new Array(arr.length);
    //! skip the last element as it is not used in the result
    for (let i = results.length - 1; i >= 0; i--) {
        //! decrement the counter before assigning value to results Array of the index position
        //! assign results Array with original Array value at position i
        results[--counter[arr[i] - min]] = arr[i];
    }

    return results;
}
```
Breaking News! The Craft Conf Giveaway Submission Deadline Has Been Extended by a Week!
Tags: softwaredevelopment, conference, developer, giveaway
Published: 2022-05-13 13:05:04

---
title: Breaking News! The Craft Conf Giveaway Submission Deadline Has Been Extended by a Week!
published: true
date: 2022-05-13 13:03:49 UTC
tags: softwaredevelopment, conference, developer, giveaway
canonical_url: https://mszeles.com/breaking-news-the-craft-conf-giveaway-submission-deadline-has-been-extended-by-a-week
---
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s0qexhon5s9elq6bznnc.jpg)
Do you want to win a ticket for one of the world's biggest conferences?

Participate in the Craft Conf giveaway!

I just realized most of you are busy with writing your submission to Hashnode Writeathon. The deadline has been extended by one week, so you can participate in both the Writeathon and the Craft Conf giveaway too.

The new deadline is 25th of May.

I am looking forward to your article.

P.S.: [Something good will happen to you today!](https://dev.to/mszeles/something-good-will-happen-to-you-today-32mp)

[https://mszeles.com/do-you-want-to-learn-software-development-from-top-notch-experts-from-all-around-the-world-here-is-your-chance-aka-the-craft-conf-giveaway](https://dev.to/mszeles/do-you-want-to-learn-software-development-from-top-notch-experts-from-all-around-the-world-win-a-ticket-for-craft-conf-2022-3mfp)
Simplejson.scanner.jsondecodeerror: expecting value: line 1 column 1 (char 0)-Fixed
Tags: python
Published: 2022-05-13 12:58:56

I am facing error “Expecting value: line 1 column 1 (char 0)” when trying to decode the JSON.The URL I use for a API call works fine in a browser, but gives above error when done through the curl request. The error happens at the return simplejson.loads(response_json)

Solution :
 The solution is as below:

· There is no need to use a simplejson library, a same library is included with Python as a json module.

· There is no need to decode the response from a UTF8 to unicode, a simplejson / json .loads() method can handle UTF8 encoded data natively.

Read more  <a href="https://kodlogs.net/190/simplejson-scanner-jsondecodeerror-expecting-value-line-1-column-1-char-0-fixed">here</a>
Chapter 1: Building my first full scale app.
Tags: javascript, webdev, react, docker
Published: 2022-05-13 12:58:42

So, you see those 4 hashtags I put there, yeah, that pretty much sums up what tech-stack I would be using for this application I am going to build. I would be blogging my entire journey from start to finish. 
Hi my name is Aditya Singh, if you want to know more about me here's my [LinkedIn](https://www.linkedin.com/in/thisismeadityasingh/), but I won't force you to open my LinkedIn, so in short I work as a full-time ReactJS developer in Hyderabad, India. 😄

So, I have a general idea about what my application would do, I haven't gotten around to making all those complete wireframes and charts and all yet. But, I am working on it. 

So, about the tech stack I would be using to build this application. 

- __React JS__ for client side. Why? Coz, I don't know any other framework, plus I am a full-time React developer so, I am confident at it. There are a million articles out there debating what framework is better than other, but what I have noticed in practice, is that companies use whatever works for them, and half of the time, those are like 3-4 years old frameworks. __Main thing is to get the product out into the market__. Users don't care about tech stack. If I can make a more usefull app with frameworks which litrally noone uses, it would be more profitable than coding a really shitty app with all the latest and best framework.

- __Nest JS__ for server side. To be specific, I need to use __typescript__ as javascript for server side won't cut it, as the app I am going to build would be big and if typescript helps me avoiding silly errors here and there, you bet I am going with it. Why NestJS? Well because it provides a clear cut way of how it wants the application to be structured saving me time and effort of making my own project structure, so I focus on buisness logic of the app.

- __Prisma Client__ for database. 
- __Docker__ to containerize my application and then finally deploying it to __AWS__ or __GCP__ I am not sure yet, what I am going to use, well we'll see how it goes.

And last but not the least, __Pactum JS__ for testing. Testing is important folks, __DO NOT SKIP TESTING__. 

So, let me put my headphones on, pull up Spotify on my phone, and drink plenty of water (remember to stay hydrated my dear people), let's get to the, 🥁🥁 ..drum roll ..🥁🥁, you guessed it, __Phase 1__ of my journey the ✨Designing my application✨.

I'll share everything I came up with in chapter 2 of my what I hope is going to be a weekly blog. Woohoo, it's 1AM already? Well looks like i am going to pull an all nighter on this one. Sigh. 

Anyways, untill next time. Bye. Bye.
How to Terminate a process in CLI
Tags: cli, beginners, programming, tutorial
Published: 2022-05-13 12:53:21

---
canonical_url: https://baransel.dev/post/cli-how-to-terminate-process/
---

> [Sign up to my newsletter for more tutorials!](https://baransel.dev/newsletter/).

If there is a program that is not responding, you can manually terminate the program by using the `kill` command. This command will send a specific signal to the unresponsive application and instruct the application to terminate itself.

There are **forty-six signals** in total that you can use, but generally these two signals are used:

* `SIGTERM (15)` — prompts a program to stop running and gives it some time to save its state. If you do not specify the signal when entering the kill command, this will be used.

* `SIGKILL (9)` — forcibly terminates process immediately. You lose the unsaved state.

Apart from knowing the signals, you also need to know the process identification number (`PID`) of the program you want to terminate. If you do not know the `PID`, run the `ps ux` command.

> **Note:** To search directly for a process, you can use [grep](https://baransel.dev/post/cli-grep-command/): `ps ux | grep <process name>`

After making sure you know which signal to use and the `PID` of the program, enter the following syntax:

```commandline
kill -<signal> <PID>
```
JavaScript Classes pt. 1
Tags: javascript, beginners, webdev, programming
Published: 2022-05-13 12:51:28


_**This is a short summary of JS classes and the get() property**_

**A** JavaScript class is an outline from which objects are created. It provides a much simpler and clearer syntax and makes inheritance of attributes easier. It can be referred to as "special functions."

You can define a class by using a class declaration. To do so, use the class keyword, which is the class itself.

## **Class expressions**
There are two ways to define or express a class.

**Named**
`let animals = class lion {
}`
Here, "lion" is the class name, and "animals" is the variable name that represents the class wherever it is mentioned.

**Unnamed**
`let animals = class{
}`
Here, there is no name to represent the class. Just like with functions, it could either be named

 `//named 
(function animals(){}) 
// unnamed 
(function(){})`

When dealing with JS classes, one needs to write with extra caution as code written in the body is exposed to stricter syntax and silent errors could be thrown for increased performance of your code.

## **Constructors**
They are methods that assign properties, create and initialize objects created with a class.

N.B There can only be one constructor, but a constructor can use the super () keyword to call the constructor of the super class.

It starts with the word "constructor," then you add in the variables. Example

`class Animal {
// the constructor keyword
constructor ( spiece, kingdom) { 
this.specie = specie;
this .kingdom = kingdom;
}
}`


## **The get () keyword**

This is a special keyword as it binds an object property to a function. It is referred to as a property rather than a method, because whenever this property is called it activates the getter function.

Then the return value of this getter value then determines which property is returned.

You can use it to show the status of an internal variable without having to use explicit method calls.

**Please Note**;
It must have zero parameters.
It must not appear in an object literal with another get () keyword

example : `{ get x() {}, get x(){}}`

It must not appear alongside another data entry for the same property x:..., get().

**To delete the get () property**

delete.const.getter's name ()

E.g. `delete.const.animals()`

Don't forget to drop your comments!
Video tutorial: No-code payments with Payment Links & NFC tags
Tags: tutorial, stripe, showdev
Published: 2022-05-13 12:47:33

{% embed https://youtu.be/F8zX1qYgLg8 %}

## What you'll learn

On this episode of Stripe Developer Office Hours, Mike Bifulco ([@irreverentmike](https://twitter.com/irreverentmike) - that's me!) and Matthew Ling ([@mattling_dev](https://twitter.com/mattling_dev)) demonstrate how you can use [Stripe Payment Links](https://stripe.com/payments/payment-links) with affordable, off-the-shelf NFC tags to make in-person payments a breeze. 

The steps we follow are detailed in our recent tutorial article: [No-code payments: How to use Stripe with customized NFC tags](https://dev.to/stripe/no-code-payments-how-to-use-stripe-with-customized-nfc-tags-3c1o).

## Who this is for

You'll benefit from this tutorial if you're looking to accept payments for any of the products or services you're building.

This is also a fully no-code implementation, which means that it should be accessible to devs and non-technical folks alike.


## Let's talk

If you found this useful, we'd love it if you followed Stripe:

📣 Follow us on [Twitter](https://twitter.com/StripeDev)
💬 Join the official [Discord server](https://stripe.com/go/developer-chat)
📺 Subscribe to our [Youtube channel](https://www.youtube.com/StripeDevelopers)
📧 Sign up for the [Dev Digest](https://go.stripe.global/dev-digest)
Destructuring Assignment
Tags: javascript, beginners, programming
Published: 2022-05-13 12:40:54

Completed my Destructuring assignment. I really enjoyed this lab because it was an easier way to pull out objects and my codes are a bit clearer. Below, I used different variables for this assignment, objects, arrays, and strings. It's an easy way to pick and choose the pieces of data I'd like to assign.
JavaScript is a challenge but once you start noticing patterns, you start getting the hang of it.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/09qzulgxena74avphf4e.png)
Coding World
Tags: javascript, flatironschool, coding, developer
Published: 2022-05-13 12:36:30

This was really great to create. I created a Tasklister Mini-Project for my cat LuLu. Haha! I built a function to-do list application that uses JavaScript to manipulate the DOM. I also used the **Event.preventDefault()** method to suppress the default actions.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r6vpyrjm8grivv4bygtd.png)
My VSCode Extensions
Published: 2022-05-13 12:27:42

**#The Basic**


- ESLint
  https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint

- Prettier - Code Formatter
  https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

- Prettier ESLint
  https://marketplace.visualstudio.com/items?itemName=rvest.vs-code-prettier-eslint

- Fold/unfold all icon
  https://marketplace.visualstudio.com/items?itemName=FerrierBenjamin.fold-unfold-all-icone

- PHP IntelliSense
  https://marketplace.visualstudio.com/items?itemName=zobo.php-intellisense

- Local History
  https://marketplace.visualstudio.com/items?itemName=xyz.local-history

- GitLens — Git supercharged
  https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens

- Auto Close Tag
  https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag

- Auto Rename Tag
  https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag
Quick Guide on how to Change Your WordPress Theme.
Tags: webdev, wordpress, beginners, productivity
Published: 2022-05-13 11:58:27

It is Guaranteed that there will be a point in time in the future when you are going to want to switch the theme on your WordPress site. This article is going to be your guide whenever you consider switching themes.

**Advice**

Use a general-purpose theme without style lock. I would suggest Astra or Ocean WP.you can then go ahead and pair your theme with a website builder like elementor. These general-purpose themes will enable you to create what I call a timeless website, a website that has none of its integral features tied down to a single theme.

**What Should I know before I change Themes?**

- Features tied to your theme
Avoid themes that have any of your integral website features tied to them because immediately you switch themes, you will lose these features. Always seek a theme that you can find an alternative to when you want to change it. 

- How is the content built?
You need to know the technology used to build your theme. Let's say a specific page builder was used to style certain pages. See how the content is created to know what you will lose or gain when you switch.

- Styled widgets

You need to be conscious of the widgets used to style your website.

**What will I have to Redo after I change my theme?**

- All customizer settings
You are going to have to re-customize the new theme

- Header and footer
The menus on either of the two and maybe the footer content.

- Widget locations
You will readjust the widgets according to your preferences

- Maybe your Content(Sad)
Unfortunately, some of your content might look out of place after. Make sure to change it.

**How do I go about this?**

You can go about doing this in two ways :

- Staging Area
Your web hosting service provides a staging area.WordPress-centered hosting companies have staging areas inbuilt in the Cpanel. You want to do this in a staging area because it doesn't affect your live website. Clients will continue visiting the site while you simultaneously work on it without affecting the functionalities.

- Migrate to a Local Host

Moving the website from the server to your computer, making the changes locally, then moving it back to the server. I have an article on this if you want to learn how to create a[ local development environment ](https://dev.to/programamkenya/creating-a-local-development-environment-with-wordpress-and-xampp-3676)  using WordPress and XAMPP.

**In Conclusion**

Changing WordPress themes can be a tricky affair, but following the proper procedures will have you done in no time at all.
Book Club: "Test Driven Development: By Example" #8
Tags: books, tdd, discuss
Published: 2022-05-13 11:24:14

---
title: Book Club: "Test Driven Development: By Example" #8
published: true
description: A chapter by chapter discussion of "Test Driven Development By Example" by Kent Beck
tags: books, tdd, discussion
series: Book club TDD By Example
---

## Chapter 8: Makin' Objects

This chapter is prep for removing the duplication of the `times` methods which multiply either Francs or Dollars.

>The next step forward is not obvious

No, it is not. What we achieve though, involves having the two methods return the same type (`Money` as opposed to either `Dollar` or `Franc`): Makes sense!

We also use a _factory_ in `Money` and that means we don't have to new up `Dollar` or `Franc` objects in the tests, but the book doesn't talk much about factories here, and since this terminology is used in a much simpler way here than I'm familiar with, I wanted to explore Java factories a little bit.

### Factory Pattern

A Factory is an object which controls the creation and/or access to other objects - like the teller in a bank or a librarian in a library.

This means that a factory (or _factory method_) can simply be a method which creates a new object.

```Java
class Library {

  /**
   * The librarian is a factory method, controlling 
   * the creation of book loans.
   */
   BookLoan Librarian(Book request) {
    return new BookLoan(request);
  }
}
```


But, instead of a librarian, we can have a dedicated factory method for the creation of the object, which makes the factory easier to maintain by encapsulating the creation behaviour, and it also allows us defer object instantiation to a sub-class.

**Abstract factory method**s need the subclasses to define an implementation.

**Concrete factory method**s are an interface and also define the implementation, and subclasses can override the implementation.

**Static factory method**s are efficient but don't allow subclasses to override the implementation. When invoked it's not needed to new up an instance like when using a constructor, and the instances can be controlled to avoid duplication and unnecessary object creation.

📚 Resources
- [GoF Design Patterns](http://w3sdesign.com/?gr=c03&ugr=proble#gf)
- [Applying the Factory Pattern to Java™ RMI](https://docs.oracle.com/javase/7/docs/technotes/guides/rmi/Factory.html)

🔎 View my code-along repo at https://github.com/ruthmoog/test-driven-development-by-example 

-----

![Book cover](https://learning.oreilly.com/library/cover/0321146530/250w/ ) Kent Beck's "[Test Driven Development: By Example](https://www.oreilly.com/library/view/test-driven-development/0321146530/)" was released in 2002. The book aims to explain how to use TDD to write quality code that works.