teleren/devto huggingface dataset:
Get to know your ISP Internet Service Provider
Published: 2021-12-07 14:49:25

Is that an ISP? ISP is a summary of [Internet](https://www.rogger.eu.org/2021/11/Mengenal%20Internet%20Service%20Provider%20ISP.html) Service Provider or in Indonesian its abbreviation is PIJI.

In general, the ISP is a rоduѕеn or agency that provides services to utоmеrs so they can connect to the internet and various online media. According to the British Encyclopaedia,

ISPs are companies that provide network and internet services for individuals and individuals. However, ISPs provide different services to local consumers.

It not only provides Internet access but also carries out maintenance and installation. Internet Service Reviewer (PJI) or (Internet Service Provider abbreviated as ISP) is a company or body that provides Internet bonding services and other related services.

In general, telecom companies as a means of providing Internet services. Generally, ISPs are referred to as rоvіdеr (реnуuрlаі). With the release of Tеhореdіа,

ISPs are generally either cable companies or cellphone companies that offer Internet subscriptions, but even mobile TVs. ISPs are also known as Internet Access Providers or IAPs (Internet Access Providers).
Advent.js🎅🏼| #7: Buscando en el almacen...
Tags: adeventjs, javascript, webdev, spanish
Published: 2021-12-07 14:33:43

## [Buscando en el almacen...](https://adventjs.dev/challenges/07)

Mi amigo Dani está trabajando en una tienda y con la llegada de las navidades tiene el almacén hecho un desastre y no encuentra nada.

Vamos a crear una función `contains` que recibe dos parámetros: un objeto que define el almacén y el producto que buscamos.

La función debe devolver un booleano que indique si se encuentra el string como valor en algún nivel del objeto. Veamos unos ejemplos:

```js
const almacen = {
  'estanteria1': {
    'cajon1': {
      'producto1': 'coca-cola',
      'producto2': 'fanta',
      'producto3': 'sprite'
    }
  },
  'estanteria2': {
    'cajon1': 'vacio',
    'cajon2': {
      'producto1': 'pantalones',
      'producto2': 'camiseta' // <- ¡Está aquí!
    }
  }
}
            
contains(almacen, 'camiseta') // true

const otroAlmacen = {
  'baul': {
    'fondo': {
      'objeto': 'cd-rom',
      'otro-objeto': 'disquette',
      'otra-cosa': 'mando'
    }
  }
}
  
contains(otroAlmacen, 'gameboy') // false
```

Ten en cuenta que la tienda es enorme. Tiene diferentes almacenes y, como has visto en los ejemplos, cada uno puede tener diferentes organizaciones. **Lo importante es buscar que el producto está en los almacénes.**

Completa el reto!

--- 

Mi solución:

{% jsitor https://jsitor.com/embed/KuOBlE-ZQ %}

---
Puedes seguir a @midudev y estar pendiente de los retos de Advent.js 

{% twitter 1466086678507008003 %}
Use this Tailwind CSS Cheat Sheet to speed up your development process
Tags: tailwindcss, showdev, webdev
Published: 2021-12-07 14:32:36

I've been working on the past few days on a [cheat sheet tool for Tailwind CSS](https://flowbite.com/tools/tailwind-cheat-sheet/) that you can use to search for the utility classes from the framework from a single page.

![Tailwind CSS Cheat Sheet](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a2tjy3p73thb0ori7pp3.gif)

Although I would still recommend using the official documentation when working with Tailwind CSS, having a searchable single page where you can quickly find the utility classes can speed up your development process even more.

This cheat sheet tool includes all of the utility classes from the latest stable version of Tailwind CSS and as soon as v3.0 becomes stable I'll update the contents to include the JIT features as well.

[Check it out here](https://flowbite.com/tools/tailwind-cheat-sheet/).
Frontend Frameworks to Use
Tags: framework, frontend, programming, beginners
Published: 2021-12-07 14:21:23

The front-end is simply the part of the website or application with which a user interacts and sees on the screen. Technically, it’s a code that is responsible for showcasing the website’s elements to the user. Developers write code to create elements, behaviours, and link data with the back-end of the website or application. Front-end efficiently stores, presents, and updates data gathered from the back-end.

When it comes to a front-end [framework](https://en.wikipedia.org/wiki/Software_framework), it is a set of tools and resources used to build the front-end of websites as well as web apps. It minimizes your efforts and speeds up the process of front-end development by providing pre-written codes and elements. It includes website components, grids, pre-defined typography, and so on.

Moving on, let’s take a look at the list of [best Front-end frameworks](https://webhostingprime.com/best-frontend-frameworks/):

### 1. React

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

**Which applications are using React?**
Twitter
Pinterest
Netflix
Udemy

### 2. Angular
![Angular](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/110md4ifptrhlr4o5se0.png) 
**Which applications are using Angular?**
PayPal
Walmart
Freelancer
Gmail
Vevo

### 3. Vue
![Vue](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cgqhlncw2gre1zfeuks2.png) 
**Which applications are using Vue?**
Facebook
Adobe
Xiaomi
Alibaba
Grammarly

### 4. jQuery
![jQuery](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hwymwvk99n4s76x5qsm0.png) 
**Which applications are using jQuery?**
Twitter
Uber
AngelList
Kickstarter
WizzAir

### 5. EmberJS
![EmberJS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c4194ab606wcvbc50rov.png)
 
**Which applications are using EmberJS?**
Apple
Yahoo
LinkedIn
Chipotle
Vine

### 6. BackboneJS
![BackboneJS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/swjbhn1lhfx4dkoa4tzu.png) 
**Which applications are using BackboneJS?**
Pinterest
Flixster
Airbnb
Amazon

### 7. Svelte
![Svelte](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6alyeev0smreohtc5flw.png) 
**Which applications are using Svelte?**
Adobe
eBay
Noppo
Cloudless
Screeb

### 8. Semantic UI
![Semantic UI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ua97zu23jfwd0bhkebk4.png)
 
**Which applications are using Semantic UI?**
Snapchat
Accenture
Google Cloud Partner
Digital Services
Kmong

### 9. Foundation
![Foundation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/en2dferztj6agqsfl2wy.png)
 
**Which applications are using Foundation?**
Adidas
Kawasaki
Vans
Istockphoto
Fandango

## Conclusion

There are plenty of decisions with regards to front-end development frameworks. We attempted to limit the choices for you with our suggestions and an itemized investigation of every framework.
Transition to pnpm
Tags: pnpm, npm
Published: 2021-12-07 14:00:42

I spent the week working on a [Pull Request](https://github.com/Seneca-CDOT/telescope/pull/2545) to replace the usage of `npm` with `pnpm` in the [telescope](https://github.com/Seneca-CDOT/telescope) project.

Of course this is a change that will impact every contributor going forward, so I would like to use this blog post as a guide to get you setup and get comfortable using `pnpm`.

## Why changing?

[pnpm](https://pnpm.io) is an awesome package manager that is considerably **faster** than `npm` and a lot more **disk efficient**. You can find more information on how it works in their [docs](https://pnpm.io/motivation).

Here is a [test](https://github.com/Seneca-CDOT/telescope/pull/2545#pullrequestreview-821926322) to give you an idea of the difference:

| Package Manager | Install Time | Install Size |
| -------------- | -------------- | -------------- | -------------- |
| npm |	6m 30s | 1.29G |
| pnpm | **1m 8s** | **0.68G** |

Using `pnpm` is also speeding up our [GitHub Actions CI](https://github.com/Seneca-CDOT/telescope/actions)! All of the workflows now finish in around 10 minutes compared to an average of 15 minutes using `npm`.

As you can see, moving to `pnpm` is a great step forward for our telescope development.

## How to get started

To get started make sure you have [Node.js with npm](https://nodejs.org/en/download/) installed and then run the command:

```console
npm install -g pnpm
```

If you have `node_modules` previously installed by `npm`, you should delete them. To do so, from the root of the telescope folder, run the following command:

 ```console
npx npkill
```

Using [npkill](https://npkill.js.org), select `node_modules` with the cursor arrows and press `SPACE` to delete them one by one. You can then exit by pressing `Q`.

Make sure to pull the latest changes from upstream:
```console
git pull upstream master
```

And now you are ready to install all your dependencies with `pnpm`:

```console
pnpm install
```

## Using pnpm

`pnpm` is surprisingly easy to use if you know the basics of `npm`.

You can run tests:
```console
pnpm test
```

To run scripts, you don't use `run` like in `npm`:
```console
pnpm <script-name>
```

For example, instead of `npm run services:start` use `pnpm services:start`.

If you want to [add a new dependency](https://pnpm.io/cli/add), `cd` into the right path where the package will be added, then use:
```bash
pnpm add <pkg-name> # Save to dependencies
pnpm add -D <pkg-name> # Save to devDependencies
```

For example, to add a dependency to the frontend:
`cd src/web` then `pnpm add <pkg-name>`.

This will update `package.json` and `pnpm-lock.yaml` (You will need to add both to your commit).

If you need more information on how to use `pnpm`, the [docs](https://pnpm.io/pnpm-cli) are a great resource. I have also updated the telescope [Environment Setup](https://github.com/Seneca-CDOT/telescope/blob/master/docs/environment-setup.md) to help newcomers getting started.

I am super excited about this change and I hope everyone in the telescope community will love it as well! 😎
Serverless مقدمة عن
Tags: aws, serverless, career, cloud
Published: 2021-12-07 13:03:07

## Serverless ما هو ال

مجموعة من الخدمات السحابية التي  تتيحُ لك										بناء وتشغيل التطبيقات والخدمات دون الحاجة إلى التفكير بالسيرفير									
<br />									الحوسبة بدون خوادم او سيرفرات تتيح للمطور بناء وتشغيل التطبيقات والخدمات دون الحاجة الى التفكير بالخوادم. ان خدمات السيرفيرلس لا تتطلب منك تجهيز او ادارة او توسيع البنية التحتية. 
<br />
يمكن استخدام خدمات السيرفيرلس تقريبا في جميع المجالات كاتطوير المواقع او تطوير تطبيقات الموبايل او في الذكاء الصناعي 
<br />								تعتبر خدمات السيرفرلس اقتصاديه جدا فانت كمظور لا تدفع للخدمه اذا كانت في الوضع الخامل انت تدفع فقط في حالة استعمال الخدمة وهذا شي رائع بالنسبة للشركات الصغيرة او الناشئة او في حال كنت تريد ان تجرب شي جديد	
<br />							من الجدير بالذكر ان جميع التحديثات الامنية وتوفر الخدمة على مدار الساعة هي مسؤولية مزود الخدمة. ان تطوير او بناء خدمات بتقنية السيرفرلس تساعد الموطورين على التركيز على المنتج النهائي وهذا يؤدي الى سرعة الوصول الى السوق والمستخدم 	
							

## Serverless services ما هي 
تنقسم الى ثلاثة اقسام كما مبين ادناه

### 1. Compute

- AWS Lambda
- AWS Fargate

### 2. Integration

- EventBridge
- Step Function
- SQS
- SNS
- API Gateway
- AppSync
 

### 3. Data Store

- S3
- DynamoDB
- RDS Proxy
- Aurora Serverless

## Serverless ما هي افضل استخدمات ال

- معالجة الملفات
- معالجة البيانات
- ألشبكات
- انترنت الاشياء
- تطبيقات الويب والمحمول
- تطبيقات قائمة على الأحداث Event Driven Application

## فيديو تعليمي
[youtube 1](https://www.youtube.com/watch?v=c2jS5HOEz7U&list=PLOoZRfEtk6kVk4xHNFi_4cukuzsL-BNz3)
[youtube 2](https://www.youtube.com/watch?v=OpcLz3BHO34&list=PLOoZRfEtk6kVk4xHNFi_4cukuzsL-BNz3&index=3)

## روابط ذات صلة
[Serverless Land](https://serverlessland.com/)
[AWS Serverless Services](https://aws.amazon.com/serverless/)
[Event-Driven Architecture](https://aws.amazon.com/event-driven-architecture/)
[Serverless Framework](https://www.serverless.com/)
Hướng dẫn quảng cáo game MU Online trên MuMoiRa.tv
Tags: mumoira, muonline, mu4viet
Published: 2021-12-07 13:57:59

[Quảng cáo trên mumoira.tv](https://www.youtube.com/watch?v=mCTvUXRKfzI)
Hướng dẫn Phần 2 Bài 27: Hướng dẫn quảng cáo game MU trên MuMoiRa.tv
Website: [https://mumoira.tv/](Mu moi ra)
- Hướng dẫn đăng quảng cáo miễn phí trên MU Mới Ra
==============================================
Bạn muốn trở thành Admin MU Online?
Hãy đến với MU4Viet.net bạn hoàn toàn có thể trở thành Admin Mu Online. Chúng tôi sẽ hỗ trợ bạn hết sức.
Dịch vụ cho thuê [server MU Online](https://mu4viet.net/) của MU4Viet giúp bạn trở thành 1 admin chuyên nghiệp xây dụng thương hiệu và chỗ đứng vững trãi trong thị trường của mình. Server MU Online của MU4viet chuẩn, cực đẹp, nhẹ, mượt, tương thích trên mọi cấu hình máy tính. Giao diện game chuẩn Webzen.  Đến với chúng tôi bạn hoàn toàn có thể trở thành Admin. Chúng tôi sẽ hỗ trợ bạn hết sức có thể.
Prettier, React Redux Releases and More - Frontend News 23
Published: 2021-12-07 13:45:35

{% youtube T_JQhyfOC3k %}
What happened in the world of frontend in the last weeks? Watch the newest episode to be up to date! 👇

What’s in Frontend News #23?
🟣 Remix - React-based framework
🟣 Vercel funding
🟣 Prettier new release
🟣 React Redux v8 beta

Enjoy, you can read the article at [Frontend House](https://frontendhouse.com/frontend-news/prettier-react-redux-releases-and-more-frontend-news-23)
Covid Vaccine registration form using C.
Tags: c
Published: 2021-12-07 13:38:22

HI GUYS,
I Made a project in c.
You can explore it and make some changes to make it more cool
here is the link: https://app.codingrooms.com/w/4myQ7B1Hip4F
you can only read...
if u can give me your id to me than I will invite u to edit...
you can copy the code and paste in personal editor to see how it is.

I am Viswajith chembeti, I love to code and I am 14 yr old.
for now i am learning c you can join with me to make some fun stuff with c programming.

Thank You,
Warm Regards,
Viswajith Chembeti.
How to add Staking Token & Rewards Token address in Staking contract?
Published: 2021-12-07 13:19:22

`// SPDX-License-Identifier: MIT
pragma solidity ^0.8;

contract StakingRewards {
    IBEP20 public rewardsToken;
    IBEP20 public stakingToken;

    uint public rewardRate = 100;
    uint public lastUpdateTime;
    uint public rewardPerTokenStored;

    mapping(address => uint) public userRewardPerTokenPaid;
    mapping(address => uint) public rewards;

    uint private _totalSupply;
    mapping(address => uint) private _balances;

    constructor(address _stakingToken, address _rewardsToken) {
        stakingToken = IBEP20(_stakingToken);
        rewardsToken = IBEP20(_rewardsToken);
    }

    function rewardPerToken() public view returns (uint) {
        if (_totalSupply == 0) {
            return 0;
        }
        return
            rewardPerTokenStored +
            (((block.timestamp - lastUpdateTime) * rewardRate * 1e18) / _totalSupply);
    }

    function earned(address account) public view returns (uint) {
        return
            ((_balances[account] *
                (rewardPerToken() - userRewardPerTokenPaid[account])) / 1e18) +
            rewards[account];
    }

    modifier updateReward(address account) {
        rewardPerTokenStored = rewardPerToken();
        lastUpdateTime = block.timestamp;

        rewards[account] = earned(account);
        userRewardPerTokenPaid[account] = rewardPerTokenStored;
        _;
    }

    function stake(uint _amount) external updateReward(msg.sender) {
        _totalSupply += _amount;
        _balances[msg.sender] += _amount;
        stakingToken.transferFrom(msg.sender, address(this), _amount);
    }

    function withdraw(uint _amount) external updateReward(msg.sender) {
        _totalSupply -= _amount;
        _balances[msg.sender] -= _amount;
        stakingToken.transfer(msg.sender, _amount);
    }

    function getReward() external updateReward(msg.sender) {
        uint reward = rewards[msg.sender];
        rewards[msg.sender] = 0;
        rewardsToken.transfer(msg.sender, reward);
    }
}

interface IBEP20 {
    function totalSupply() external view returns (uint);

    function balanceOf(address account) external view returns (uint);

    function transfer(address recipient, uint amount) external returns (bool);

    function allowance(address owner, address spender) external view returns (uint);

    function approve(address spender, uint amount) external returns (bool);

    function transferFrom(
        address sender,
        address recipient,
        uint amount
    ) external returns (bool);

    event Transfer(address indexed from, address indexed to, uint value);
    event Approval(address indexed owner, address indexed spender, uint value);
}`
Countdown Loading with JS
Tags: css, javascript, webdev, beginners
Published: 2021-12-07 13:17:45

In this article, we are building a countdown with the help of Javascript and CSS. It can also be used as the loading countdown. Let's first look at what are we building -

![preview](https://i.imgur.com/tYadwyQ.gif)

Now you know how it will look like, So let's look at the code now  -

### HTML

```html
<div class="card">
  <div class="number"></div>
</div>
```

In the HTML code, the `card` class is the main container and it has one  section as child

- `number` :  it is the main countdown number or value


### CSS

```css
:root {
  --background-color: #0e1538;
  --text-color: #fff;
  --font: sans-serif;
}

* {
  margin: 0;
  padding: 0;
}

body {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--background-color);
  font-family: var(--font);
}

/* main Card */
.card {
  width: 200px;
  height: 275px;
  position: relative;
  user-select: none;
  cursor: pointer;
  transition: 0.3s ease-in-out;
}

/* Linear Background by using ::before */
.card::before {
  content: "";
  position: absolute;
  top: -4px;
  left: -4px;
  bottom: -4px;
  right: -4px;
  transform: skew(2deg, 4deg);
  background: linear-gradient(315deg, #00ccff, #0e1538, #d400d4);
}

/* countdown number */
.card > .number {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 10;
  font-size: 8em;
  display: grid;
  place-items: center;
  background-color: var(--background-color);
  color: var(--text-color);
}

.card:hover {
  transform: scale(1.1);
  box-shadow: 0 0 200px rgba(225, 225, 225, 0.3);
  transform: rotate(720deg);
}

```

Now the main part is the javascript in order to run this properly.

### JS

```js
var number = document.querySelector(".number");
var count = 20;

// Countdown Interval which runs on every 1s
var countdownInterval = setInterval(() => {
  // if count is less than or equal to 1 then clear the Interval
  count <= 1 && clearInterval(countdownInterval);
  number.textContent = count <= 10 ? `0${--count}` : `${--count}`;
}, 1000);

```


{% codepen  https://codepen.io/j471n/pen/NWjGzEx  %}

[![codepen](https://imgur.com/MNtTdVp.png)](https://codepen.io/j471n/pen/NWjGzEx)

### Conclusion

This is the countdown made by using Javascript and CSS you can use this in your project however you want. If you have any suggestions or any query comment down.

> You can now extend your support by buying me a Coffee.😊👇
[![buymecoffee](https://imgur.com/2QWo3cm.png)](https://www.buymeacoffee.com/j471n)


### Also Read
- [Curved Timeline in CSS](https://dev.to/j471n/curved-css-timeline-5ab3)
- [How to use Web Storage API?](https://dev.to/j471n/how-to-use-web-storage-api-3o28)
- [Fully functional google search with next.js](https://dev.to/j471n/fully-functional-google-clone-with-nextjs-223o)
Ops Docker it is! #1
Tags: beginners, devops, opensource, webdev
Published: 2021-12-07 13:14:46

This the very first Blog of this series. 

Let's start with some definitions and concepts.

Docker is a platform that uses OS-level virtualization to deliver software in packages called **Containers**. 

What is a Container?

A container is a way to package an application with all the necessary dependencies and configurations or you can say layers of images packaged together. 

**<u>Advantages</u>**:

- Portable Artifact

- Easily shared

- Easily moved around the development team and the development-operations team. 

- And due to the portability of containers and everything packaged in one isolating environment makes the Development and Deployment more efficient.  

- No environmental configuration is needed on the server except the docker runtime. 

Now here comes the question, _Where do these containers live_?
So, Containers live in a container repository, private or public repository. 

If we don't have containers then there could be a version conflict or misunderstandings between the development team and operations team. 

_What is the difference between a Docker image and a Docker container_?

So, Image is the actual package with all the dependencies and configurations, an artifact that can be moved around whereas when we pull the image and start it and applications start that creates the container environment. So containers are the running image only.

_What is the difference between Docker and Virtual Machines?_

As we know, Docker and VM are both virtualization tools. Docker virtualizes the Application layer in the OS (operating system) and it uses the kernel of the host whereas the virtual machines virtualize the whole OS, it has an application layer and its own kernel. 

1. The size of the docker images are smaller than VM.

2. Docker containers start and run fast.

3. Compatibility: Virtual Machines are more compatible. They can run on any OS host of the Operating System.

**Next blog of this series**: Building of docker image for Flask Application.
Content that developers love
Tags: devrel, podcast, career
Published: 2021-12-07 13:14:28

**Theme of the week:**
*How do you create content developers love?*

Content marketing is a key tool marketers use to increase the awareness of their product, help their users find answers to common questions and solve problems. What happens when the content becomes problematic and instead of solving problems, creates more?

Raphael Mun joined us to talk about content. Here are the topics we covered. 

- How are developers' content expectations different from that of a non-technical audience? How?
- Why does “typical” content marketing fall flat with this audience?
- What ticks developers off? 
- What do developers want from a content piece?
- What makes a content piece engaging? 
- What’s the format that most developers prefer?
- Reinventing the wheel? What aspects of “typical” content marketing still successfully apply to developers?
- What should your marketing team do to produce content the developers will love?

And more!

Listen to this episode to better understand what developers expect from the content you produce.
{% spotify spotify:episode:0MfxBiyVhYMVY2paddy8GL %}

**Let’s talk Data!**
This is the graph we discuss with Raphael: [Developer Team Leads are calling the shots](https://www.devrelx.com/trends?lightbox=comp-kisqhm6d3__85a0f937-9ce5-419d-959a-80fd18ac461b_runtime_dataItem-kisqhm6e)

**Raphael Mun** has worked on 10 different startups and worked with many more, finding product-market fit, architecting and building products and developing partnerships, and growing their user base through various lean marketing strategies. He has also authored numerous expert-level articles and content on AI, Cloud, and Best Practices.

[Join the Future Developer Summit Episode 4 on December 8: The evolution of Developers and DevRel.](https://www.futuredeveloper.io/)

[We want to make this podcast better for you! Take a few minutes to take our short survey.](https://devecon.typeform.com/to/Q9WqxzJN)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jtq5qkbj468trqdfe3ej.jpg)
download csv file by using controller in nodejs
Published: 2021-12-07 13:03:28




'use strict';

var server = require('server'); server.get('Show', function (req, res, next) { let = ('zzkw021.sandbox.us01.dx.commercecloud.salesforce.com/on/demandware.servlet/webdav/Sites/Impex/src/createCSVfile/customer.csv'); next(); }); module.exports = server.exports();