teleren/devto huggingface dataset:
setState in useEffect loops the application
Tags: react, javascript, lodash
Published: 2021-04-28 09:54:21

Why am I getting infinite loop error? React refers to the line marked with `*`:

```react
function Blog() {
    const [blog, setBlog] = useState({});
    const query = useQuery();

    async function takeBlog(query) {
        const _data = await (await fetch(`${root}/api/blog/${query}`)).json();
        console.log(_data.blog)
        setBlog(_.get(_data, 'blog', {}));  // *
    }

    useEffect(() => {
        takeBlog(query);
    }, []);

    return (
        <div className="blog_page">
            <div className="container">
                <div className="top">
                </div>
                <div className="other ab">
                    <div className="left">
                        <Navbar active='blogs' />
                    </div>
                    <div className="right">
                        <Posts posts={_.get(blog, 'articles', [])} />
                    </div>
                </div>
            </div>
        </div>
    );
}
```
5 Icons Resource For Your Web Projects
Tags: android, javascript, webdev, programming
Published: 2021-04-28 09:53:54

#Unicons by iconscout
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ja7smaose7ku28fwwevh.png)

Pixel-perfect vector icons and Icon Fonts available in Line, Monochrome, and Solid style for your next project.

links:- https://iconscout.com/unicons

#Feather Icons
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/85dmloqzchrj978iabvd.png)

Feather is a collection of simply beautiful open source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency and readability.

Link:- https://feathericons.com/

#The Noun Project
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l70zc0scd4ch5vcf033q.png)

Noun Project features the most diverse collection of icons and stock photos ever. Download SVG and PNG. Browse over 3 million art-quality icons and photos.

link:- https://thenounproject.com/term/free/

#Material Icons
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kx9zzeo5nbk2daw2162t.png)

Material Design Icons Library for Sketch & Figma. We have created and combined a fairly large set of icons which are taken from Material Design and separated them into different style categories. This set of icons are made for popular graphic tools and is very convenient to use when creating your project.

link:- https://icons.pixsellz.io/

#Xicons
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5jfuccacw30xarrgoxul.png)

Xicons Studio develops, design custom add-ons, and test usability of custom icon design systems and pictograms.

link:- https://www.xicons.co/

#Also Follow On Instagram
{% instagram CONGQCtpBrb %}
Date Night at The Arcade
Tags: programming, java, csharp, opensource
Published: 2021-04-28 09:48:50

The Date Night at The Arcade Java project was so fun to make. Check out my work:

https://github.com/KeaganYoung/nightAtTheArcade


#programming #coding #programmer #developer #python #technology #javascript #code #coder #java #computerscience #oracle #webdeveloper #tech #csharp  #software
Laravel 8 Send Email Example Tutorial
Tags: laravel, php, tutorial, programming
Published: 2021-04-28 09:48:19

Laravel 8 provide several way to send email. You can also use core PHP method for send mail and you can also use some email service providers such as sendmail, smtp, mandrill, mailgun, mail, gmail etc. So you can choese any one and set configration. Laravel 8 provide Mail facade for mail send that have sevaral method for send email.In this example i going to show you how to send emails from gmail account example. 
more...
https://itwebtuts.blogspot.com/2021/04/laravel-8-send-email-example-tutorial.html
Free Portfolio and Resume builder
Tags: portfolio, webdev, beginners
Published: 2021-04-28 09:42:20

##### Updating portfolio is frustrating, right?

As a developer portfolio is best place to Showcase skill, work and Achievements and It's is really valuble for your career. So we need to keep Portfolio updated and Updating portfolio is frustrating, right?
So, we've got you covered
We are happy to announce that [Vdev](https://vdev.in/?ref=devto) is now open for Developer (still in beta), So please take a try and review how is it and how to improve it.


### Get your portfolio ready today
Now you know the value of a portfolio for your career, get started on making your very own.
Go to [Vdev](https://vdev.in/?ref=devto) and Create your account and add your skills, projects and Achievements and Done Now you have your own portfolio.
It's is really easy to update and You can Customize by adding Custom Css.


### Already has portfolio
Power Your portfolio with Vdev Api (Customize Your portfolio in your style with Vdev Api)
[React vdev api template](https://github.com/vdev-in/React-vdev-api-template)
[Html vdev api template](https://github.com/vdev-in/Html-vdev-api-template)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d65r36fko6l1xqw2dsvr.png)

## [App link](https://vdev.in/?ref=devto)
Profil International Trade Council (ITC)
Tags: resource, rekomendasi
Published: 2021-04-28 09:26:03


International Trade Council mewakili 76 badan ekspor pemerintah, 418 kamar dagang vertikal nasional dan industri dan sekitar 29.000 perusahaan yang mencakup 179 negara.

ITC bekerjasama dengan anggotanya membantu mereka membuka pasar baru, memahami dan menavigasi hambatan teknis perdagangan. Menghasilkan penjualan baru dan menyediakan berbagai platform pendidikan dan jaringan. ITC banyak menyelenggarakan webinar gratis dan berbayar, kursus sertifikat online dan acara lainnya. Mereka menyediakan layanan untuk membuka cabang bisnis baru di luar negeri, investasi, prospek dan misi perdagangan yang berorientasi pada penjualan untuk anggotanya.

International Trade Council juga mengelola program sertifikasi Quality in Business. Sertifikasi ini adalah satu-satunya metodologi penilaian global dan standar sertifikasi bisnis yang dirancang untuk menyoroti komitmen organisasi yang berpartisipasi terhadap inovasi, peningkatan berkelanjutan, dan kepatuhan terhadap praktik bisnis.

Quality in Business mencakup 16 fungsi utama, 96 kriteria inti dan 249 indikator kepatuhan. Keseluruhan standar ini ditinjau dan diperbarui minimal sekali per tahun kalender.

[Kunjungi Website International Trade Council](https://tradecouncil.org/)

*Originally published at [MauCariApa.com](https://maucariapa.com/profil-international-trade-council-itc-/) on April 27, 2021.*
Infrastructure as a Service (IaaS)- Brilliant Cloud
Tags: cloud, cloudskills
Published: 2021-04-28 09:24:49

<a href="https://brilliant.com.bd/cloud">Cloud Infrastructure services</a>, in general, refer to computer infrastructure services, storage, and networking services. Instead of spending on purchasing software, servers, or other network equipment, users can easily outsource these services from a third party. The advantage of this type of service is that users pay for only that amount of resource that they use rather than buying the whole equipment set for the purpose. The services that fall into this category are installing virtual servers on vendors' IT infrastructure, virtual-machine disk image library, block, and file-based storage, firewalls, load balancer, IP addresses, virtual local area networks. It provides users the necessary infrastructure on top of which they can run platforms as and when they require.
Assess candidates for their skills and experiences for the job, not as your friend (100 Bytes Of Wisdom: Day 46)
Tags: career, journey, advice
Published: 2021-04-28 09:16:45

---
title: Assess candidates for their skills and experiences for the job, not as your friend (100 Bytes Of Wisdom: Day 46)
published: true
description: Bytes of Wisdom is a new project by Sam Jarman that brings together snippets of advice for software engineers
tags: career, journey, advice
//cover_image: https://direct_url_to_image.jpg
---

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t4ce4lffs8h4rdj9sjao.png)

Deep down, whether we like to admit it or not, we all have some biases of people we like to work with. Maybe you share a first language, maybe they’re around your age, or similar to you in some other way. Well, forget it. It doesn’t matter. Assess their skills and experiences for the job, not as your friend. Sure, they need to be able to work in a team but guess what - anyone from anywhere can work well in a team. Check your biases at the door.  If you’re still unsure, I’ll repeat myself: Assess their skills and experiences for the job, not as your friend.

Heads up: As with any terse bit of advice, there will be exceptions of course, and subtleties and nuance that can't possibly be captured in a Byte of Wisdom. This has been what I've experienced, I'd love to hear yours in the comments too!

You can catch up with all the other bytes at http://bytesofwisdom.com/
How to Use a Sample Template?
Tags: template
Published: 2021-04-28 09:15:09

As a student or working professional you should learn the art of managing time and work activities in order to bring the best performance forward. Most of the time we are not able to accomplish work goals due to a lack of work management. This is why it's important to always plan work and then manage it accordingly. We recommend the use of a calendar to make a work plan or schedule. Use a free template from here to make your own work plan easily.
 
Here you can see a few monthly calendar examples with the help of which you can make any type of work calendar. The utilization of monthly templates makes the calendar making a lot easier. Now there is no need to spend more time making a calendar from scratch. Instead, download a free template online and make changes to it to make your own calendar.

Source:

http://freesampletemplate.com/project-charter-templates/
http://freesampletemplate.com/luggage-tag-templates/
http://freesampletemplate.com/inventoty-list-templates/
http://freesampletemplate.com/open-house-sign-in-sheet/
http://freesampletemplate.com/employee-information-forms/
Language Playgrounds are Cool
Tags: programming, ide, language
Published: 2021-04-28 08:59:35

A few years ago, we've built an open-source programming language called [CSML](https://csml.dev), that makes it super easy to build powerful chatbots. It's a complete programming language, with loops, conditions, variables etc., and it is super easy to learn as it is close to human language (say stuff, remember stuff, do stuff). It helps handling the conversation state, the user's memory, connexions with 3rd-party APIs...

However, to test it, you need to [download a package from Github](https://github.com/CSML-by-Clevy/csml-engine), find out how to install it, setup your machine and local environment developments... all of which make it hard to simply get started with the language.

So we decided to create an open, browser-based, no-install, no-login IDE. You get the kind of immediate WYSIWYG experience: code something, build, run, see what works (and what doesn't). It's a great place to learn and test your ideas.

Many languages have one, even the hard ones: Rust has https://play.rust-lang.org/, Go has https://play.golang.org/, etc. Then there are the obvious ones, like Codepen or Glitch, for the more common languages. In my opinion, all languages should have one. It makes learning the language a breeze!

If you want to try out CSML, you can do so on our brand new Playground: https://play.csml.dev.

And if you want, you can also support us and leave a review on our Product Hunt launch: https://www.producthunt.com/posts/csml-playground

Hope you enjoy programming languages as much as I do 🤓!
What are REASONS WHY LARAVEL IS PERFECT for WEB DEVELOPMENT ?
Tags: laravel, webdev
Published: 2021-04-28 08:49:50

Laravel Development Company is widely recognized for Web Development the ability to help world-wide build better website development with new Laravel technology. Their team of expert in Laravel development creates creative web solutions for clients and industries. We follow an agile methodology that came to solve the way teams work in Laravel web development without waste of effort and within the deadline.
 
What we provide for Laravel web development?
•	Fresh concept and creative web design
•	Perfect blend of concept and technology
•	Innovative Design for eCommerce solutions
•	Streamlined development
•	Critical Testing and QA measures
•	Satisfactory delivery
Services:
•	Laravel mobile app development
•	Laravel RESTful development
•	Laravel Package development
•	E-commerce development
•	Laravel Data Migration
•	Laravel web application
•	Laravel Maintenance and Support
•	Custom Laravel web development
•	Laravel Enterprise solution
To know more in detail about of larval development services Contact Us.

https://www.laravellions.com/
How to Use Groovy Bot?
Tags: discord
Published: 2021-04-28 08:24:14

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1afdix2uxh2sd499tsd7.png)
  Running or being part of a Discord server is quite an engaging and demanding task. Especially if you’re moderating a Discord server, time can fly like no other, and before you know it, you’ve got tons of tasks remaining, and you’ve only crossed one item off your list.

While Discord is a fantastic place to start a community on anything you’re passionate about, moderating large servers, including chat rooms, voice rooms, etc., can be quite a demanding task. And on top of that, you need to keep fellow members engaged and interested as well. Here is where bots come to the rescue by allowing you to moderate your Discord server and add some fun at the same time.

There are so many moderation bots to choose from. Each with its own unique commands and features that make managing and running a server a painless task, and today we’re going to be talking about the Groovy bot.
But before we head on into all the details, if you’re interested to learn more about other bots like Dyno Bot or Carl Bot for Discord, we’ve made extensive posts on them, too, so check them out.

Now, let’s get into the nitty-gritty details of Groovy Bot.

The Ultimate Guide[ https://exploringbits.com/how-to-use-groovy-bot/]  to Use Groovy Bot on Discord to play, add or remove music on your voice channel with Groovy Bot Commands prefix.
Having fun, living life
Tags: lgbtq, clothing, cosplay, dressingup
Published: 2021-04-28 08:23:21

First new dress of 2021! I love how it fits & looks on me!

Dress = https://www.walmart.com/ip/Women-s-Polka-Dot-Retro-Vintage-Style-Cocktail-Party-Swing-Dress/703016444

Corset = https://draculaclothing.com/black-satin-extreme-waist-cincher.html

Shoes = https://xeroshoes.com/shop/shoes/aptos-women/

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/er2ok9yzdh0awvpbcqp5.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zvkixy5x1ozx8mtng3xc.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8tdfdy0zev5d1bqy5koz.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/my9twndigyl1xves0lz3.png)
Using Octave kernel in a Jupyter Notebook
Tags: jupyter, octave, datascience, beginners
Published: 2021-04-28 08:01:01

This is a lightning-quick :dizzy: tutorial on how to link the Octave kernel with a Jupyter Notebook.

Requirements:
 - Python >= 3.5
 - Anaconda 4.10.1

## Installation

In your command line, navigate to your project folder and activate your Anaconda environment

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1vijdk7y2bkj59m9xhxj.png)

Install the `octave_kernel` package using `conda install -c conda-forge octave_kernel`

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fgnh45avzmjj3a7rnfqb.png)

## Configuration

Run Jupyter Notebook inside your workspace and open your browser. Within the file explorer page, on the right-hand-side, select `Octave` from the *New* dropdown.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hfffisv4wkip9qilwo07.png)

This will create a new notebook which is linked to the `Octave` kernel and which enables you to execute Octave syntax within the code cells.


## Setting Graphics Toolkit

To be able to display graph plots within the notebook, you will need to indicate which graphics toolkit you want the script to use before rendering the plots. (In this example, we are using the `gnuplot` graphics toolkit)

Add the following line to top of your code:

`graphics_toolkit ("gnuplot");`

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/emaglrn93p3rw8vdemba.png)

## References
 - https://anaconda.org/conda-forge/octave_kernel
 - Image Cover: https://picsum.photos
Understanding Network things: part 1 – L4 / L7 layers
Tags: network, http, beginners, cloud
Published: 2021-04-28 07:51:18

---
title: Understanding Network things: part 1 – L4 / L7 layers
published: true
description: Serie of sketchnotes about Network concepts. Explaining in a visual way network principles.
tags: Network, HTTP, beginners, Cloud
series: Understanding network things in sketchnotes
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7ftl04kslb9qvyojy5an.jpg
---

Hi,
I've got a secret for you, since several years. I'm a developer and I'm a mess in understanding network things! :'(

It's hard to not understanding things that anyone seems to understand and understanding network concepts can be difficult or time-consuming, specially for developers. That the reason I started to create sketchnotes about Network concepts. I think it could be a good way, more visual, to explain it.

In this first article, let's talk about L4 and L7 layers and OSI model.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7ftl04kslb9qvyojy5an.jpg)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2u70a5t3z6f4arp0us9j.jpg)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6ld65f8iru51tlbimq37.jpg)

As usual, if you like theses sketchnotes, you can follow me, and tell me what do you think. I will publish others sketchs shortly :-).

If you are interested, I already published sketchnotes about [Kubernetes, Docker and Istio](https://gumroad.com/aurelievache).
XState: What's the difference between Machine and createMachine?
Published: 2021-04-28 07:51:16

XState offers two options for declaring machine definitions:

```ts
import { Machine } from 'xstate';

const machine = Machine({ ...config });
```

...or...

```ts
import { createMachine } from 'xstate';

const machine = createMachine({ ...config });
```

This can be confusing for beginners. Why are there two very similar-looking methods? What's the difference?

## The Difference

In Javascript, there is no difference between the two. You can use them completely interchangeably.

In Typescript, there is only a small difference between them - it's to do with the ordering of the generics you can pass to the machine. `Machine` allows you to pass a generic called ['Typestates'](https://xstate.js.org/docs/guides/typescript.html#typestates) in the middle of the `Context` and `Event` generics.

```ts
import { Machine } from 'xstate';

interface Context {}

type Event = { type: 'EVENT_NAME' }

type States = {}

const machine = Machine<Context, States, Event>({ ...config });
```

Whereas `createMachine` asks you to insert it at the end:

```ts

import { createMachine } from 'xstate';

interface Context {}

type Event = { type: 'EVENT_NAME' }

type States = {}

const machine = createMachine<Context, Event, States>({ ...config });
```

Whichever you choose, there is _no functional difference in the created machine_. The two functions reference the same code, and create the machine in the same way.

## What should I choose?

Going forward, you should use `createMachine`. That's the syntax that will be preferred when v5 releases. But if you're happy with Machine, you can keep using it.
Most Common Issues with Real-Life Data: How to Check for Them, and How to Fix Them
Tags: python, datascience, pandas, numpy
Published: 2021-04-28 07:48:03

#1. Missing Data
##How to Check?
>>>df = pd.read_csv('name_of_csv_file.csv')
>>>df.info()

The range index will show you the total number, and then beside each entry, you'll find its count. If it doesn't equate to the total number, then you have missing data in your set.
##How to Deal with It?
This varies according to the situation at hand. For example, why is the data missing? And whether or not the occurrences seem random.

One way to go about this issue is to calculate the missing values using the mean.

For example, if you have missing values for the duration that a user viewed a product on your website. "duration" is the name of the variable in this case.

>>>mean = df['duration'].mean()
>>>df['duration'] = df['duration'].fillna(mean)

**The second line can be written as:**
>>>df['duration'].fillna(mean, inplace=True)

And both serve to apply the changes (adding the data you just calculated) to the original set.

#2. Duplicates
##How to Check?
>>>df.duplicated()

This should display "False" next to all the lines that aren't duplicates, and "True" next to the ones that are a duplicate of the ones above them.

I.e. The first instance will be marked as "False" but the second instance (which is the duplicate) will be marked as "True".

You can also check with:
>>>sum(df.duplicated())

This works for bigger data sets, and it shows you just how many instances of duplicates you have.

##How to Deal with It?
>>>df.drop_duplicates(inplace=True)

Again, (inplace=True) is used to apply changes to the original data set.


#3. Incorrect Data Types
##How to Check?
>>>df = pd.read_csv('name_of_csv_file.csv')
>>>df.info()

for example, if beside the variable "Timestamp" you find "object", this means that your data set is dealing with the timestamp as a string (str) which is not ideal. The proper representation is DateTime object.

In this case, we'll use:
>>>df['timestamp'] = pd.to_datetime(df['timestamp']

_Note_: Data type corrections aren't applied when you re-open the csv file. So, next time you parse the file, make sure to change them again accordingly.

#Git_It
Internet bandwidth And Connectivity Check Library For Android
Tags: android
Published: 2021-04-28 07:43:02

ConnectivityCheck is an Android library that allows you to figure out the quality of the current user's internet connection.
The library notifies you when the user's connection quality time to time. 

https://github.com/Ashusnu/ConnectivityCheck

<h2>How to use:</h2>

Step 1) Add it in your root build.gradle at the end of repositories:

```
allprojects {
		repositories {
			...
			maven { url 'https://jitpack.io' }
		}
}

```

Step 2) Add the dependency

```
implementation 'com.github.Ashusnu:ConnectivityCheck:$version'

```

Step 3) Attach connectivity check listener in onCreate() block.

```
ConnectivityCheck.checkConnectionState(new ConnectivityCheck.connectionStateListener() {
            @Override
            public void connectionState(ConnectionInfo connectionInfo) {
	    	// do something with connectionInfo
            }

            @Override
            public void onError(Exception e) {
                // handle exceptions
            }
        }, this);

```


Step 3) Finally start and stop connection check

To start connection check call startCheck() inside onResume() block

```
@Override
    protected void onResume() {
        super.onResume();
        ConnectivityCheck.startCheck();
    }

```

To stop connection check call stopCheck()inside onPause() block


```
@Override
    protected void onPause() {
        super.onPause();
        ConnectivityCheck.stopCheck();
    }

```

<h2>That's it</h2>