teleren/devto huggingface dataset:
Fundamentals of Cloud Computing: Explained!
Tags: tutorial, codenewbie, cloud, computerscience
Published: 2020-07-01 16:16:13

{% youtube 6zKjMRj4gig %}

In this video, we will discuss the fundamentals of cloud computing. This whiteboard session is for a common audience who are interested to learn technology. we will be talking about:
1. What is cloud computing?
2. History
3. Benefits of cloud computing
4. Types of cloud computing
5. Deployment models

Follow on
Github: https://github.com/codingx01
Twitter: https://twitter.com/TechParida
Linkedin: https://www.linkedin.com/company/codingx/
Facebook: https://www.facebook.com/codingx
Instagram: https://www.instagram.com/coding.x/

Please do Like, Share, Comment, and Subscribe!
Debouncing (lodash) with React 
Tags: lodash, debounce, react, performance
Published: 2020-07-01 16:14:52

---
title: Debouncing (lodash) with React 
published: true
description: How to use lodash debounce with react function and class components
tags: lodash, debounce, react, performance
//cover_image: https://direct_url_to_image.jpg
---

**Scenario:** Getting something done on input change is not efficient in scenario where that 'something' is to fetch data from an api or to call another prop function or state action.

**Solution:** One of the solution is to use debounce/throttle api. There are several libraries which allows us to do just that. *Lodash* is one of them.

```
import { debounce, throttle } from 'lodash';
```

Code: *Functional component*

```
const delayedHandleChange = debounce(eventData => someApiFunction(eventData), 500);

const handleChange = (e) => {
        let eventData = { id: e.id, target: e.target };
        delayedHandleChange(eventData);
    }
```
Above handleChange() function will be used in our react input component for onChange props.

For *class component*, we have to bind functions like so:

```
constructor(props) {
this.throttleHandleChange = debounce(this.throttleHandleChange.bind(this), 500);
this.handleChange = this.handleChange.bind(this);

}

throttleHandleChange(edata) {
   someApiFunction(edata);
}

handleChange(e) {
    let edata = { id: e.id, target: e.target }
    this.throttleHandleChange(edata)
};
```
Same as above, handleChange gets called on our input component.
This allows us to only call api function once user has stopped typing for 500ms or more. 

Throttle api can be used in exact same way. Only difference is that throttle allows us to call api once every 500ms (above example) while typing.

Hope this helps. Thanks and happy coding. :)
How to build a REST API in Deno | Deno Crash Course (part-1)
Tags: deno, tutorial, codenewbie
Published: 2020-07-01 16:13:41

{% youtube jxZAFE0Rcjo  %}

In this tutorial, we will learn to code basic Deno programming and create REST API in Deno.

code: https://github.com/codingx01/deno

Follow on
Github: https://github.com/codingx01
Twitter: https://twitter.com/TechParida
Linkedin: https://www.linkedin.com/company/codingx/
Facebook: https://www.facebook.com/codingx
Instagram: https://www.instagram.com/coding.x/

Please do Like, Share, Comment, and Subscribe!
How to install Nginx, PHP, MySQL on ubuntu 18.04: Hands-on!
Tags: tutorial, codenewbie, php
Published: 2020-07-01 16:09:52

{% youtube bD16s2x6weI %}

In this video, we will understand how to install Nginx, PHP, and MySQL on ubuntu 18.04 in AWS EC2.

Follow on:
Github: https://github.com/codingx01
Twitter: https://twitter.com/TechParida
Linkedin: https://www.linkedin.com/company/codingx/
Facebook: https://www.facebook.com/codingx
Instagram: https://www.instagram.com/coding.x/

Please do Like, Share, Comment, and Subscribe!
Want To Step Up Your Remote Team? You Need To Read This First
Tags: career, management, webdev, productivity
Published: 2020-07-01 16:07:54

Many remote team management theories offer the following model structure. It starts with:

•	Inputs that have components, design, and teamwork.
•	Culture, which in this case is another word for effective communication.
•	Technical, which is associated with the expertise of the specified team members.
•	Training on the constant growth of your team. 
•	Socio-economic processes with building relationships, cohesion and trust... and task processes with the communication, coordination and structure of technological tasks.
•	Finally, it has results with performance and satisfaction. 

I find this model a little too complicated and hard to implement. You can choose a simple one of four components; 
•	Recruitment, 
•	Communication, 
•	Culture and 
•	Performance. 

As with any team, you must first create it and then manage it. So, let’s look at the components above.

Recruitment is the search for a person with the right skills and mindset. The person that fit well into your organization culture and can perform.

Communication, on the other hand, has two sides to it: first, it's effective and second, it connects humanly with every member of your team. And since you lack the face-to-face interaction of working in the same office, you have to try to imitate it somehow. Frequent video calls or the creation of a virtual water cooler should not be overlooked. 

And it all leads to the development of culture. If you would like to learn more about culture, I suggest you read up my article on this topic here. However, if you want one sentence summary, it is about building trust and understanding. Balance it between what you say and what you do… and with that, you have a thriving culture. 

We finally have the performance. You have people, you have the means to communicate effectively with them, you know you can trust them, and they can trust you. It's time to get to work. 

To do this, you need to set up the right system to make sure you are on the right track. Set your goals, milestones, get an easy-to-use notification system... and take time to make continuous improvements. Adapt it to your system; invest in training your team and further education, or purchase new tools.
TIL: How to list all the targets on a Makefile
Tags: todayilearned, makefile, tools, commandline
Published: 2020-07-01 15:50:51

`make` is great tool to orchestrate the setup and build process of a project. It expects a `Makefile`, where we define targets to execute, like for example `install` and `run`. Then we can use `make install` and `make run` to execute those tasks. 

While target names like `install` are quite common, the problems arise when we have to deal with a lengthy `Makefile`, and we are not aware of all the available targets.

Hopefully, with a slight modification of our current `Makefile` and the addition of a new target, we can expose this information and access it from the Terminal app. Let's see how!

First, we will have to document each of the existing targets. To do so, we will add a comment starting with `##` right after the target's name.

```bash
install: ## Install 
	@echo "Installing..."

run: ## Run
	@echo "Running..."
```

Then, we will use the `grep` and `sed` command to get the name of the target and the documentation, like in the following snippet:

```bash
.DEFAULT_GOAL := help
.PHONY: help

help:
	@grep -E '^[a-zA-Z0-9_-]+:.*?## .*$$' $(MAKEFILE_LIST) \
	| sed -n 's/^\(.*\): \(.*\)##\(.*\)/\1\3/p' \
	| column -t  -s ' '
```

We will also set the `.PHONY` and the `.DEFAULT_GOAL` variables. The last one will make `help` the default target when running `make` without a specific target.


Now, if we head back to the Terminal app, and run `make`, we will get the list of the documented targets as an output :rocket:

```log
install  Install
run      Run
```

---
➡️ This post was originally published on my [blog](https://diamantidis.github.io).
Welcome Thread - v80
Tags: welcome
Published: 2020-07-01 15:41:24

---
title: Welcome Thread - v80
published: true
description: Welcome to DEV! A thread of hellos and intros.
tags: welcome
---

![yo orange](https://media.giphy.com/media/2sgDOlsNat1CLN5IPD/giphy.gif)

### Welcome to DEV!

1. Leave a comment below to introduce yourself! You can talk about what brought you here, what you're learning, or just a fun fact about yourself.

2. Reply to someone's comment, either with a question or just a hello. 👋 

**Great to have you in the community!**
Overview of Magento pricing
Published: 2020-07-01 15:35:24

You’re in the market for a car and you have three options: 1) a free car 2) a new, luxury car, or 3) a new, luxury car with tons of horsepower with an extended warranty and the highest safety rating.

Which one do you go for?

Merchants looking at Magento as a potential platform to build their store have the same dilemma. In this article, we will cover <a href="https://elogic.co/blog/magento-cost-a-clear-overview-of-magento-pricing-from-open-source-to-commerce/">Magento cost</a>s across the three different Magento versions: Open Source (the “free” car), Commerce (the luxury vehicle), and Commerce Cloud (the more powerful, stable, and secure luxury vehicle).
Magento Open Source Pricing
The Magento software cost for the Open Source version is $0. You can download it for free, modify it, edit any files, and code all you want, and host it absolutely anywhere. 

Open Source has tons of features, some that aren’t included in more pricey competitor offerings. But as we will see later, the total cost of ownership may be higher compared to the premium Commerce and Commerce Cloud options. 
Magento Enterprise Pricing
Magento Commerce, formerly known as Magento Enterprise Edition is one of the leading ecommerce enterprise platforms on the market. Most ecommerce agencies and sources state that Magento Commerce costs a minimum of $22,000 per year ($1,833 per month). This number is prone to increase depending on two factors: Gross Merchandise Value (GMV) and Average Order Value (AOV). 
Hint: quotient means dividing (GMV divided by the number of transactions). The easiest way to think of this is the average amount of money a customer spends on your site.

As stated in the Magento Commerce Software License Agreement, the Magento license subscription fees are based on the GMV and AOV thresholds provided by the merchant. These fees are subject to change if the GMV for a given year is higher than the threshold. 

So to get the exact cost for the platform, you’ll need to contact a Magento sales representative. 

Magento Cloud Pricing
Magento Commerce Cloud is the ultimate Magento experience. 

You get all the features that come with Magento Commerce: advanced content creation with Page Builder, Magento’s B2B and Business Intelligence tools, Progressive Web App Studio, and much more. 

Plus, you get all the benefits of the cloud — lower maintenance and support costs, a fast and stable website, and shared security responsibilities between Magento, Amazon, and your team.  

Many sources state that Commerce Cloud starts from $40,000 per year ($3,333 per month) and increases in price depending on the same factors (GMV and AOV).
To reiterate, if you want to know the exact price of Magento Commerce and Commerce Cloud, contact Magento development team or, <a href="https://elogic.co/services/hire-magento-developer/">hire magento developer</a>
Twitter API is 🔥 - Followers Count
Tags: webdev, node
Published: 2020-07-01 15:17:32

I see a lot of tweeting platforms, which give you the power to send scheduled tweets, retweets, like all the comments for your tweets, always retweet you fav handle, and so on in Twitter. All these come at a cost, most of them are reasonable.

But this got me thinking and I did some surfing around the net. Then I realized Twitter provides free API (of course with a limit) for developers with small apps. 

I added my app, started testing the API and I could replicate some of the Awesome functionalities that the paid services could offer.

An interesting thing I did was creating a bot that reads my followers count and appends that to my Twitter profile's Display Name.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0jx40rw7f4fwfypnfgob.png)

Below are some of the few keys steps in achieving this✨

1. Go to [Twitter's developer](https://developer.twitter.com/en/apps) page and register your app to get the tokens.

2. All major languages have an add-on/module available for twitter integration. I have used, [Tweepy](https://www.tweepy.org/) for Python and [Twitter Lite](https://www.npmjs.com/package/twitter-lite) for NodeJS.
⚡️ Provide the required authentication and clean check the [docs](https://developer.twitter.com/en/docs/api-reference-index) for all the available endpoints.
3. After the initial setup is done, the next step would be to get the followers count and writing it to the display name.
⚡️ Follower count - this could be fetched from one of 2 APIs, 
✨[GET followers/ids](https://developer.twitter.com/en/docs/accounts-and-users/follow-search-get-users/api-reference/get-followers-ids) ✨[GET users/show](https://developer.twitter.com/en/docs/accounts-and-users/follow-search-get-users/api-reference/get-users-show)
⚡️ Updated Display Name - to update the profile information to update the use [POST account/update_profile](https://developer.twitter.com/en/docs/accounts-and-users/manage-account-settings/api-reference/post-account-update_profile) by sending the display name with the appended followers count in the name property of the request.
4. Run a cron job which calls and repeats the above steps in the refresh duration that you want😉

To test more on this implementation, check my profile😉

{% twitter 1277979613738577924 %}

To look cool, you have multiple pics and use the API to ser them as your display picture at different times of the day🔥

Do follow on [twitter](https://twitter.com/radnerus93) to get connected and DM me your comments. Since I have just started to write, do send you love and criticism, both would be equally appreciated😉
jcli, A command line tool for creating Java Applications
Tags: java, commandlinetool, tool
Published: 2020-07-01 15:15:41


Created a tool called jcli to create java applications from command line ..

You can use commands like :

jcli --create-project HelloWorld - to create a new project template

jcli --create-package - to create a new package

jcli --create-class - to create a new class

jcli --create-interface - to create a new interface

jcli --compile - to compile the project

jcli --run --main-class com.hello.world.HelloWorld - to run the project

Here is the demo and other details:

https://fullstackdeveloper.guru/2020/06/26/introducting-jcli-a-command-line-tool-for-creating-java-applications/
Creating Resources In Drash
Tags: deno, drash, typescript, webdev
Published: 2020-07-01 14:45:10

In this video, Eric talks about [resources](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web) and how they play a role in a [Drash](https://drash.land) server. He also goes over setting up a small [Deno](https://deno.land) web application using Drash. Enjoy!

{% youtube 5N1uSzBA0rc %}
Open Source Sustainability
Tags: opensource, opencollective, codefund, scarf
Published: 2020-07-01 14:42:53

---
title: Open Source Sustainability
published: true
description: The status quo in open source is broken. Corporations profit hugely from open source libraries, and give almost nothing back, which leans to burnout which is bad for everyone.
tags: OpenSource, OpenCollective, CodeFund, Scarf
cover_image: https://images.unsplash.com/photo-1590595906931-81f04f0ccebb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2550&q=80
---
This post has moved to [erikras.com](https://erikras.com/blog/open-source-sustainability).
Introducing React Lab: A Playground to Experiment with React
Tags: showdev, javascript, react, beginners
Published: 2020-07-01 14:39:50

Hi, Dev community,
I just developed a react app to showcase my own experiments with react. Actually, I developed it to host my tutorial demos that i write on my blog devaradise.com.
<br/>
But because I thought this project will be useful to other developers that want to experiment with react too, i open-sourced it. You can go to the github project here <a href="https://github.com/syakirurahman/react-lab">https://github.com/syakirurahman/react-lab</a> or seeing the live demo here <a href="https://www.devaradise.com/lab/react">https://www.devaradise.com/lab/react</a>.
<br/>
There are only 2 experiments for now, a react datepicker and react infinite scroll experiment (I will write the tutorials about that later on my blog).
<br/>
If you like the project and found that useful, feel free to fork or clone it. And dont forget to star it :D.
<br/>
What do you think? Do you have any thoughts for this project?
Discover new startups- June edition
Tags: ux, startup, productivity
Published: 2020-07-01 14:38:58

Hi there

I am Piotr, designer from Warsaw. This is my debut on dev.to 💪

I would like to share with you couple of interesting side projects and startups added to my website in June. I build a tool to promote interesting projects and help people find potential users. Let's dive in! 

###Top 3 Posts:###

##🕵️‍♂️##
[Smartlook](https://owwly.com/product/Smartlook-340/post/Smartlook-Qualitative-Analytics-321)
For everyone who wants to analyze users behaviors and undertake conscious steps

##💰##
[Userguiding](https://owwly.com/product/UserGuiding-27/post/UserGuiding-crossed-dollar20K-MRR-340)
A no-code user onboarding software share their story behind $20K MRR!

##🍊##
[Orangescrum](https://owwly.com/product/Orangescrum-339/post/Project-Management-Software-318)
Another interesting collaboration software 


----------------------------


###Top 3 Featured Products:###

##🎨##
[Growth. design](https://owwly.com/api/products/1280/view)
Watch product tips in a comic book format

##💬##
[Parabol](https://owwly.com/api/products/1285/view)
Free Online Retrospectives

##📧##
[AWeber](https://owwly.com/api/products/1288/view)
Powerfully-Simple Email Marketing for Small Businesses


----------------------------


And that's it!
I really count for your feedback. Are you interested in such content related to the startup world?
Write Google Sheets Data to your SQL Database with WayScript
Tags: database, tutorial, wayscript
Published: 2020-07-01 12:14:53

Introduction
------------

Someone just made a commit in your software development tools and you want you and your team to get notified. With Wayscript, you can seamlessly integrate Discord and Github to automatically receive messages about pull requests in your channels.  
Let’s build this integration.

Prerequisites
-------------

No prerequisites but here are some documentation you might find useful.

*   [Working with Github Trigger](https://docs.wayscript.com/library/triggers/github-trigger)
*   [Working with Discord](https://docs.wayscript.com/library/modules/discord)

Trigger
-------

For this example, we want the script to run when there is Pull Request in Github. Well, Wayscript provides a Github Trigger that can warn as well about new pull requests, new issues, and branch events. Add Github as a Trigger.

![Adding the trigger](https://cdn.wayscript.com/blog_img/112/1.png)

Once it’s done, you’ll have to add your Github account. After this, select a repository and the mode. Here we’ll work with Pull Requests Events.

![Configuring Github Trigger](https://cdn.wayscript.com/blog_img/112/2.png)

The panel will update and you’ll notice Outputs. These are just the common information you can find about a Pull Request.  
Select the title, the username, the URL, and the number.

![Selecting outputs](https://cdn.wayscript.com/blog_img/112/3.png)

The Github Trigger is ready, configured with the outputs we need. Let’s write the message we want to send.

Discord message
---------------

Wayscript also provides a Discord module to easily write or read messages. Add it as a new step in your workflow and let’s configure it.

![Adding Discord module](https://cdn.wayscript.com/blog_img/112/4.png)

After selecting the discord server you want to work with, you can choose the channel and select a mode(Read or Write).

![Configuring Discord](https://cdn.wayscript.com/blog_img/112/5.png)

Enter the message you want to send. You can also specify a name that the bot should use and an image URL for the bot to use as its icon.

![Discord message](https://cdn.wayscript.com/blog_img/112/6.png)

Good, We’re almost done. Turn on the GitHub trigger.

![Trigger On](https://cdn.wayscript.com/blog_img/112/7.png)

Now, Wayscript handles the automation of this script for you. :)

Conclusion
----------

If there's any questions feel free to message us on discord. We're happy to help! If you want to see this full script template, you can find it [here](https://wayscript.com/user/mangabo_kolawole/-ygNCphV).
Depth First Search algorithm in Python (Multiple Examples)
Tags: python, beginners, tutorial
Published: 2020-07-01 14:26:17

---
title: Depth First Search algorithm in Python (Multiple Examples)
published: true
description: 
tags: #python #beginners #tutorial
//cover_image: https://direct_url_to_image.jpg
---

1 Introduction
2 The Depth First Search Algorithm
3 Representing a graph
3.1 Adjacency Matrix
3.2 Adjacency List
4 Implementing Depth First Search(a non-recursive approach)
5 DFS using a recursive method
6 Depth First Search on a Binary Tree
6.1 What is a Binary Tree?
6.2 Representing Binary Trees using Python classes
6.3 Implementing DFS for a binary tree
7 Depth First Search using networkx
7.1 Constructing a graph in networkx
7.2 Visualizing the graph in DFS
7.3 Graph traversal in networkx – DFS
8 Topological sorting using Depth First Search
9 Finding connected components using DFS
10 Conclusion

https://likegeeks.com/depth-first-search-in-python/
DevOps with your RPI K8S
Tags: kubernetes, devops, springboot, jenkins
Published: 2020-07-01 14:23:24

---
title: DevOps with your RPI K8S
published: true
description: Develop, build and deploy on K8S
tags: Kubernetes,devops,springboot,jenkins
cover_image: https://blog.medinvention.dev/content/images/size/w2000/2020/03/kub1-1-.png
canonical_url: https://blog.medinvention.dev/devops-with-own-rpi-k8s/
---
Array Manipulation in React
Tags: react, javascript, webdev
Published: 2020-07-01 14:17:50


{% youtube c3MbP2StdvY %}
Covering some methods of common array manipulation in javascript 
in an example react project

0:00 - Intro
03:56 - push method - push a random number to end of array
07:06 - index referencing - reference 1st value in array
09:00 - Display Length of an array 
11:00 Map Method - Map values of original array x 2
15.00 Filter Method - filter numbers over 5 in original random array 

Sourcecode :
https://github.com/drnoir/arrmanip
Oiii! JS - images and videos viewer for your site
Tags: javascript, opensource, github, npm
Published: 2020-07-01 13:59:34

Oiii! JS is a small and lightweight library that allows you in semi-automatic mode to add a beautiful modal window for viewing images and YouTube videos in just 1 minute.

And as it is alternative to LightBox (created by Lokesh Dhakar) and as I say small and lightweight (15 times!), it is use 0 dependencies (no jQuery) and support all latest modern browsers.

##Current features:
- open images
- open videos
- support `thumb`, `preview` and `original` links to images
- allows you to open video at youtube and image as `original` in new tab

##Small demo in gif:
more demos at project page
![Preview](https://dev-to-uploads.s3.amazonaws.com/i/nu865xst05a8qptrrzp1.gif)

##How I can use it?
All instructions available at:
- [GitHub project page](https://github.com/tomasci/oiiijs)
- [NPM JS project page](https://www.npmjs.com/package/oiiijs)

Also library can be used without building, just through jsDelivr.

##Updates and features
Updates coming as I have time.
Anyone can request new feature using PR at GitHub (but I will think about it).
Roadmap with feature updates here:
- [Oiii! JS Roadmap](https://github.com/tomasci/oiiijs/projects/1)

Thank you for reading this! I hope it will useful library for you.