teleren/devto huggingface dataset:
How to run Cypress test cases across multiple domains
Tags: javascript, cypressio, cypress, programming
Published: 2022-04-26 17:19:00

How to run Cypress test cases across multiple domains

**Problem Statement**

Before cypress version 9.6.0 if we want to run test cases in two domains under the same test case it gives us a different origin error.

In Version 9.6.0 this problem is solved, Now we can easily execute our test cases across multi-domain by using cy.origin() command.

Please see in detail in below link

https://qaautomationlabs.com/how-to-run-cypress-test-cases-across-multiple-domains/

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g5f675axtl4kxlo51219.jpg)
How does the fetch method work
Tags: javascript, webdev, codenewbie, programming
Published: 2022-04-26 17:03:06

### DISCLAMER:

* This series simplifies how stuff work to give you an idea of what to expect but this is not the actual code and I will include the actual docs of the steps of how stuff work with each part of this series for the super nerds out there.

* If you want to know more about something or how it actually works write a comment and I might just do it.


### what is the fetch method?

The global fetch() method starts the process of fetching a resource from the network, returning a promise which is fulfilled once the response is available.

### How it works:

first of all we need to dissect the fetch method to understand it

we know that it takes an API string URL as a parameter 
and returns a Promise

so let us implement that

```js

function fetch2(API)
  return new Promise(resolve => {
   
});
```

Yaaay we did it! 



not that fast we now need to know what happens to the API string

the fetch transforms the URL with the options if any to a [Request](https://developer.mozilla.org/en-US/docs/Web/API/Request) object


> You can actually pass a Request object directly.

and after that the fetch runs the Request and receives a Promise that gets resolved to a [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response) Object

And this is how it resolves the promise.

Remember the  ***fetch2*** function up there let us continue the implementation

```js

function fetch2(API)
  const Response = someMagicalService(Request(API))
  return new Promise(resolve => {
   const interval = setInterval(() =>{
     if(Response.status){
      clearInterval(interval);
      resolve(Response);
     }
   }, 100)
});

```

the fetch keeps checking the status of the response and when a status comes the interval "Response checking" stops and the promise is resolved.


the ***someMagicalService*** part can be broken apart to multiple lines but for simplicity I just called it that


Do not forget to comment with any topic that you want to know about in some detail - as long as it is related to (JS, ReactJS) -

And leave a  Heart & follow if you want to read more articles like this


References:
[Fetch](https://fetch.spec.whatwg.org/#fetch-method)
Day-74 Training At Ryaz
Tags: javascript, webdev, beginners, programming
Published: 2022-04-26 16:44:37

- Date:26/04/2022
- Day:Tusday

Today, I started at about 10:40 am as I was in progress to complete the java script course so, today I started with the left over task firstly I started with flat and flat map The flatMap() method returns a new array formed by applying a given callback function to each element of the array, and then flattening the result by one level. It is identical to a map() followed by a flat() of depth 1, but slightly more efficient than calling those two methods separately. the flat() method creates a new array with the elements of the subarrays concatenated into it.
The map() method creates a new array whose elements are the results of a mapping function.after this I started with sorting arrays it basically have sort() function and it have fowling functionalites The sort() sorts the elements of an array,The sort() overwrites the original array,The sort() sorts the elements as strings in alphabetical and ascending order.then I started with some more ways of compleating the arrays and after completing it I started with twelfth module as it included with converting and checking numbers in this I basically learnt that we can convert one type to another and we can check the type as of boolean types it returns as true and false. so, this way my day ended up and I got to learn many new things.
Thế Giới Làm Đẹp - Mỹ phẩm chính hãng & làm đẹp hàng đầu Việt Nam
Published: 2022-04-26 16:38:05

Thế Giới Làm Đẹp - Khu phức hợp mỹ phẩm chính hãng & làm đẹp đẳng cấp, chuyên nghiệp hàng đầu tại Việt Nam, đáp ứng tất cả nhu cầu làm đẹp của chị em.
Địa chỉ : 722 Quang Trung, Phường 8, Gò Vấp, TP Hồ Chí Minh 
Chi tiết liên hệ tại : 
Website : https://thegioilamdep.vn/duoi-toc/   
Thế giới làm đẹp : https://thegioilamdep.vn/ 
Dịch vụ tóc : https://thegioilamdep.vn/dich-vu-toc/ 
Dịch vụ nail : https://thegioilamdep.vn/dich-vu-nail/ 
Cắt tóc : https://thegioilamdep.vn/cat-toc/ 
Phục hồi tóc : https://thegioilamdep.vn/phuc-hoi-toc/  
Twitter : https://twitter.com/thegioiilamdep 
Pinterest : https://www.pinterest.com/thegioilamdeptoc/ 
Linkedin : https://www.linkedin.com/in/thegioilamdeptoc/ 
Flickr : https://www.flickr.com/people/thegioilamdeptoc/ 
Tumblr : https://thegioilamdeptoc.tumblr.com/ 
#thegioilamdep 
#the_gioi_lam_dep 
#duoitoc 
#dichvuduoitoc 
#hairsalon 
#salontoc 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z3nmkuhl4uj9ie9ojaa4.jpg)
Configurando JWT en Django Rest Framework
Tags: django, python, backend, djangorestframework
Published: 2022-04-26 16:32:55

Lo primero que tenemos que hacer es instalar simplejwt:

```python
pip install djangorestframework-simplejwt
```

en este caso yo lo tengo configurado junto a mi archivo requirements.txt:

```python
Django==4.0.0
django-cors-headers
django-getenv
djangorestframework==3.12.2
psycopg2-binary
djangorestframework-simplejwt
```

Una vez instalada la dependencia vamos a nuestro proyecto, y en urls.py agregamos las siguientes rutas:


```python
path('api/token/', TokenObtainPairView.as_view(), name='token_obtain_pair'),
path('api/token/refresh/', TokenRefreshView.as_view(), name='token_refresh'),
```

En settings.py en las configuraciones de REST_FRAMEWORK definimos la autenticación que vamos a usar por defecto con el framework:


```python
REST_FRAMEWORK = {
    'DEFAULT_AUTHENTICATION_CLASSES': (
        'rest_framework_simplejwt.authentication.JWTAuthentication',
    ),
    
    'DEFAULT_PERMISSIONS_CLASSES':(
        'rest_framework.permissions.IsAuthenticated'
    )
}
```

Sin olvidarnos que en INSTALLED_APPS tenemos que indicar que vamos a usar rest_framework:

```python
INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'rest_framework',
]
```

Una vez hecho esto, en nuestras views podemos pedir que para que alguien haga una petición hacia nuestro endpoint, como mínimo tiene que estar autenticado, y el método de autenticación que configuramos es el de JWT:

```python
from django.http import JsonResponse
from rest_framework import permissions, status
from rest_framework.decorators import api_view, permission_classes


@api_view(["POST"])
@permission_classes([permissions.IsAuthenticated])
def create_post(request):
    return JsonResponse({'msg': 'todo funcionando'})
```

Probando la configuración:

- Sin autenticación:


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

- Autenticándonos para obtener el token


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


- Utilizando el token para hacer peticiones


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h42d8hxaaorm6fpme6sf.png)
About planning a quality testing program for the software [a.k.a Test Plan ...]
Published: 2022-04-26 16:29:03

Creating a software quality assurance program can seem daunting, but it does not have to be ...
 By taking the time to understand the product and the risks involved, it is possible to create a comprehensive plan that will help ensure the quality of the software.
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l44eh3gevlrldrgbpi07.jpg)
The first step is to understand what you are trying to achieve.
 What are your goals for the product? What are the main features or functions that need to be tested?
 Once there is a clear understanding of the goals, one can begin to develop a strategy on how to best achieve them.
 
Next, the risks involved in releasing the product should be considered.
 What can go wrong and how will it affect users? How will you reduce these risks?
 This is an important step in creating a quality assurance testing program - without considering the risk, areas that require attention may not be tested and it is a pity ...

 With both goal and risk in mind, we will write specific tests that will cover all aspects of the software. This includes functionality testing (testing if everything works as planned), usability testing (testing that users can easily navigate menus and buttons), performance testing (making sure system response times are acceptable) and more.

Test plan should also be taken to consider end cases - exceptional situations that may occur infrequently, but still
May cause problems if not treated properly
Once the tests are developed, it is important to apply them effectively at all stages of development.
You can use a checklist throughout the development time so that everyone involved knows what needs to be checked and when,
Also, make sure that the testing team has access to the appropriate tools and data needed to carry out their work properly.
Introducing myself
Tags: aws, bioinformatics
Published: 2022-04-26 16:14:36

Hi there! My name is Lee and I’m starting a new role as a Principal Developer Advocate at Amazon Web Services (AWS) on our HealthAI services team. I’ve had several roles at AWS like a Technical Business Developer, a Specialist Solutions Architect, and a Product Manager. All of them filled with interesting and fun challenges to solve on behalf of AWS customers.

Like several of my [developer](https://dacort.dev/) [advocate](https://dev.to/deekob) [colleagues](https://www.linkedin.com/in/angelpizarro/), I want to help developers make the best use of the cloud. In particular, I want to do this for the bioinformatics and genomics community. There is so much genomics data being generated in the world - analyzing it at scale in the cloud is how we’re going to make sense of it all.

Working at AWS has been an exciting journey filled with an incredible amount of learning, and I don’t see that stopping any time soon. As a developer advocate, I’m expecting to learn a lot from the bioinformatics and genomics community about what works well and how things can be improved. Everything I learn, I plan to share here.

I’ve got lots of ideas and projects I’m working on, from how to use new AWS products and services for genomics, to highlighting cool bioinformatics tools that work well in the cloud. First in the queue is how to [profile workflows using the Amazon Genomics CLI](https://dev.to/wleepang/profiling-workflows-with-the-amazon-genomics-cli-1fg4). I hope you enjoy it, and am looking forward having you dive in with me for what comes next!
ngStyle in Angular
Tags: angular, programming, webdev
Published: 2022-04-26 16:11:58

Angular **NgStyle** is a built-in directive that lets you set a given DOM element’s style properties. The key is a style name, and the value is an expression to be evaluated. The resulting non-null value, expressed in the given unit, is assigned to the given style property.


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

In **app.component.html:**

```html
<input type="text" [ngStyle]="{'color':'red', 'font-weight':'800'}" [(ngModel)]="value">

<label [ngStyle]="{'color':'blue', 'font-weight':'800'}">{{value}}</label>

<input type="text" [ngStyle]="{'color':'green', 'font-weight':'800'}" value="{{value}}">
```

We can also use conditional statements inside of ngStyle to display colors based on the given conditions.

Thank You !!! 😉

**Reference:** [https://www.c-sharpcorner.com/article/ngstyle-in-angular/](https://www.c-sharpcorner.com/article/ngstyle-in-angular/)
Elon Musk promised that he will open the source twitter algorithm.
Tags: twitter, source, freespeach, devops
Published: 2022-04-26 16:05:42

Elon Musk promised that he will open the source twitter algorithm. Just after few hours of the announcement of his twitter acquisition, the algorithm repo showed up on GitHub. It's still empty though. If the twitter algo is open-source this will be a huge win for free speech, privacy, and internet.
[Github](https://github.com/orgs/twitter/repositories)
We reward the owners of the best use cases ⭐
Tags: opensource, usecase, devjournal, luos
Published: 2022-04-26 15:57:28

If you miss the news, we reward the owners of the best use cases with a **$250 Amazon voucher and three months of dedicated support by Luos engineers** 🙂

We want to better understand what developers are doing with Luos, for what project, for what purpose. 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.
It's fast (< 2 min) and easy to participate: [https://luos.typeform.com/usecases](https://luos.typeform.com/usecases)

Several projects will be selected ⭐
Creating multiple Vercel deployments with different configurations from a single GitHub repo
Tags: vercel
Published: 2022-04-26 15:47:25

###### (A Japanese translation is available [here](https://qiita.com/TomoyukiAota/items/54f533f6db0858d950e2).)

There was a case that I wanted to create multiple Vercel deployments with different configurations from a single GitHub repo.

The motivation is that I want to deploy [photo-data-viewer repo](https://github.com/TomoyukiAota/photo-data-viewer) as 1) a standalone web app called [Photo Data Viewer](https://photo-data-viewer.vercel.app/) and 2) a feature in an Electron app called [Photo Location Map](https://tomoyukiaota.github.io/photo-location-map/).

Implementation-wise, webpack's target needs to be different:

 - Web app needs `target === 'web'` (default)
 - Photo Location Map feature needs `target === 'electron-renderer'`


# How to configure

 1. From photo-data-viewer repo, create 2 Vercel projects.
   - At first, I had an assumption that only 1 Vercel project can be created per GitHub repo. It took a while to recognize that this is wrong...
 1. Set different environment variables for different Vercel projects.
 1. Reference the environment variables in the code.
   - In `next.config.js`, when environment variable `PDV_IN_PLM` is set to `'True'`, `config.taget = 'electron-renderer'` is set.
   - [Code](https://github.com/TomoyukiAota/photo-data-viewer/blob/07bfc5f09184468fa4368c692a7ad023122880d3/next.config.js#L29-L31)


# Deployments

The 2 Vercel projects are deployed as follows:

| Vercel project              | URL                                                                                                                |
| :---------------------- | :------------------------------------------------------------------------------------------------------------------ |
| Web app              | https://photo-data-viewer.vercel.app                                     |
| Photo Location Map | https://pdv-in-plm.vercel.app  |

Note that https://pdv-in-plm.vercel.app/ does not work in the web browser. It is built for Electron renderer process, so it works well when it is opened from Electron renderer process like Photo Location Map.


# Reference

https://github.com/vercel/vercel/discussions/4879#discussioncomment-356114
Hello Gitpod 🧡
Tags: dx, career, gitpod
Published: 2022-04-26 15:28:35

---
title: Hello Gitpod 🧡
published: true
description: At the beginning of March this year, I've joined gitpod.io ✨
tags: dx, career, gitpod
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d9gavcvs3t9dljzh9hwq.png
---

I meant to write this blog post a month ago, but... life happened :)

I generally write technical articles on my blog rather than talking about my personal life, but 4 years ago, I wrote [Hello DAZN](https://andreafalzetti.github.io/blog/2017/11/01/hello-dazn.html), and I want to keep up with the tradition, so... Hello Gitpod 🧡

At the beginning of March this year, I've joined [gitpod.io](https://gitpod.io) ✨

![gitpod.io](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ejm04qsh85h5k1xcx2a0.png)

I've spent the last few years at DAZN, focusing on DevX (Developer Experience), empowering fellow engineers to get their job done smoothly and efficiently.

In 2018, I was already speaking about [DevX](https://andreafalzetti.github.io/blog/2018/10/25/10-tools-to-boost-your-developer-experience.html).

But, it's thanks to [Cirpo](https://uk.linkedin.com/in/cirpo) and the [DAZN DX team](https://medium.com/dazn-tech/developer-experience-dx-at-dazn-e6de9a0208d2) that I realised how much I liked the subject.

When I heard about Gitpod, it was the same day GitHub announced Codespaces, and my colleague [Lou](https://uk.linkedin.com/in/loujaybee) announced he would join Gitpod.

Since that day, I've become a user, a customer, and a community member of Gitpod because I immediately saw the benefits of a cloud development environment. I started using it for day-to-day work.

Over time, I gitpodified most of my repositories.

In fact, I am writing this very blog post which requires `Jekyll` to run using Gitpod.

You might think I am exaggerating, and it's overkill to gitpodify my own blog...

Assuming you have already cloned the repo locally and installed the project dependencies, starting a new blog post with `Jekyll` requires you to locate the project on your machine, open your favourite editor, open the terminal, launch Jekyll, etc. 

With Gitpod, all I have to do is press this green button :)

![gitpod-github-button](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bnki05v79anw421i5sxw.png)

And in matter of seconds, I have VS Code open in the cloud, Jekyll up and running thanks to Gitpod automatically running for me these commands:

```shell
git clone ..

bundle install ⬇️

bundle exec Jekyll serve --watch --drafts

# > open VS Code

# > open browser with live preview
```

😎

Enough with selling Gitpod.

In conclusion, I want to say that I am incredibly enthusiastic to have the opportunity to impact the Developer Experience of thousands of developers and shape the future of Cloud Development Environments 🧡 ✨

Thanks 🙏👋
Choosing the Right Software Development Model to Improve the Project Flow
Tags: softweare, development, trends
Published: 2022-04-26 15:18:29

When it comes to software development, specialists come across some software development models to choose from. Each of them leads the developer a certain way considering project scope, timeframe, project size, and budget or engineering level.

Once you choose the right software development model, it will improve the team’s productivity, reduce defects in the final code, and facilitate product maintenance.
Read more: [https://innovecs.com/blog/software-development-models/](https://innovecs.com/blog/software-development-models/)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bg1ukdpc6d04t3382ng2.png)
Pipenv and Django
Tags: django, pipenv, python
Published: 2022-04-26 15:17:39

## How to setup pipenv for django
pipenv is a tool that allows you to create virtual environments and manage python dependencies effectively. If you need more information regarding pipenv, Read this

**Django** is a high-level Python Web framework that encourages rapid development and clean, pragmatic design. Built by experienced developers, it takes care of much of the hassle of Web development, so you can focus on writing your app without needing to reinvent the wheel. It’s free and open source. Ridiculously fast.

```sh
#setup
# create solution directory
$ mkdir my-first-django-project 
$ cd my-first-django-project
# install pipenv
$ pip install pipenv
# installs django framework
$ pipenv install django
# create django project
$ pipenv run django-admin startproject project .
# initialize django app
$ pipenv run django-admin startapp app
# fire-up python web browser
$ pipenv run python manage.py runserver
```
Warehouse Optimization Tips To Enhance Your Revenue Stream
Tags: softweare, development, trends
Published: 2022-04-26 15:16:58

Traditional warehouses (or distribution centers) have faced the need for transformation and warehouse optimization due to two driving trends.

Firstly, there’s a shift in the nature of fulfillment and distribution: customers expect agile and highly responsive service. To meet the needs of sophisticated customers companies should optimize the collaboration of men and machines to create highly productive collaboration.

Secondly, warehouse management is experiencing the boom of technological innovation. So, to lead the market, companies should get acquainted with the warehouse optimization tips applying solutions empowered by IoT, AI, autonomous vehicles, collaborative robotics, and other trendy techs.
[https://innovecs.com/blog/warehouse-optimization-tips/](https://innovecs.com/blog/warehouse-optimization-tips/)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1oy08wvnq2adlrlejk0s.png)
Server monitoring with Zabbix
Tags: servermonitoring, zabbix, systemadmin
Published: 2022-04-26 15:13:31

We were developing a shopping cart application for a client using WordPress. During the development, we faced an occasional server not responding situation. So we wanted to monitor the availability of the Linux server.

After several hours of searching and exploring, we found several server monitoring solutions.

- [Nagios](https://www.nagios.com/)
- [Zabbix](https://www.zabbix.com/)
- [Cacti](https://www.cacti.net/)
- [OpenNMS](https://www.opennms.org/en)
- [Icinga](https://www.icinga.com/)
- [Netdata](http://netdata/)

Zabbix was the obvious choice for us as we were seeking for an open-source monitoring solution. It was quite easy and could able to get online pretty soon. Just go through the installation instructions of Zabbix and get your servers monitored.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o7dhdsd1s8byb2uxv1fr.png)
Paracetamol.js💊| #109: Explica este código JavaScript
Tags: javascript, spanish, webdev, beginners
Published: 2022-04-26 15:08:44

## **<center>Explica este código JavaScript</center>**
#### <center>**Dificultad:** <mark>Básico</mark></center>

```js
const set = new Set([1,2,3,4,5,2,4]);
console.log(set.size)
set.delete(3)
set.delete(4)
console.log(set.size)
```

A. `undefined`, `undefined`
B. `5`, `3`
C. `4`, `2`
D. `TypeError: set.size is not a function`

Respuesta en el primer comentario.

---
If you're receiving error even if everything in Firebase appears to be in order, try this
Tags: firebase, javascript, react
Published: 2022-04-26 15:05:47

So, I've been getting errors in Firebase recently, despite the fact that everything I did was correct. The mistake was then found to be due to a compatibility issue with the most recent version of Firebase.

As a result, instead of importing firebase from `firebase/app` I now import it from `firebase/compat/app` I performed the same thing with firestore and auth. My problem is solved simply by adding the `/compat` path.

![Importing Firebase](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/olwdwu969r30zzmpk913.png)

I hope this information is useful to you at some time.