teleren/devto huggingface dataset:
React Bootstrap Table
Published: 2020-09-25 14:57:38

<h2>how to use <a href='https://askavy.com/react-bootstrap-table/' target='_blank'>React Bootstrap Table</a> With Pagination and search</h2>

in this post, I am using MDBDataTable 

Document: https://mdbootstrap.com/docs/react/tables/datatables/

How to install 

```javascript
  npm install mdbreact --save
```

How to use React Bootstrap Table

```javascript
   import React from "react";
import "bootstrap/dist/css/bootstrap.min.css";
import { MDBDataTable } from "mdbreact";

const data = {
  columns: [
    {
      label: "Name",
      field: "name",
      sort: "asc",
      width: 150,
    },
    {
      label: "Position",
      field: "position",
      sort: "asc",
      width: 270,
    },
    {
      label: "Office",
      field: "office",
      sort: "asc",
      width: 200,
    },
    {
      label: "Age",
      field: "age",
      sort: "asc",
      width: 100,
    },
    {
      label: "Start date",
      field: "date",
      sort: "asc",
      width: 150,
    },
    {
      label: "Salary",
      field: "salary",
      sort: "asc",
      width: 100,
    },
  ],
  rows: [
    {
      name: "Nix",
      position: "Architect",
      office: "New City",
      age: "34",
      date: "2011/04/25",
      salary: "$220",
    },
    {
      name: "Wix",
      position: "Accountant",
      office: "Tokyo",
      age: "63",
      date: "2011/07/25",
      salary: "$170",
    },
    {
      name: "Ashton Cox",
      position: "Junior Technical Author",
      office: "San Francisco",
      age: "66",
      date: "2009/01/12",
      salary: "$86",
    },
    {
      name: "Cedric Kelly",
      position: "Senior Javascript Developer",
      office: "Edinburgh",
      age: "22",
      date: "2012/03/29",
      salary: "$433",
    },
    {
      name: "Brielle Williamson",
      position: "Integration Specialist",
      office: "New York",
      age: "61",
      date: "2012/12/02",
      salary: "$372",
    },
  ],
};

function App() {
  return (
    <div className="App">
      <MDBDataTable striped bordered small data={data} />
    </div>
  );
}

export default App;


```
Demo : CodeSandBox Link https://codesandbox.io/s/react-bootstrap-table-askavy-sbdy4
React Form
Published: 2020-09-25 14:52:48

How to use React Form with form validation(Code Example)

```javascript
import React, { useState } from "react";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";

function App() {

  return (
    <div classNameNameName="App">
      <div className="container">
        <div className="row d-flex justify-content-center">
          <div className="col-md-4">
            <form>
              <div className="form-group">
                <label for="exampleInputEmail1">Email address</label>
                <input
                  type="email"
                  className="form-control"
                  id="exampleInputEmail1"
                  aria-describedby="emailHelp"
                  placeholder="Enter email"
                />
                <small id="emailHelp" className="form-text text-muted">
                  We'll never share your email with anyone else.
              </small>
              </div>
              <div className="form-group">
                <label for="exampleInputPassword1">Password</label>
                <input
                  type="password"
                  className="form-control"
                  id="exampleInputPassword1"
                  placeholder="Password"
                />
              </div>
              <div className="form-group form-check">
                <input
                  type="checkbox"
                  className="form-check-input"
                  id="exampleCheck1"
                />
                <label className="form-check-label" for="exampleCheck1">
                  Check me out
              </label>
              </div>
              <button type="submit" className="btn btn-primary">
                Submit
            </button>
            </form>
          </div>
        </div>
      </div>
    </div>
  );
}
export default App;
```

Main document: https://react-hook-form.com/

Source : <a href="http://askavy.com/react-form/">React Form</a>
Accessibility and IoT devices
Tags: a11y, discuss, iot
Published: 2020-09-25 14:50:44

So, I'm doing an research and need some help. There's anybody here with audible, visual, cognition, or vocal impairment? How do you use iot functions? Do you guys think that is possible for a vocal impaired to use Alexa's functions, for example?

Do you live with an elderly person (65 years or older) that consumes Netflix or Spotify (and control the music playing on PC using his smartphone) on different devices? How it is?

Any more information will be welcome.
Free 1:1 CI/CD consultancy session
Tags: devops, codenewbie
Published: 2020-09-25 14:45:42

If you're trying to implement a CI/CD pipeline in your project or want to learn how to do it and what does that mean you can schedule a free one-to-one call with **Todd** from GetAdvice to help you.

https://getadvice.github.io/todd.densmore.html

Disclaimer: I'm the guy behind GetAdvice (volunteers are needed!!). This is a way to promote getadvice.github.io and get more volunteers and users into the site too.

Image credit: https://www.pexels.com/@jiawei-cui-1213899
How I got my first Node.js job
Tags: node, beginners, career
Published: 2020-09-25 14:10:34

A story of shameless persistence to inspire those who are seeking their first job in IT.

It was 2012. I was in a university. I was obsessed with building games. The moment I read about Node.js, I thought of it as the future of online gaming.

I began studying Node.js documentation. The goal was to learn the basics and find a freelancing project to work on. Working as a freelancer was (and remains) my favorite way to learn. Even if you are paid pennies, learning while solving real-world problems and getting paid is a lot better than just following tutorials. However, there weren't that many Node.js freelance projects at the time. So I started applying to consulting jobs.

Few people knew about Node.js, but there were already ambitious projects being built using it. The hype was real. Therefore, simply putting Node.js in your CV got you interviews. I had my first interview less than a week after starting to learn Node.js.

The first job ticked all the boxes:

* remote
* high daily rate
* node.js + socket.io
* building a game-like online music chatroom

How did I do? I bombed it _hard_.

Beyond the first few questions, I didn't have a clue what I was being asked. So I thanked for the interview and moved on.

It was embarrassing, sure, but when you have goal, none of this matters. No one will remember someone who bombed their interview. Meanwhile, the upside for you is huge.

Anyway, I've spent the rest of that day studying answers to all the questions that I failed... and booking new interviews. That week I failed at least 3 other interviews. Every time I failed, I made a list of reasons I failed and studied them. Every other interview was easier. Finally, I got my first job on a 4th try.

The takeaway here is that:

* the best way to learn is by solving real-world problems while getting paid for it
* when you are just beginning, failing doesn't cost you anything
* failing and learning from your mistakes is the fastest way to learn

So, if you are just starting, don't wait until you learn everything there is to know. Industry is moving too fast. Learn to fail fast and get in the flow as quick as you can.

Good luck!
Move all files from one folder to another with Python
Tags: python, productivity, showdev, tutorial
Published: 2020-09-25 14:01:43

Hello, today I just want to show you how to make a simple Python script that will move all files from one folder to another. Also if you have a subfolder it will also be moved.

First off all we need to import `import shutil module`. This module offers a number of high-level operations on files and collections of files. In particular, functions are provided which support file copying and removal. 
After that we need to `import os`. This module provides a portable way of using operating system dependent functionality. If you just want to read or write a file.

```sh
import shutil
import os

source_dir = 'C:\\Users\\Stokry\\Desktop\\ttt\\a' 
target_dir = 'C:\\Users\\Stokry\\Desktop\\ttt\\b'
    
file_names = os.listdir(source_dir)
    
for file_name in file_names:
    shutil.move(os.path.join(source_dir, file_name), target_dir)y
```
This will remove all files from folder A to folder B. Also, you can make a job that will run this script periodically.
Step by Step tutorial to monitor third-party apps using Prometheus (MongoDB example 🍃)
Tags: prometheus, devops, kubernetes, tutorial
Published: 2020-09-25 14:00:38

In this **step by step tutorial** you learn how to monitor any third-party application in your Kubernetes cluster using Prometheus Monitoring.

In the demo I deploy MongoDB as an example.

###CONTEXT: ###
A typical scenario would be that you have an application deployed in your Kubernetes cluster and at some point you decide that you want to monitor it using Prometheus. 

###Pre-requisites:###
- Minikube cluster installed ([How to install Minikube](https://youtu.be/E2pP1MOfo3g))
- Demo part 1: In the first part of the demo we have already deployed Prometheus Operator using Helm and I explained all the components, which were created. ([Part 1 of the demo](https://youtu.be/QoDqxm7ybLc))

##Steps to setup monitoring for MongoDB 🔍 ##

![Steps to setup monitoring for MongoDB](https://dev-to-uploads.s3.amazonaws.com/i/eje5xwzcp6af4z8whq9d.png)

###1. Deploy MongoDB Application 🍃###
First we will deploy the MongoDB application in our cluster. In order to do that, we need to create a MongoDB Deployment and Service.

###2. Expose metrics - deploy MongoDB Exporter ###
As a second step we need to expose the data or the metrics of the MongoDB application using a component called Exporter.
Each application like MongoDB, Mysql, Redis has its own Exporter.

A **Exporter is basically a translator** between your apps data to metrics or data that Prometheus understands. It does 2 things:
1. It collects the metrics data from the app and converts it to Prometheus understandable data
2. It exposes these metrics to */metrics* endpoint for Prometheus to be able to scrape it.

###3. Allow Prometheus 🔥 to scrape metrics - Deploy ServiceMonitor ###
Once the metrics are exposed through the MongoDB exporter, we allow Prometheus to scrape these data. This is done using a component called Service Monitor.

###4. View the scraped data in Prometheus UI and Grafana 👀 ###
Finally, when we have configured the above we will see the new target in Prometheus UI and I also show the scraped data in Grafana UI.

###Explaining all the concepts 💡###
Along the process I explain all the concepts in detail, like
- What is a Exporter?
- What is a ServiceMonitor?
- How Prometheus discovers new targets?
So that you understand those concepts and afterwards see how to use it in practice.

Watch the full video here 🤓
{% youtube mLPg49b33sA %}

-----------------
► **Kubernetes 101**: [Compact and easy-to-read ebook bundle 🚀](https://www.techworld-with-nana.com/e-books) 
It's a handy way to quickly look something up or refresh your knowledge at work and use it as your cheatsheet  😎

**Like, share and follow me** 😍 for more content:
- [Private FB group](https://www.facebook.com/groups/techworldwithnana)
- [Twitter](https://twitter.com/Njuchi_)
- [YouTube](https://www.youtube.com/channel/UCdngmbVKX1Tgre699-XLlUA?sub_confirmation=1)
- [Instagram](https://www.instagram.com/techworld_with_nana/)
- [LinkedIn](linkedin.com/in/nana-janashia)
Posting forms in Razor Pages
Tags: csharp, razorpages, forms, ajax
Published: 2020-09-25 13:54:34

I have been struggling a little in order to get it working. 
Happily I read [Sending an anti-forgery token with Razor Pages AJAX requests](https://www.jerriepelser.com/blog/sending-antiforgery-token-razor-pages-ajax/), and all became clear :-)

Here is the main form :

```html
 <div style="width:500px; margin:0 auto;margin-top: 150px; ">
  <h2 style="text-align:center;">Posting form in Razor Page</h2>

  <form method="post" id="userform" asp-antiforgery="true">
    <div class="form-group">
      <label asp-for="UserInfo.FirstName"></label>
      <input asp-for="UserInfo.FirstName" name="FirstName"  class="form-control">
    </div>
    <div class="form-group" anti>
      <label asp-for="UserInfo.LastName"></label>
      <input asp-for="UserInfo.LastName" name="LastName" class="form-control">
    </div>
    <button type="submit" class="btn btn-primary">Add User</button>
    <input name="__RequestVerificationToken" type="hidden" 
        value='@AntiForgery.GetAndStoreTokens(HttpContext).RequestToken'>
  </form>
</div>

<script>   
    userform.addEventListener('submit', function (e) {
      e.preventDefault();
      const postUrl = '@LinkGenerator.GetUriByPage(HttpContext, handler: "UserInfo")';
      const formData = new FormData(this);
      new Response(formData).text().then(console.log)
      fetch(postUrl, {
        method: 'post',
        body: formData
      }).then(function (response) {
        alert("data posted")
        console.log(response);
      });
    })
</script>
```
and the c# part

```csharp
namespace PublicProject
{
  public class UserInformation
  {
    public string FirstName { get; set; }
    public string LastName { get; set; }
  }
  public class indexModel : PageModel
  {
    [BindProperty]
    public UserInformation UserInfo { get; set; }

    public void OnGet()
    {
    }

    public void OnPostUserInfo()
    {
      var user = new UserInformation
      {
        FirstName = UserInfo.FirstName,
        LastName = UserInfo.LastName
      };
    }
  }
}
```
Any 🇮🇪 tech announcements for upcoming Coding Grace newsletter?
Tags: irishtechcommunity, irishdev, diversityintech, codinggrace
Published: 2020-09-25 13:51:59

It's that time of the month again where I curate and aggregate tech events as well as diversity in tech events (especially 🇮🇪 Irish hosted ones) for the next monthly newsletter. 

The next one will be due out on 1st week of October.

If you haven't seen my previous newsletters and follow-ups, check out following post as an example of what I do each month:-

{% link https://dev.to/whykay/september-newsletter-4f1b %}

Generally I'm looking for:-

* Events
* Workshops
* Conferences

I'm also looking out for:- 

* grants/scholarships
* opportunities
* CFPs
* other tech/diversity in tech announcements
* videos/podcasts/articles (for the reading list)

If you have anything to add, I'll include it in the newsletter. I'll point back to this post if there's feedback from DEV community here so ye'll get credit for helping me out. 😊

It'll be great if you let me know by leaving comment below 👇👇👇. #TIA

🌈 Thanks and have a great weekend, all! 🌈
What was your win this week?
Tags: discuss, weeklyretro
Published: 2020-09-25 13:45:13

---
title: What was your win this week?
published: true
description: Got to all your meetings on time? Started a new project? Fixed a tricky bug?
tags: discuss, weeklyretro
cover_image: https://cl.ly/188e843c2985/download/Image%202019-02-15%20at%202.36.37%20PM.png
---

👋👋👋👋

Due to the [company holiday](https://dev.to/devteam/the-dev-forem-team-is-taking-a-mental-health-holiday-1ldl), I'm tapping in this week to post this fun thread.

So— looking back on your week — what was something you're proud of?

All wins count — big or small 🎉

Examples of 'wins' include:

- Getting a promotion!
- Starting a new project
- Fixing a tricky bug
- Cleaning your house...or whatever else that may spark joy 😄


**Have a great weekend!**

![Weekend](https://media2.giphy.com/media/iPTTjEt19igne/giphy.gif)
Positive Thinking while Learning to Code
Tags: motivation, codenewbie, watercooler
Published: 2020-09-25 13:44:03

I had a conversation with my daughter about positive thinking and how what you read, see, and hear can positively or negatively affect you. This also apply to developers.

Think of how babies are full of energy. Their faces glow with delightful thoughts and the determination to explore. They are curious with the world around them and excited about the fun activities they plan to do. Their bodies respond to the happiness and curiosity with energy and growth.

I read once that the most dangerous place for someone is inside their own minds. If you think negative then your body will act negatively. It will slow down and feel tired. Like a crying baby you will eventually get tire, get sick, or go to sleep. As a developer you have to be like a child by finding wonder in the world, marvel at your ability to create with your mind, and be determined to explore technology.

What you are exposed to matters. If you only read, see, or hear negative then your physically body, emotional well-being, and spiritually self will respond like wise. Like a plant needs sunlight to grow a developer needs positive reinforcement to grow. Examples of reinforcement is attending tech meetups, reading blog post of success stories, and watching online tech conference. Surrounding yourself with happy people willing to teach and help others can inspire you to find happiness in the world.

A guru in my tech community stated the voice we will hear more than any other our entire lives is our own voice. So be careful how you talk to yourself. He said to imagine if you had an IDE, and every time you save a file, compile, test run, it deletes a character. That's what an internal negative voice is like. It slowly takes away your happiness.  

Positive thinking starts with us telling ourselves positive thoughts, interacting and seeking a positive world, and removing negative from our life.

Contributors: [Steve Hallman](https://www.linkedin.com/in/stevehallman/)

####Please help others learn how to stay positive while learning to code by leaving a comment!!!

[Code Connector](https://codeconnector.io/) is a non-profit that's organized tech meetups to help people start their journey into tech. You can join our daily conversations by clicking this link: [Code Connector slack channel](https://bit.ly/2Fm3aN7).
Looking for Flutter Roles
Tags: roles, flutter, flutterdev, opentowork
Published: 2020-09-25 13:30:43

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/bj2ails639owa7bk2zaz.gif)

Hey everyone, I am looking for a new role as a **Flutter developer or Flutter developer advocate**. My expertise is in Flutter and native Android mobile app development.

My skillset includes:
- Flutter (Flutter SDK, Dart)
- Native Android (Android SDK, Java)
- Firebase (Cloud Firestore, Authentication)
- Google and Apple Authentication
- Google Play Store and Apple App Store (Uploading and configuring apps)
- Observer patterns (Provider- Flutter; LiveData and Observer- Android)
- Material Design
- Writing
- Entrepreneurship

I am looking for roles where I can grow my skills, work remotely, and have autonomy. If you know of any opportunities, please let me know!

https://ashtonjones.dev/#/
Create: Serverless 2020 Workshop 

Tags: serverless, javascript, azure
Published: 2020-09-25 13:21:53

{% twitter 1301523842238681089 %}

When I tweeted that, I meant it! [Create: Serverless](https://createserverless2020.splashthat.com/) is my first time participating as a speaker at a conference, and I can't tell you how excited I am.

## When, where, what's the topic? 

Topic: [Refactor Node.js and Express APIs to Serverless APIs with Azure Functions](https://docs.microsoft.com/en-us/learn/modules/shift-nodejs-express-apis-serverless/) 
When: September 30th, at 11:05-11:55 AM EST 
Where: [RSVP here](https://createserverless2020.splashthat.com/)


## Hangout with us

If you've been joining the #ServerlessSeptember live streams, you can expect that same vibe. I'll be joined once again by my partner in crime, [Christian Nwamba](https://twitter.com/codebeast) {% user codebeast %}

We'll walk through the exercise, discuss, answer questions, and no matter where you are in your serverless journey, I'm sure there's something you can learn or share with the rest of us in the chat!

The team and I would love to see you there.
Is GCP internal network slower than AWS?
Tags: googlecloud, aws, postgres, rust
Published: 2020-09-25 13:18:28

I am working on a side project that intends to provide tracking of application performance at the function level called [Criterion.dev](https://criterion.dev).  The Criterion API uses a PostgreSQL database and Actix Web for the web service.

I am very happy with the performance, but still, some random thought came to mind that made me question the numbers.

#### GCP Infrastructure
Compute Engine: E2-small
Cloud SQL: PostgreSQL 1v shared CPU .6GB
API request wait time: 84ms

#### AWS Infrastructure
EC2: t2.micro
RDS: db.t2.micro
API request wait time: 42ms

I started the service on GCP, so I logged into that instance and then into the SQL server and ran some queries by hand.  The same queries that the service executes **actually take less than 2ms**.  This convinced me that the network was the bulk of the request wait time.

So I copied my project over to AWS made a new subdomain and connected the SPA to it - The request time was 40ms less.  

Have you ever seen this before?  Could it be due to the shared/free instance tiers I am experimenting with?
Intro to technology
Tags: lis160
Published: 2020-09-19 12:29:41

####Is Technology Inherently Neutral?

If we take neutral to mean "not creating any effect," then technology is not neutral. The world has been undeniably changed by the connectivity and knowledge that technology brings.

If we take the word neutral to mean "neither good nor bad," then a debate arises about the morality of technology. One could say that technology is a tool, and it's morality depends on it's wielder. 

However, I am of the opinion that a gun, even in the hands of a good person, was designed to harm and is thus morally bad. The same is true of any technology: it's morality depends on the one who created it - and in the case of continuously updated technology such as software, the ones who manage it. One morally ambiguous example of this would be TikTok, the social media app that was recently banned in the U.S. after being under national security review for it's data privacy policies. Another such example would be the Facebook-Cambridge Analytica scandal where data from Facebook users was harvested and used to guide a political campaign. 

In short technology has an undeniable impact on the world, but it's morality depends on those who manage it.

References:
Cadwalladr, C., and Graham-Harrison, E. (2018, Mar. 17). Revealed: 50 million facebook profiles harvested for cambridge analytica in major data breach.  *The Guardian*. Retrieved from https://www.theguardian.com/news/2018/mar/17/cambridge-analytica-facebook-influence-us-election
Nicas, J., Isaac, M., and Swanson, A. (2020, Sep. 18). Tiktok said to be under national security review. *NY Times*. Retrieved from https://www.nytimes.com/2019/11/01/technology/tiktok-national-security-review.html
Swanson, A., McCabe, D., and Nicas, J. (2020, Sept. 18). Trump administration to ban tiktok and wechat from u.s. app stores. *NY Times*. Retrieved from https://www.nytimes.com/2020/09/18/business/trump-tik-tok-wechat-ban.html