teleren/devto huggingface dataset:
How to Build an EDA App in Python
Tags: machinelearning, datascience, python, analytics
Published: 2021-06-08 07:04:09

Exploratory data analysis (EDA) is an essential and preliminary first steps for exploring and summarizing the main characteristics of datasets. EDA provides the means to help us better understand variables and their relationships. This is achieved by non-graphical (descriptive statistics) and graphical (data visualization) techniques.

In this article, we will be creating an EDA web app that you can use to speed up your EDA analysis or allow your colleagues to perform EDA without having to code in Python. A simple upload of the input CSV file is all it takes to perform EDA analysis.

You can also refer to my YouTube video [***How to build an Exploratory Data Analysis app using Pandas Profiling***](https://youtu.be/p4uohebPuCg) on my YouTube channel ([***Data Professor***](https://www.youtube.com/channel/UCV8e2g4IWQqK71bbzGDEI4Q)) as a supplement to this article.

[**Read the full article**](https://towardsdatascience.com/how-to-build-an-eda-app-in-python-af7ec4b51528)
How to Build a Simple Portfolio Website for FREE
Published: 2021-06-08 06:58:54

In this article, you will learn how to build a portfolio website for free in order to showcase your projects whether it be for data science, software development or web development. Some of the benefits of a portfolio website helps potential employers see the breadth and depth of your experience, which may be particularly helpful if you’re coming from an unconventional background (such as being a self-taught professional, etc.).

The portfolio website that we will be building today will be hosted for free on on GitHub pages. I will assume that you have minimal to no HTML experience. But if you have prior experience, this tutorial should take you even less time to complete.

We have a lot to cover here and without further ado let’s get started!

Also check out the accompanying YouTube video by the same name ([***How to Build a Simple Portfolio Website for FREE***](https://www.youtube.com/watch?v=6NXLGP65S2Q)) that you can watch alongside reading this blog post.

[**Read the full article**](https://towardsdatascience.com/how-to-build-a-simple-portfolio-website-for-free-f49327675fd9)
How to Build a Machine Learning App in Python
Tags: machinelearning, datascience, python, ai
Published: 2021-06-08 06:56:41

Have you ever wished for a web app that would allow you to build a machine learning model automatically by simply uploading a CSV file? In this article, you will learn how to build your very own machine learning web app in Python in a little over 100 lines of code.

The contents of this article is based on a YouTube video (https://youtu.be/eT3JMZagMnE) by the same name that I published a few months ago on my YouTube channel ([**Data Professor**](https://youtube.com/dataprofessor)), which serves as a supplementary to this article.

[**Read the full article**](https://towardsdatascience.com/how-to-build-a-machine-learning-app-a9dfed2616fb)
How make redirect link like dev.to
Tags: nextjs
Published: 2021-06-08 06:48:13

I want to build a blog by nextjs and strapi like dev.to.But i have a problem with slug not have an idea to fix it.
With each article, I will create the path with the syntax: https://domain.com/username/slug (it like dev.to).

But a problem , when the user change username, the path will be changed together, this time new url will be:

* Old: https://domain.com/username/slug
* New: https://domain.com/new_username/slug


So I want if users visit the old URL it be auto-redirect to the new url.
At dev.to, I noticed every time change username then path field auto changed (i check by https://dev.to/api/articles)

How can do it? how can a designer database in this case?
I no experience about this.I hope will be a little bit suggest from everybody. Thanks!
How to fix hugo "fatal error: pipe failed #84" error in Mac OS?
Published: 2021-06-08 06:39:38

---
title: How to fix hugo "fatal error: pipe failed #84" error in Mac OS?
published: true
description: 
tags: 

---
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ns032xspmmsog0wywp6w.jpg)
While installing hugo 0.80 on my Apple Macbook Pro, I faced "fix hugo error:pipe failed" error message. After spending 10 minutes,I was lucky to fix the issue by running the below sets of CLIs:

```
sudo launchctl limit maxfiles 65535 200000
ulimit -n 65535
sudo sysctl -w kern.maxfiles=100000
sudo sysctl -w kern.maxfilesperproc=65535
```

```
 hugo server
Start building sites … 

                   | FA | NO | EN  
-------------------+----+----+-----
  Pages            | 18 | 76 | 20  
  Paginator pages  |  0 |  0 |  0  
  Non-page files   |  3 |  1 |  2  
  Static files     | 38 | 38 | 38  
  Processed images |  7 |  2 |  4  
  Aliases          |  3 |  0 |  0  
  Sitemaps         |  2 |  1 |  1  
  Cleaned          |  0 |  0 |  0  

Built in 522 ms
Watching for changes in /Users/ajeetraina/projects/community/{assets,content,layouts,package.json,themes}
Watching for config changes in /Users/ajeetraina/projects/community/config.toml, /Users/ajeetraina/projects/community/themes/docsy/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at //localhost:1313///community/ (bind address 127.0.0.1)
Press Ctrl+C to stop
```

Enjoy!
🦊GitLab Cheatsheet - 2 - Runners
Tags: gitlab, devops, cheatsheet, tutorial
Published: 2021-06-08 06:33:21

The second cheatsheet speaks about Runners.

<a href="https://jeanphi-baconnais.gitlab.io//img/cheatsheet/GitLabCheatsheet-2-Runners.jpg" alt="2 - Runners" target="blank">
<img src="https://jeanphi-baconnais.gitlab.io//img/cheatsheet/GitLabCheatsheet-2-Runners.jpg" alt="2 - Runners" />
</a>


I will create others cheatsheet. Tell me if you have comments or suggest about those cheatsheet 😃.
What is Docker!
Published: 2021-06-08 06:20:56

Let’s get started…

Whenever a product is being designed the first and the only goal with that product is “I want to solve a specific problem (or) somehow I want to reduce the friction that users are currently facing”. 

The problem statement that docker is trying to resolve…
   
Whenever a developer develops any product there are certain issues which are probably almost every time occurs. Well, that problem is whenever you are designing a project it works fine in your machine(the developer machine). But as soon as that project is moved on the production state may be on the servers (or) maybe somebody’s else computer in that case the project usually fails to work with the same performance (or) optimization when it is moved from one computer to another. So the classic problem is “it works on my machine”. Docker is designed to specifically address this exact problem “it works on my machine”.

Docker is just completely a different thing and it’s compatible with almost any programming language (or) any project that you are working on. It’s like almost a sheet of paper on which you can put up anything. Docker allows you to have a sealed airtight container and these containers are the absolute heart of the docker. These containers wrapups your entire code and these and these are portable portability is one of the charms of the docker. Now we can take the container and whenever you are going to work absolutely and exactly like how it worked on your machine. The containers are shared like your social status.

These containers are super powerful and super packed up and consist of a lot of things. These containers are packed up with your code, dependencies, configuration, some of the processes that you are running.

To summarize, we can divide this docker into three main essential things that it does for you:
 1.It’s a client-side application program you can just install the docker and it can do all things for you include designing a container for you.
2.It can also act as a service and can be deployed on to ant server.
3.It also acts as a social networking platform where you can share your code easily.

Moreover, docker is also a company that does and manages all of this for you.
useState without React
Tags: react, usestate, javascript
Published: 2021-06-08 03:50:18

useState in react is a wonderful hook which is used to create an initial state and a handler to update it. But is there any way to mimic the same behaviour without using react at all??

let’s try..

From react, the useState returns an array which holds state and a handler. lets create a basic function for this

```javascript
function useState(obj) {
let initialState = obj;
const reducer = fn => {}
return [initialState, reducer];
}
```

```javascript
const [state, handler] = useState({a: 1, b: 2});
```

Yayyy we done it. Wait what ❗️ my handler is not updating the state. hmmm lets tinker the reducer in useState function. The reducer may accept a function with previous state as argument or it may accept an object. let’s do it

```javascript
const isFunction = value => typeof value === 'function';
const reducer = fn => {
let newState;
if (isFunction(fn)) {
newState = fn(initialState);
} else {
newState = fn;
}
}
```

hufff what are you doing up there?? well we created a helper function `isFunction` to check the argument is a function or not. If it is a function we’re passing inital state to it and assign the function value to `newState` property. If the argument is not a function then we directly assign it to `newState` property.

😍 great explanation results please

```javascript
handler((prevState) => ({...prevState, b:3}))
console.log('modified state: ', state)
```

😾 boring where are the results? 😕 what are we missing?? ahhh we’re getting new state but not assigning it to initial state in reducer. let’s do it

```javascript
const reducer = fn => {
let newState;
if (isFunction(fn)) {
newState = fn(initialState);
} else {
newState = fn;
}
Object.assign(initialState, newState);
};
```

```javascript
handler((prevState) => ({...prevState, b:3}))
console.log('modified state: ', state)
```

😍 lovely. Finally we did it. lets see the entire function.

```javascript
const isFunction = value => typeof value === 'function';
function useState(obj) {
let initialState = obj;
const reducer = fn => {
let newState;
if (isFunction(fn)) {
newState = fn(initialState);
} else {
newState = fn;
}
Object.assign(initialState, newState);
};
return [initialState, reducer];
}
```

That’s it. we finally managed to re-create useState hook without react. But there is one catch in above implementation. It only work for objects 😏. But not a bad start right.

Hope you enjoyed this article. Feel free to improvise it and let me know in comments.

Thankyou 👋
An automated GitHub-Discord bot
Tags: github, beginners
Published: 2021-06-08 06:06:44

Today we are making a bot that will automatically update our discord channel with actions from GitHub.

I found it a nice addition to my workflow, where the whole team will get updates on the GitHub repo we are working on.

I know you can also set up the mails, but for some reason, it's almost easier getting them in Discord in that specific team channel.

## Making a discord webhook

We first have to own a discord channel to make this work, so go ahead and create one if you don't have one.

Then we should click the settings for that channel.

![Discord channel settings](https://d38f4b4ih4m51q.cloudfront.net/Screenshot_2021-06-05_at_08_27_10.png)

Next, we need to visit the Integrations section and make a new webhook.

![Discord create webhook](https://d38f4b4ih4m51q.cloudfront.net/Screenshot_2021-06-05_at_08_36_08.png)

We need to use the `Copy webhook URL` button to get the actual webhook.

![Webhook URL](https://cdn.hashnode.com/res/hashnode/image/upload/v1622875379486/Un5xCGTjZ.png)

## Setting up the events in GitHub

Now it's time to move over to GitHub to set up things on that side.
Open your project in GitHub and visit the settings page for that project.

Click the webhooks button on the menu.

![GitHub settings webhooks](https://cdn.hashnode.com/res/hashnode/image/upload/v1622875503852/hKE1QKmA1.png)

Create a new webhook and paste the URL you just got from Discord.

> Important: Add /github to the end of this webhook to omit errors

Set the content-type to `application/json`.
And choose which events you would like to receive.

![GitHub webhook settings](https://cdn.hashnode.com/res/hashnode/image/upload/v1622875646924/LGv9zzAe9.png)

Now you can try it out by placing a comment, making a new push, or anything similar to that!

![Receiving GitHub actions in Discord bot](https://cdn.hashnode.com/res/hashnode/image/upload/v1622875780402/IrMtqyWYT.png)

And that's it. We now have our Github to Discord bot setup!
Super easy, right?

### Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on [Facebook](https://www.facebook.com/DailyDevTipsBlog) or [Twitter](https://twitter.com/DailyDevTips1)
SQL: about Foreign and Index Keys
Tags: mysql, database, discuss
Published: 2021-06-08 06:05:00

I'm having a hard time finding an answer related to this on google, maybe the masters in here can help.,..

where I work now, I see the db design without using foreign keys and prefer to create indexes on columns that are often querying,

so which one is better or is there any consideration in using it? because in the previous workplace always used foreign keys.
AWS EKS — Quick Setup
Tags: aws, eks, fargate, container
Published: 2021-06-08 05:40:30

**Steps to provision EKS cluster in AWS**

* Create 5 VPC Endpoints, please note for FargateOnly cluster we also need to add one extra VPC endpoint which is for “sts”
```
com.amazonaws.region.ecr.api
com.amazonaws.region.ecr.dkr
com.amazonaws.region.ec2
com.amazonaws.region.s3
com.amazonaws.region.sts
```
* Create the EKS Fargate Only cluster using the 3 PrivateOnly subnets with the command below:

```
$ eksctl create cluster \
 --name fargateprod \
 --region us-east-1 \
 --vpc-private-subnets=subnet-089c8482f000f3qwe,subnet-001022620f283121cb,subnet-0387722f71210b1f4a \
 --fargate
```
Please make sure to replace the three subnets in the command above with the subnets of your VPC, which can be checked in the output section of the Stack which was created from step1

* Once Cluster is created, update the Private API server endpoint for this cluster to “true” and make sure it has a Fargate profile for “default” and “kube-system” namespaces.

* After following the above steps the coredns pods should come to “Ready” state and you will be able to see the nodes as well.

**Cli**
```
# Create cluster
export CLUSTER=my-eks-ak
eksctl create cluster --name=$CLUSTER \
  --vpc-private-subnets=subnet-b14e21f7,subnet-76f21611,subnet-a8f814e1 \
  --region ap-southeast-1 --fargate

# check coredns
kubectl get pods -n kube-system

# enable private endpoint access
eksctl utils update-cluster-endpoints --cluster $CLUSTER --private-access=true --approve 

# delete coredns pods to retart it
kubectl delete pod <pending coredns pod> -n kube-system

# check coredns
kubectl get pods -n kube-system
```

**References**
[https://github.com/tohwsw/aws-eks-workshop-fargate]
[https://github.com/tohwsw/aws-eks-workshop-fargate]
[https://aws.amazon.com/blogs/containers/de-mystifying-cluster-networking-for-amazon-eks-worker-nodes/]
[https://eksctl.io/usage/vpc-networking/]
4G and 5G Native Cloud Telecommunication Applications on Rancher & Kubernetes
Tags: telco, rancher, kubernetes, cnf
Published: 2021-06-08 05:32:25

Hello Team,

I have been using Rancher-Kubernetes as the Infrastructure to install the Telecommunication Applications on to it. The result is quite good: Rancher & Kubernetes help to install/ manage/ monitor/ orchestrate my LTE EPC/ 5G 5GC CNF and the eNB-UE quite comfortably.

I installed the Open5GS: 4G EPC Packet Core and 5GC CNF Apps on to my Kubernetes Cluster via Rancher’s
Then I installed SRS-LTE eNB-UE on to the same Kubernetes Cluster
I got the eNB-UE established connection with EPC then Internet
Rancher could also help with other essential operational tasks via its tools/ functionalities: Dashboard, Performance Monitoring and Logging and ++
I recorded some of the results in the Youtube link below:

https://www.youtube.com/channel/UCdrZzzEgfXbsPfnvovHez9w/featured
Please join me if you are intested in Rancher and Telecommunication Native Cloud Apps (CNF) on Rancher + Kubernetes

It’s quite fun !!!
UIUX STUDIO - Blog
Tags: uidesign, uxagency, uiagency, uiux
Published: 2021-06-08 05:27:47

UIUX Studio is a leading UI UX design agency in India, providing UX Research, U/UX Design, Interaction Design, Usability Testing, UI/UX Audit & Consultancy services.



An outsourced design team/company is a great idea to increase work productivity and revenue. It helps SMEs to work under budget. Hire now!



UIUX STUDIO is an award-winning design agency in India. We offer design services  India under UX Research, UX design, UI Design & many more.



UIUX Studio is an award-winning web design company in India and has been successfully delivered 750+ projects to 140+ clients. Contact now



Find the best user experience design firm for your business. As a design firm, we offer UI/UX design, website design, product design services.

Learn how you can outsource graphic designers to grow your business, focus on strategy, and keep your creative quality on top. Contact us now.

UIUX Studio uses advanced usability testing methods for completing their projects & provides usability testing services to their clients for better results.

Reference URL:

https://www.uiux.studio/ 
https://www.uiux.studio/hire-an-outsourced-design-team.html 
https://www.uiux.studio/ui-ux-design-services-india.html 
https://www.uiux.studio/web-design-company-in-india.html 
https://www.uiux.studio/user-experience-design-firm.html 
https://www.uiux.studio/outsource-graphic-designers.html 
https://www.uiux.studio/usability-testing.html
Frequently Asked Questions In HTML, CSS, and JavaScript
Tags: css, html, javascript, webdev
Published: 2021-06-08 05:14:33

Most websites have an FAQ section for user question and answer(query). So here we made Frequently Asked Questions in HTML, CSS, and JavaScript.



In this element, we used HTML and CSS with CDN for jQuery. Here we use font awesome icons as a dynamic side like open and close view. Also, we used custom classes for making this element more user-friendly.

Make it yours now by using it, downloading it, and please share it. we will design more elements for you.

[Source code](https://w3hubs.com/frequently-asked-questions-in-html-css-and-javascript/)
What is technical debt in Sonarqube?
Published: 2021-06-08 05:04:59

Technical debt is perhaps one of the most important considerations to keep in mind when you’re handling complex software projects. Also called design debt or code debt, it is a very commonly used metric that makes tracking and maintaining code quality a lot easier for development teams.

Being one of the most popular tools for code quality maintenance, SonarQube from SonarSource comes with powerful technical debt analyzing tools baked in and ready to use out of the box. In this article, we will look over what technical debt is in SonarQube and how we can measure and reduce it appropriately.
Read more: https://duecode.io/blog/what-is-technical-debt-in-sonarqube/
We Need Your Help
Tags: node, javascript
Published: 2021-06-08 05:04:57

Today, I started a small project named "CodeSnippets".  The goal is to have a library of easily accessible code snippets and examples with no license.

The project can be found here: [https://github.com/trimorphdev/codesnippets]()

And if you have any questions about the project or want to know where to start contributing, feel free to [create an issue](https://github.com/trimorphdev/codesnippets/issues/new)!  I would be more than happy to help you get started.

Thanks for your contributions :)
Feature Dev.to should have 🤔
Tags: discuss, watercooler, feature, update
Published: 2021-06-08 04:27:10

Hello there 😊 
Today i am going talk about one feature Dev.to also known as AKA Forem should have 
We all know dev.to is one of the most liked platform by developers community and also having more than half million users i think dev.to should one feature Introducing 
**DevMeet** 
So that now question arises how it is going to work now we know most of the times we don't have partners for the hackathons personal projects and even though for the startup or business ideas we can create thing like fellow developers who is going to click on **Meet** tab then we can get from the user dev account and then we can get details why you want to use **DevMeet** and then there should be filters like in which category you want to chat with developers with audio/video and also screen-sharing option and if i click on for hackathons/devfriends we can get connected to the person according to there interest and also for filtering we can show limited filters in (i) section btw if i had a ipad i can draw this things quickly how this can work and where to put or not and more UI thing so like this we can implement this feature.
and also with this feature the engagement of the users will also increase on devto and also in DevMeet we can show ads if dev wants generate revenue from the DevMeet   
if anyone is having other ideas you can discuss in the comment section welcome have a great week ahead :)
bye if your doing good then this gify is for you ![](https://media.giphy.com/media/l1IYfpEF2Tb84asus/giphy.gif)

It is opensource but still some rights are reserved :)
Project 78 of 100 - Implementing a Debounce Function
Tags: javascript, react, 100daysofcode
Published: 2021-06-08 04:13:21

*Hey! I'm on a mission to make 100 React.js projects. Please follow my dev.to profile or my [twitter](https://www.twitter.com/jwhubert91) for updates and feel free to reach out if you have questions. Thanks for your support!*

Link to today's deployed app: [Link](https://100-react-projects-day-78-debouncer.netlify.app/)
Link to the repo: [github](https://github.com/jwhubert91/100daysofreact/tree/master/day-78-debouncer)

Ok so you got me. I didn't build a totally new React project from scratch today, nor is the emphasis of this project React.

It is however an important Javascript function within a React application and it does improve the user experience of the Notes app from [project 77](https://dev.to/jwhubert91/project-77-of-100-local-notes-in-react-with-react-quill-1e62).

So in the first version of this notes application we only saved notes when the window closes. This works, but in a browser I think this would leave users feeling uncomfortable not knowing whether or not their work was saved.

That's why, in so many online notes applications, the document automatically saves every time a change is made and you are told or shown the timestamp of the most recent save.

But if the document actually made a request to the server and saved every time the user pressed a key that would be incredibly, unnecessarily costly.

One way around this is to wait for the user to stop typing, and then save. We can do this with what is called a debounce function.

Classically, this is a function which takes two arguments- a callback function to be passed to it and an integer that stands for the delay, or how long to wait until you perform the callback passed to it.

Here is mine, which I put in a separate file for helper functions:

```JS
export default function debounce(callback,wait) {
  let id = window.setTimeout(function() {}, 0);

  while (id--) {
      window.clearTimeout(id); // will do nothing if no timeout with id is present
  }

  let timeout = null
  return (...args) => {
    const next = () => callback(...args)
    clearTimeout(timeout)
    timeout = setTimeout(next, wait)
  }
}
```

This brilliant little solution allows me to efficiently save the user's text at convenient times and display the most recent save's timestamp just like in Evernote or Google Docs!

**If you like projects like this and want to stay up to date with more, check out my Twitter [@jwhubert91](https://twitter.com/jwhubert91), I follow back! See you tomorrow for another project.**