teleren/devto huggingface dataset:
NPM dependencies vs devDependencies
Tags: javascript, webdev, npm
Published: 2022-04-22 16:09:22

## tl;dr

Las `dependencies` son requeridas por nuestra aplicación en tiempo de ejecución. Paquetes como `react`, `redux` y `lodash` son todos ejemplos de dependencias. Las `devDependencies` solo son necesarias para desarrollar o compilar su aplicación. Paquetes como `babel`, `enzyme` y `prettier` son ejemplos de devDependencies.

## npm install

La diferencia real entre `dependencies` y `devDependencies` se ve cuando ejecuta `npm install`.

Si ejecuta `npm install` desde un directorio que contiene un archivo `package.json` (lo que normalmente hace después de clonar un proyecto, por ejemplo).

✅ Se instalarán todos los paquetes ubicados en `dependencies`
✅ Se instalarán todos los paquetes ubicados en `devDependencies`

Si ejecuta `npm install <package-name>` (lo que normalmente hace cuando desea agregar un nuevo paquete aL proyecto existente), es decir, `npm install react`.


✅ Se instalarán todos los paquetes ubicados en `dependencies`
❌ No se instalará ninguno de los paquetes ubicados en `devDependencies`

## Dependencias transitivas

Si el paquete A depende del paquete B y el paquete B depende de C, entonces el paquete C es una dependencia transitiva del paquete A. Lo que eso significa es que para que el paquete A se ejecute correctamente, necesita el paquete B instalado. Sin embargo, para que el paquete B se ejecute correctamente, es necesario que esté instalado el paquete C. ¿Por qué menciono esto? Bueno, las `dependencies` y `devDependencies` también tratan las dependencias transitivas de manera diferente.

Cuando ejecutas `npm install` desde un directorio que contiene un archivo `package.json`:

- `dependencies` ✅ Descarga todas las dependencias transitivas.
- `devDependencies` ❌ No descarga ninguna dependencia transitiva.

## Especificar dependencies frente a devDependencies

A partir de NPM 5, cuando ejecuta `npm install <package-name>`, ese paquete se guardará automáticamente dentro de sus `dependencies` en su archivo `package.json`. Si quisiera especificar que el paquete específico debería incluirse en `devDependencies` en su lugar, agregaría la marca `--save-dev`.

```bash
npm install prettier --save-dev
```
## Instalación en un servidor de producción

A menudo, necesitará instalar su proyecto en un servidor de producción. Cuando haga eso, no querrá instalar `devDependencies` ya que obviamente no las necesitará en su servidor de producción. Para instalar solo las `dependencies` (y no `devDependencies`), puede usar la marca `--production`.

```bash
npm install --production
```

![Profile](https://res.cloudinary.com/khriztianmoreno/image/upload/c_scale,w_148/v1591324337/KM-brand/stickers/sticker-3_2x.png)


### @khriztianmoreno
Why mistakes at work should not be discriminatory (and why they sometimes are).
Published: 2022-04-22 16:06:33

### Nobody was born learned

Since i was born my grandmother tells me “Nobody was born learned”, but people at work seems didn’t remember this. Everyday people learn something, and the biggest lesson comes from mistakes. Everyone knows how is complicated write code and write good code if you are a junior ( in most cases good code doesn’t exist 😛 ), but senior doesn’t care what you did, and why. If you did some mistakes, write some bugs or fails a new improvement, you will be discriminated against. It is not something that happens the first time, but over time. If you fails more times, your credibility within the team drops and no one cares your mood. You can study, learn, grow, develop cool stuff (with errors), contribute to the best open source project, but your reputation will not be rebuilt. And if you are never appreciated, there is a slow detachment from your work team, which will lead you to fall into the trap of the impostor syndrome. Like a dog chasing its own tail, you will think that the fault is yours. 

Let me clarify, this speech is quite crude and written in a flash, many may never find themselves in this condition, but we are talking about a very subtle discrimination, almost imperceptible, which can cause annoyance when you suffer it.

### Look at yourself in the mirror

If at work you are discriminated, not appreciated or simply ignored, please look at yourself in the mirror.

The mirror know exactly who are you, what are you doing and where are you . Not a senior or tech lead in company, until the other day they did not know about your existence, nobody cares about your growth. Only to yourself. No one would feed you, with the risk that one day you might take his place. It is survival in a world which run too fast. Make mistakes as many times as you want, you don't have to justify yourself in front of anyone. Companies and people pass, your goals remain and evolve over time.


Photo by <a href="https://unsplash.com/@ingagezalian?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Inga Gezalian</a> on <a href="https://unsplash.com/s/photos/mirror-1920x1080?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
Solved "Convert HTML Entities" algorithm // FreeCodeCamp
Published: 2022-04-22 16:03:52

```
function convertHTML(str) {
  let arr = str.split(' ');
  let regex = [['&','&amp;'],['<','&lt;'],['>','&gt;'],['"','&quot;'],["'",'&apos;']];
  for(let x=0;x<arr.length;x++){
    for(let i=0;i<arr[x].length;i++){
      for(let y=0;y<regex.length;y++){
      (arr[x][i] == regex[y][0]) ?
        str = str.replace(arr[x][i],regex[y][1]) : false;
    }
    }
  }
  return str;
}
console.log(convertHTML("Sixty > twelve"));
 
```
The correct way of asking questions.
Tags: questions, mentoring, webdev, discuss
Published: 2022-04-22 15:54:19

**Hello Developers**

I am an intermediate developer. I had great mentors to whom I could ask any question and they would help me. Now, as time passes I get many questions from the juniors, but I think they lack the ability to ask a question properly. Well, you might ask who I am to lecture on this topic? I learned basically everything from asking questions and googling stuff.

## Try to google before asking the question.
Google is an essential skill for any developer/programmer. Whenever you are struck first approve Google.
### Example
Before Googling

**You:** How should I pass a child state to a parent state?.

**Mentor:** Have you googled it?.

**You:** No...

After Googling

**You:** I am unable to pass child state to parent state. I googled it and it says [this] and [this].  

**Mentor:** Okay, do [this] and refer to [this] article.

## Tell us the real problem.

Okay, let's say you are working on the front-end part of the project, and upon fetching data from the API you run into a CORS error. You google it and are still unable to solve it.

### Example

before not mentioning the real problem.

**You:** I am trying to solve the CORS error and I did [this] and [this].

**Mentor:** CORS are tricky. I can't exactly solve your problem.

After mentioning the real problem.

**You:** While fetching the data from the API, I ran into a CORS error and I did [this] and [this].

**Mentor:** Maybe the API is not handling requests properly. Submit the response and logs to the backend team.

## Some tips.
- Try to solve before asking the question.
- Google, Google, and Google.
- Ask the real question, not the solution you are working on.
- If you are stuck on a problem for too long, take a break.
- And above all, ask the question.

**HappyCoding**
This is [Shareef](https://shareef.hashnode.dev/)
[My Twitter](https://twitter.com/shareefBhai99)
[My Linkedin](https://www.linkedin.com/in/nadeem-shareef-7a8394182/)
GitHub VS Local Git Workflow
Tags: git, github, workflow, comparison
Published: 2022-04-22 15:50:25


I have had three article on basics, getting started and branches in Git & GitHub. Have a look below:

1. [Git & GitHub - Best Version Control and Source Code hosting platforms respectively!](https://dev.to/wardaliaqat01/git-github-best-version-control-and-source-code-hosting-platforms-respectively-1m8b)
2. [Get your way started towards Git & GitHub!](https://dev.to/wardaliaqat01/get-your-way-started-towards-git-github-47fh)
3. [Working with Git Branches!]()

We observe a significant difference between Local Git and GitHub workflows. To illustrate my point, I made a comparison.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/csd5h1on665e8la4li8k.png)


###Let me know what do you think about it????

## Connect with me:
[LinkedIn](https://www.linkedin.com/in/warda-liaqat/)
[Instagram](instagram.com/warda_Liaqat01)
[Twitter](https://twitter.com/CreativityWarda)
Use cases collect from top Luos developers
Tags: usecase, opensource, devjournal, luos
Published: 2022-04-22 15:36:41

We want to better understand what developers are doing with Luos, for what project, for what purpose.
⏩ https://luos.typeform.com/usecases
Luos may be involved in the whole project or only in a small part.

In this case, we want to make an inventory of projects. These may be completed or in progress.

We will reward the owners of the best use cases with a **$250 Amazon voucher and three months of dedicated support by Luos engineers** 🙂

It's fast (< 2 min) and easy to participate: ⏩https://luos.typeform.com/usecases

Several projects will be selected ⭐
Top Trends in Software Testing: Infographic
Tags: testing, showdev, webdev, programming
Published: 2022-04-22 15:31:54



Software testing industry has seen a lot of ups and downs when it comes to top trends. It is a very versatile field that keeps on changing day by day. Here, we’ve listed some of the top trends that you can see evolving in 2018.

Note: [Free Convert Text to HTML Entities Online](https://www.lambdatest.com/free-online-tools/text-to-html-entities-convertor?utm_source=devto&utm_medium=organic&utm_campaign=apr22_sd&utm_term=sd&utm_content=free_tools) - Text to HTML Entities Converter saves and shares HTML Entities, which are used to display characters in HTML. In addition, the converter helps to convert text to numbers that represent reserved characters, which a browser can then display.

![](https://cdn-images-1.medium.com/max/2400/0*-UMcLYM4wi2BXJJd.jpg)

Note: [Free CSS Minify Online](https://www.lambdatest.com/free-online-tools/css-minify?utm_source=devto&utm_medium=organic&utm_campaign=apr22_sd&utm_term=sd&utm_content=free_tools) - CSS Minify file means that unnecessary characters in the source code are removed to reduce the file size and help the site load faster. When a user requests a web page, the minified version is sent instead of the full version, resulting in faster response times and lower bandwidth costs. This helps your site load faster and also improves your search engine rankings.

**References:**

[https://www.upwork.com/hiring/for-clients/top-5-emerging-software-testing-trends-follow-2018/](https://www.upwork.com/hiring/for-clients/top-5-emerging-software-testing-trends-follow-2018/)
[http://www.cigniti.com/blog/10-emerging-trends-in-software-testing-predictions-for-the-next-decade/](http://www.cigniti.com/blog/10-emerging-trends-in-software-testing-predictions-for-the-next-decade/)
[https://www.kualitee.com/blog/testing/software-testing-trends-in-2018/](https://www.kualitee.com/blog/testing/software-testing-trends-in-2018/)
[https://dzone.com/articles/devops-how-to-achieve-rapid-mobile-app-development](https://dzone.com/articles/devops-how-to-achieve-rapid-mobile-app-development)
[http://www.effectiveperformanceengineering.com/portfolio-item/gartner/](http://www.effectiveperformanceengineering.com/portfolio-item/gartner/)

Note: [Free Credit card number generator](https://www.lambdatest.com/free-online-tools/credit-card-number-generator?utm_source=devto&utm_medium=organic&utm_campaign=apr22_sd&utm_term=sd&utm_content=free_tools) - A Credit card number generator is a tool that allows you to generate random IP addresses conveniently. Credit Card Number Generator generates valid credit card numbers with all required details, such as name, address, expiration date, CVV code, and security code (PIN). The generated credit card number can be used for many things such as free trials, testing and registrations. This Credit card number generator by LambdaTest is free, easy to use, and doesn’t have any ads or popups. Try now!
NXOPEN UFUNC UF_CALL Macro
Tags: c, macro
Published: 2022-04-22 15:27:03

---
title: NXOPEN UFUNC UF_CALL Macro
published: true
description: 
tags: C, MACRO
//cover_image: https://direct_url_to_image.jpg
---

 ```
#define UF_CALL(X) (report_error(__FILE__, __LINE__, #X, (X)))


int report_error(char *file, int line, char *call, int irc)

{

if (irc)

{

char err[133],

messg [300];

UF_get_fail_message(irc, err);

sprintf(messg, "\n%s\nerror %d at line %d in %s\n%s", err, irc, line, file, call);

LogMsg1("%s\n", messg);

}

return(irc);

}
```
Validation mask through Regex with Python
Tags: regex, python, computerscience
Published: 2022-04-22 15:26:39

## Introduction

Regular expressions (or **Regex**) is a robust approach used to analyze whether a string belongs to a certain language, and is used in the validation of several fields, such as email and password, as will be seen here. The library re of Python was used to validate each field.

The regex is a composition of symbols, characters with special functions, what, grouped among themselves and with literal characters form a regex. The regex is interpreted as a rule witch will indicate success if it matches all of his conditions.

To build the validations masks of email and password is considerate the following alphabets: **Σ** = {a, b, c, …, z}, **Γ** = {A, B, C, …, Z} and **N** = {0, 1, 2, …, 9}.

## Validation Masks

The strings accepted by the email field have symbols from **Σ** and must contain a symbol @ and end with .br, where it must have at least one symbol **Σ** between @ and .br. Furthermore, the email must start with the @ symbol.

The password field may contain symbols of all alphabets **Σ**, **Γ** and **N**. It is necessary at least one symbol of **Σ** and **N**. Besides, the password must contain, necessarily, length of 8.
The regex to validation mask of email is given as following:

```python
^[a-z]+@[a-z]+.br$
```

This expression accepts at least one symbol of **Σ**, where the character ^ indicates that start with symbols from a to z ([a-z]), the character + ensures at least one symbol of **Σ**, and $ ensures that string is finished with .br.

The password regex is showed bellow:

```python
(?=.*\d)(?=.*[A-Z])[a-zA-Z0-9]{8}$
```

The expression (?=.*\d) ensures at least one symbol of **N**. In the same way, the expression (?=.*[A-Z]) ensures at least one symbol of **Γ**. Besides, the two first expressions indicate that no matter where symbols of **N** and **Γ** appear in the password. Lastly, the expression [a-zA-Z0–9]{8} ensures symbols of all alphabets, and the string must have exactly a length of 8.

## Example
The function match of re python library is used to test the regex of each field. The first argument of function match is the regex created, and the second is the string to be tested. Bellow is showed the application of **re**.

```python
import re
regex = '^[a-z]+@[a-z]+.br$'
string = 'whoisgamora@.br'
if bool(re.match(regex, string)):
    print('Valid email!')
else:
    print('Invalid email!')
```

This example generates the message `Invalid email!`, because there isn’t any symbol of **Σ** between @ and .br.

---
A complete application of the validation mask through regex can be tested in [Colab](https://colab.research.google.com/drive/13epAFLffxqql1_bJPx3awIt9EmBp5y5G?usp=sharing). Other fields were tested in the Colab, as name and last name, and telephone number.
5 Free React UI Components You Didn’t Know Existed
Tags: programming, webdev, react, frontend
Published: 2022-04-22 21:17:50

---
title: 5 Free React UI Components You Didn’t Know Existed
published: true
date: 2022-04-22 15:17:29 UTC
tags: programming,webdevelopment,react,frontenddevelopment
canonical_url: https://javascript.plainenglish.io/5-free-react-ui-components-you-didnt-know-existed-9007cf52e28b
---

[![](https://cdn-images-1.medium.com/max/2600/0*aJ79xbXG0UN60qnM)](https://javascript.plainenglish.io/5-free-react-ui-components-you-didnt-know-existed-9007cf52e28b?source=rss-1282c85b5cbc------2)

1. Mantine
2. react-easy-crop
3. react-colorful
4. React Syntax Highlighter
5. TipTap

[Read the full article on JavaScript in Plain English »](https://javascript.plainenglish.io/5-free-react-ui-components-you-didnt-know-existed-9007cf52e28b?source=rss-1282c85b5cbc------2)


---------

Photo by Lautaro Andreani on Unsplash
Nextless.js V2: Full-stack React SaaS Boilerplate with Serverless backend
Tags: react, webdev, showdev, nextjs
Published: 2022-04-22 15:11:23

---
title: Nextless.js V2: Full-stack React SaaS Boilerplate with Serverless backend
published: true
description: Full-stack Node React SaaS Starter Template with authentication, payment, teams & multi-tenancy using modern stack like TypeScript, Tailwind CSS, AWS, Serverless.
tags: react, webdev, showdev, nextjs
cover_image: https://nextlessjs.com/assets/images/hero-image.png
---

In the past, I've shared my story how I've built my first SaaS application in 5 months. From this experience, I've learned a lot about the full-stack development. So, I took the opportunity to build a boilerplate for a SaaS application. My goal was to help other developers to build their own SaaS application faster.

In September 2021, I've released the first version of Nextless.js, a full-stack React SaaS boilerplate built with modern technologies: Serverless, TypeScript, Tailwind CSS, AWS and more. Today, I'm happy to announce that I've released the second version of Nextless.js with team & multi-tenancy support.

The team support and multi-tenancy took me almost two months to build and I've almost rewrite the whole application to implement this important feature for SaaS application.

You can find a live demo at [React SaaS Boilerplate demo](https://demo.nextlessjs.com) to play around with the application. You can also check out the [official Nextless website](https://nextlessjs.com) for more information.

[![Full-stack React SaaS Starter](https://nextlessjs.com/assets/images/hero-image.png)](https://nextlessjs.com)

Good news! Even with this massive refactoring, all features are still working perfectly:

- Email authentication with Social Login (Google, Facebook, Amazon, Apple)
- Stripe payment integration
- Landing Page and Dashboard UI
- Developer experience with linter, code formatter, type checking, VSCode configuration, etc.
- Code example with a Todo app
- Documentation
- 100% Serverless
- Infrastructure as Code

You can find a demo video on YouTube:

{% embed https://www.youtube.com/watch?v=PRdtg-JDotc %}

Like always, my goal is to help other developers to build their own SaaS application faster. So, they can start with the boilerplate and focus on their idea instead of losing time on boring configuration.

Find more information about Nextless.js: [Full-stack React SaaS](http://nextlessjs.com).
Connect a Webflow Form to an Airtable Database
Tags: productivity, webdev, beginners, javascript
Published: 2022-04-22 15:09:44

Add interactivity to your Webflow website by collecting contact information from your customers using a Pipedream workflow - in 5 minutes without code!

Contact forms are a vital part of building websites, they're the first layer of interaction between you and your audience, and we'll show you how to start building your own database of contacts using Airtable.

Airtable is a great way to store data and view it in different ways. 

After you have stored your contacts in Airtable, you can customize the view to make a Trello type Kanban board, and much more.

We'll show you how to connect your Webflow forms to a Pipedream workflow, so you can leverage the power of data collection from your customers.

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

### Have an idea for a Speed Run? Let us know!

{% embed https://www.jotform.com/220694247042049 %}

We're always looking for new Speed Run ideas to feature on the show, fill out the 3 question form below for a chance to have a shout out & and your idea brought to life with a Pipedream workflow!

### Learn more and get connected!

🔨  Start building at https://pipedream.com
📣  Read our blog https://pipedream.com/blog
💬  Join our community https://pipedream.com/community
Making properties read only outside their scope using private(set) in Swift
Tags: swift, ios
Published: 2022-04-22 15:29:56

---
title: Making properties read only outside their scope using private(set) in Swift
published: true
date: 2022-04-22 15:06:28 UTC
tags: ["swift", "ios"]
canonical_url: https://tarikdahic.com/posts/making-properties-read-only-outside-their-scope-using-private-set-in-swift/
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sztc9kn184yy4k69x1is.jpg
---

I recently discovered Swift feature where setter for class and struct properties could be set to private while getter is internal or publicly accessed. This allows us to expose properties to the outside world without worrying if someone is going to change them in the future. I mostly do this to make dependencies of some type accessible.

The example below shows how could we use this in a class or a struct.

```swift
class Example {
  // prop will have an internal access modifier
  private(set) var prop: Type
  
  // prop with public access modifier
  public private(set) var prop: Type
}

```

`prop` can be changed (set) only in the scope of the encapsulated _struct_ or _class_ but the outside world can only read it.

Setting a private setter only works with properties marked as `var` and not `let` because properties marked with `let` are constants and by nature they are immutable.

This Swift feature could also be used in cases when we have a read-only property backed by another private property. Something like this:

```swift
class Example {
  private var _prop: Type
  
  var prop: Type {
    get {
      return _prop
    }
  }
}

// Using private(set) makes code more readable and reduces the complexity:

class Example {
  private(set) var prop: Type
}

```
What Does Protocol Mean?
Published: 2022-04-22 15:05:21

A protocol is a set of rules and guidelines for communicating data. Rules are defined for each step and process during communication between two or more computers. Networks have to follow these rules to successfully transmit data.

Techopedia Explains Protocol
Similar to programming languages, protocols are based on specific rules and regulations for computing and are designed for efficiency. Each rule is defined in different terms and is assigned a unique name. Protocols specify the standards for communication and provide detailed information on processes involved in data transmission. Such processes include:

Type of task
Process nature
Data flow rate
Data type
Device management
A single process can be handled by more than one protocol simultaneously. This coordination of protocols creates a protocol family.

Follow Me Please?
Landing page : Yoga, using HTML, CSS and JS 🚀🚀
Tags: beginners, tutorial, css, webdev
Published: 2022-04-22 15:04:26

🚀[Live View](https://deepakydv9315.github.io/yoga-landing-page/)
😍[GitHub Repo](https://github.com/deepakydv9315/yoga-landing-page)
💥[Source Code](https://github.com/deepakydv9315/yoga-landing-page)

> Clear your concepts by building projects

## Try this project.

![Preview](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j1yryt4erxowo4dd0q0q.png)


Drop a 💖