teleren/devto huggingface dataset:
GitOps, DevOps and Automation - YouTube Series
Published: 2022-01-17 12:51:12


Last year, [Collabnix](https://collabnix.com) Community came together with JFrog & Docker Bangalore community groups to conduct a meetup event for DevOps practitioners on June 19th, 2021. With over 10+ speakers, the event was 100% virtual event where DevOps mindset, skills, and tools converged after a long time. This was a half-day event that brought together leaders in DevOps and the Cloud-native world to collaborate and learn from each other. 

[Aditya Soni](https://www.linkedin.com/in/theadisoni/?originalSubdomain=in), who is currently an ATSE OpenShift Engineer at Red Hat presented around GitOps, DevOps and Automation. He is an AWS Community Builder and leader, a CNCF Community Leader, a LiFT Cloud Captain, and an OpenSource.  Check out his session where he talks about everything GitOps, DevOps and Automation.

{% youtube ULglA6q_INs&t=72s %}

More DevOps Videos:

- [Scaling DevOps to the Edge](https://www.youtube.com/watch?v=yU9cuyUwFkM&t=206s)
- [From "Build" to "Release" ~ Let's 'Codify' all the things](https://www.youtube.com/watch?v=Cut8saUKBAI&t=1s)
- [What is Chaos Engineering?](https://www.youtube.com/watch?v=myPrHot8iiY)
What do you need to get started in web development?
Tags: webdev, codenewbie, beginners, github
Published: 2022-01-17 12:35:31

## Getting Started
If you want to get started in web development, you'll need a few basic tools and technologies first.


## Text Editor
![Atom text editor logo](https://cdn.hashnode.com/res/hashnode/image/upload/v1641570404533/pM6UzPfSm.png)
First things first you’re going to need a text editor. There are many to choose from and when you’re starting out it doesn’t matter much which one you go for. Popular choices are  [Visual Studio Code](https://code.visualstudio.com/Download) ,  [Atom ](https://atom.io/) and  [Notepad++](https://notepad-plus-plus.org/downloads/) . My personal favorite is Visual Studio Code: it is very customizable, has lots of add-ons and it works really well as an  [Integrated Development Environment](https://www.redhat.com/en/topics/middleware/what-is-ide).

Unlike with other programming languages the web browser (think Google Chrome, Internet Explorer, Firefox) will handle the code which you write so there’s no need to install the programming language.

## Optional Extras
Here are some things that you will need on your programming journey even if you don’t need them straight away:


### Git
![git logo](https://cdn.hashnode.com/res/hashnode/image/upload/v1641570642613/PrSoH-AV0.png)
Git is a program used for version control. There is an explanation of what that is  [here](https://www.w3schools.in/git/version-control/). Essentially it is a way to save lots of different versions of what you’re working on and manage them all in one place. You can then try out new things and if it all goes wrong you can easily switch back to an older saved version.



### CLI
![command line](https://cdn.hashnode.com/res/hashnode/image/upload/v1641570686168/_1PZL944D.jpeg)
A CLI or command-line interface is a text-based program that you can use to navigate the files on your computer and run programs. Although most of us are used to interacting with our computers with clickable icons on the screen, in the tech world the text-based CLI is essential. The good news is that you will already have one installed on your computer. To find it on Windows use the search bar to look for command prompt. On Mac, hit the search icon and search for Terminal and if you own a Linux you probably already know how to access it.

A popular program for Windows users is  [Git Bash](https://gitforwindows.org/)  which allows you to use Linux commands in the Git Bash terminal.


### GitHub
![github logo](https://cdn.hashnode.com/res/hashnode/image/upload/v1641571643725/rUKzJl9xg.png)

Not to be confused with git;  [Git Hub](https://github.com/)  is a website where you can share your code with the world. This is your portfolio of code, where you can share your projects or show off to potential employers. You can also contribute to other people’s projects. There’s nothing to download (You will use it with git once you have that installed) just go to the website and create an account.
My Command Line Tools for Linux Terminal in 2022
Tags: linux, terminal, productivity, discuss
Published: 2022-01-17 12:31:46

In the beginning of this year, I started to search some new and modern command line tools for the Linux terminal. Here are some that I am currently using.

---

## LSD

![LSD](https://raw.githubusercontent.com/Peltoche/lsd/assets/screen_lsd.png)

[LSD](https://github.com/Peltoche/lsd) (or LSDeluxe) is a rewrite of `ls` command, with a lot of new features like colors, icons, tree-view, etc.

This tool uses icons from the [Nerd Fonts](https://github.com/ryanoasis/nerd-fonts) project, and is capable of creating beautiful and useful outputs of your files and directories.

After installing this command, you can create an alias for LSD, replacing the traditional `ls` command:

```sh
alias ls="lsd"
```

---

## Bat

![Bay](https://camo.githubusercontent.com/c436c206f2c86605ab2f9fb632dd485afc05fccbf14af472770b0c59d876c9cc/68747470733a2f2f692e696d6775722e636f6d2f326c53573452452e706e67)

[Bat](https://github.com/sharkdp/bat) is a `cat` clone with syntax highlighting and Git integration.

Like LSD, Bat can be used to replace the `cat` command, and it is recommended to use this alias to preserve the default behavior:

```sh
alias cat="bat --paging=never"
```

---

## Zoxide

![Zoxide](https://github.com/ajeetdsouza/zoxide/raw/main/contrib/tutorial.webp)

[Zoxide](https://github.com/ajeetdsouza/zoxide) is a smarter `cd` command, inspired in z and autojump. The best feature of this tool is to remember the paths you use most frequently.

Besides its `z` command, Zoxide has the `zi` command, which uses fzf to interactively select the path.

This tool supports all major shells, so you can use it on Zsh, Fish, PowerShell, etc.

---

## Fzf

![Fzf](https://raw.githubusercontent.com/junegunn/i/master/fzf-preview.png)

[Fzf](https://github.com/junegunn/fzf) is a general-purpose command-line fuzzy finder. Like I commented in Zoxide section, Fzf is used to interactively find and select something.

It can be used to find paths, host names, environment variables and much more.

Currently, I am using this tool with the [fzf-tab](https://github.com/Aloxaf/fzf-tab) plugin for Zsh, which replaces zsh's default completion selection menu with Fzf, and it is working very well.

---

There is a tool that you are using this year that I have not commented here? Write it below! I will love to find new interesting projects.
Random background color changer in JavaScript
Tags: javascript, webdev, tutorial
Published: 2022-01-17 12:30:51

Demo:- https://codepen.io/iammanojrathod/pen/PoJLQvQ

HTML code: - 

```
<button id="btn">Click me</button>
```

CSS code: -

```
body{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
button{
  background: orange;
  color: black;
  outline: none;
  padding: 10px 20px;
  border: 1px solid black;
  border-radius: 10px;
  font-size: 1.5rem;
  cursor: pointer;
  box-shadow: 3px 3px 5px;
}
button:active{
  transform: translate(3px, 3px);
}
```

JavaScript code: -

```
const btn = document.getElementById('btn');

btn.addEventListener('click', () => {
  document.body.style.background = randomBg();
  console.log(randomBg());
});

function randomBg() {
  return `hsl(${Math.floor(Math.random() * 360)}, 100%, 50%)`;
}
```
Web Scraping in Golang
Tags: webscraping, go, beonthego
Published: 2022-01-17 12:17:48


Web scraping is a handy tool to have in a data scientist's skill set. It can be useful in a
variety of situations to gather data, such as when a website does not provide an API. We will be using this golang package [github.com/anaskhan96/soup](https://github.com/anaskhan96/soup). It performs the same as beautifulsoup of python. 
This is the [webpage](https://xkcd.com/2/) we are going to be scraping.

Below is a highlighted image of our desired values on the Browsers Dev tools.  

![Web Scraping in Golang](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/elolx9mqtdo3mt6mzu5m.jpg) 

Here is our code

```go
package main

import (
	"fmt"
	"github.com/anaskhan96/soup"
)
func main(){
fmt.Println("Enter the xkcd comic number :") //collect user input
var num int //declare an integer called"num" to store the input
fmt.Scanf("%d", &num) //Collect the user input and assign it to num
url := fmt.Sprintf("https://xkcd.com/%d", num)//Append num to website url '' 
resp, _ := soup.Get(url)  //Call the soup fuction to extract url
doc := soup.HTMLParse(resp) //Parse extracted url to HTML encoding
title := doc.Find("div", "id", "ctitle").Text()  // parse HTML Text
fmt.Println("Title of the comic :", title) // print HTML Text
comicImg := doc.Find("div", "id", "comic").Find("img") //Parse HTML IMAGE
fmt.Println("Source of the image :", comicImg.Attrs()["src"])
fmt.Println("Underlying text of the image :", comicImg.Attrs()["title"])
}
```
And Here is our output.
![Output Image Webscraping in golang ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e7gmtvpx1fm4v3ddy8u6.png)
 
Here is the [Github Repo](https://github.com/Forchapeatl/Golang-Web-Scraper-Example)
Credits to [Daniel Whitenack](https://twitter.com/dwhitena) on his book [Machine Learning With Go](https://www.packtpub.com/product/machine-learning-with-go/9781785882104)
Dask: From Scratch to Scalable Analytics in Python! :)
Tags: datascience, machinelearning, deeplearning, python
Published: 2022-01-17 12:16:50

A Set of Practical, Powerful, and Sexy Libraries for Working with Machine and Deep Learning!

Dask is a set of flexible libraries for parallel computing in Python consisting of two parts:

* Dynamic Task Scheduling: It’s like Airflow, Luigi, Celery, or Make but optimized for interactive computing workloads.

* Custom types for “Big Data”: such as parallel arrays, dataframes, and lists that extend standard interfaces like NumPy, Pandas, or Python iterators for distributed environments, or larger than memory. These parallel collections run on top of dynamic task schedulers.

In addition to this part, there is still a strong integration with frameworks and other libraries for data science, customized interfaces to facilitate its use, in addition to being an open-source project with a large maintainer community and having a vast ecosystem of integrations and other “daughter” libraries. ”

Find out more about Dask at:

https://jlgjosue.medium.com/dask-from-scratch-to-scalable-analytics-in-python-e2139a6295e6
Becoming A Blockchain Developer - Day 01
Tags: blockchain, learning, web3, dapp
Published: 2022-01-17 12:16:31

17/01/2022

Hi Guys, I'm Hashir, an average full stack developer who is very passionate about the whole web3 world and here I'm documenting my journey of learning blockchain development. Currently, I'm a full time employee and I'm planning to learn blockchain web app development using the resources availale on the internet. I'm following this whole web3 domain for a long time and now I think this is the perfect time to start. Today I went through some how to become a blockchain developer, The blockchain developer roadmap sort of youtube videos and I think I got an idea about what to do next. I really want to deep dive into all these so that am gonna spend a good amount of time to understand the abc's of the blockchain. Anyway, that's all about today friends. All the best for whatever you're working on too.
Vim Creator Bram Moolenaar Interview
Tags: vim, webdev, programming, discuss
Published: 2022-01-17 12:00:48

We had a great talk with Bram Moolenaar, a Dutch computer programmer and an active member of the open-source software community. Bram is the original author, maintainer, release manager, and benevolent dictator for life of Vim, a vi-derivative text editor that is very popular among programmers and power users.

[Enjoy the full interview here!](https://evrone.com/bram-moolenaar-interview)
Welcome, HomoSapiens!
Tags: productivity, programming, developerlife
Published: 2022-01-17 10:24:59

Hello World! 

The phrase known globally amongst us developers! Binary or not, we have all once there, starting to get the Matrix feels from **print('Hello World!')** to scoundering the plains of Stack Overflow for answers, we all have our own journeys and experiences. And now that I am *almost* done with my college and have started my software engineer journey, I plan on documenting my journey here, adding all my past project tutorials and the new technologies I am learning, so I might be able to help someone, just like I have been  helped by this community before! 
So hop on to my journey from campus to college! 

XOXO
Shatakshi Raman
My Learning Notion Template
Tags: learning, notion, template
Published: 2022-01-17 12:00:35

[My template](https://safe-trombone-6e0.notion.site/b5061566ace34916bb10c5808348b09a?v=1192341813844a71bdf9c6d411fd1e50)

Duplicate the template into your Notion space and you are ready to go!

I created this Notion template just a few days ago since I felt I wasn't retaining enough from what I learn and it always seems like I learn about so many new stuff everyday but I can never recall anything. After surfing on how others are tracking their own learning journey, I came up with this template for myself!

![Screenshot of my own log](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0dqjisujb75rujwtnxco.png)

![Screenshot of my own log](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/odq7qtjysoa2gmd0ga6j.png)
 

The template has a Table and Calendar view.
 
Here are my reasoning for the columns:

- **Completed?** : Acts as a motivation for you to complete what you are learning without giving up.
- **What** : What are you learning about?
- **Why** :  Always define a purpose for learning about that particular topic.
- **When** : Date of learning
- **Where** : Links to what you are learning.
- **Tags** : Create tags with the common topic of what you are learning so that you can later filter entries when you need to recall what you learnt about that topic.
- **Duration** : Minutes you learnt for.

Everytime you sit to learn something new, create an entry and time yourself. That puts you under pressure to use the minutes wisely without getting distracted!

Do let me know if this template helps you and how we can improve it!❤️
7 Best WordPress Activity Log Plugins To Track User
Published: 2022-01-17 11:57:12

WordPress is an open-source blogging tool that has become extremely popular as a content management system (CMS) for use on the World Wide Web. 

As of July 2021, WordPress is used by over 37% of the top sixty million websites. WordPress is so widely used by websites, website managers need to be able to track user activity on their WordPress sites. The good news is that there are a number of great plugins that can help you to accomplish this. In this article, we will be discussing three of the best WordPress Activity Log plugins available.

This post aims to help you choose the best WordPress plugins for tracking user activity. While there are various plugins to choose from, each has its own set of features, advantages, and disadvantages. This article will help you choose the best plugins to track user activity in WordPress.

# 7 Best Plugins To Track User Activity In WordPress

## 1. User Activity Log

User Activity Log is a comprehensive plugin that helps you keep track of all the activities performed by users on your WordPress site’s admin side. It shows information about the core updates, theme updates, user registration/login status, user logout status, and more. 

Key Features:

Password Security
Custom Event Log
Email Notification
Database Integration And Migration

This plugin is helpful when you want to monitor your website to see what other people are doing on it. A plugin is a special kind of tool that you can add to your WordPress. 

We’re trying to help people make their WordPress websites better by monitoring them. You may also receive updates on what is going on with your website, so you don’t have to constantly check it.

Read more/Source URL: [https://www.solwininfotech.com/blog/wordpress/best-wordpress-activity-log-plugins/](https://www.solwininfotech.com/blog/wordpress/best-wordpress-activity-log-plugins/)
JPA to implement epoc
Published: 2022-01-17 11:31:53

Need help to implement 
below part of sql in where clause using JPA CriteriaBuilder in java

abs(extract(epoch from shift_start_date - shift_end_date)/3600) < 8

here is the full sql
SELECT * 
FROM tbl_schedule
where start_date >= '2022-01-10'
and end_date <=  '2022-01-16'
and labour_id in ('123123') 
and abs(extract(epoch from start_date - end_date)/3600) < 8
and location = '01201'
Weekly Tech Update #1
Tags: machinelearning, security, ios
Published: 2022-01-17 11:28:00

## 1 Jun - 5 Jun 2021

This week's featured links:

* [Human-centered AI products guidebook from Google](https://pair.withgoogle.com/)
* [Fraud detection using Relational Graph Learning from Uber](https://eng.uber.com/fraud-detection/)
* [Klarna's user data breach](https://sifted.eu/articles/klarna-data-breach/)
* [Spotting and solving everyday problems with machine learning from TensorFlow](https://www.youtube.com/watch?v=_1QtMPuYIVw)
* [XCode Cloud will allow developers to remotely build apps](https://appleinsider.com/articles/21/06/07/xcode-cloud-will-let-developers-remotely-build-apps-improving-collaboration-and-efficiency)
Confused in Tech
Tags: productivity, career, webdev, beginners
Published: 2022-01-17 11:26:29

After shying away from online communities and only being a passive reader, with the start of an okayish 2022, I am looking to become a more confident and active contributor to the tech space.

When I joined college 2 years ago, I knew nothing about programming but of course, courses I took in college made me more confident in coding and it is certainly something I like doing. But it is definitely not something I love or see myself doing everyday for the rest of my life.

This does not mean I do not want to be in tech and I do not think anyone would not want to be in such a fast space where you can make loads of money with smartness. I certainly want to be in tech but I want everyday in my career to be different. A different project. A different problem. And a different solution I hope I solve for.

But first, I need the SKILLS. And I want to document my journey of learning in the tech space so that I can look back on how I have grown.

Everything I learn will be documented here in dev.to and hopefully it helps someone as confused but passionate as me. And hey if you are that person, hit me up! Let's talk about anything tech and see how we can thrive here!❤️
Testing a Generic Save Item Hook with MSW and @mockapi/msw
Tags: mswjs, reactquery, react, testing
Published: 2022-01-17 11:25:12

### Subject Under Test

A generic hook wrapping `useMutation` of `React-Query` for all of my master-detail edit forms.  It is an adaptor responsible for generating URL by entity name, error handling and invalidating relevant queries.

### Behaviours
1. it takes an `entityName` and generates the correct URL to send a post request to

2. it forwards models and request configurations to the HTTP request

3. it wires up `ErrorHandler` for error handling

4. it invalidates queries with keys containing the `entityName`

### MSW and @mockapi/msw
The tests use MSW and @mockapi/msw to mock a `post` endpoint for a dummy entity `Supplier`. @mockapi/msw provides a standard set of CRUD endpoints so that I do not have to write any endpoints for this test suite. For more information: [@mockapi/msw](https://github.com/rexebin/mockapi)

### Code
{%gist
https://gist.github.com/rexebin/62f3965e6f038c1fd186972124b9caee
%}

### Notes
1. `TestComponent` shows how the SUT is to be used. It also has a `useGetItems` hook to test if the queries are invalidated properly. The code and tests for `useGetItems` are [here](https://dev.to/rexebin/testing-a-generic-fetch-item-list-hook-with-mock-service-worker-1nm7), it also introduced the use of `useTranslationForTest` and `QueryClientProviderForTest`

2. the tests use `findByText` as a way to wait for the SUT to finish its operations 

3. `server.use` from MSW is used to override the target endpoint to test the `params` and error responses. 

4. With the help of MSW, the tests only care about the data flows. I love the setup because it doesn't care about how the HTTP requests are made. I could have replaced React Query and Axios without touching the tests.
Wrapper Component in React
Tags: react, javascript, component, programming
Published: 2022-01-17 11:19:06

## Hi, I would like to introduce wrapper.

## What is a wrapper?
Wrapper is a react concept, it is like a  fragment `<></>`  that covers any component or jsx as a blanket.

If you will use material ui component or Ant design, most probably you will encounter wrappers.

you can also make your own, let's have a look.

Wrapper.js
```
import React from "react";

export default function Wrapper(props) {
  return props.children;
}
```
This simple wrapper component will return everything it covers, it will not add anything on it's your own.

Now when you have build your own, you can use it anywhere in the project.

Home.js
```
import Wrapper from "../wrapper/Wrapper";
export function Home() {
  let navigate = useNavigate();
  return (
  
      <Wrapper>
        I am home component...
       <button onClick={() => navigate(`/Login`)}>go to login</button> 
      </Wrapper>

  );
}
```

This is my first article, As shortest as possible, if I have done any mistake, you are welcome to give me feedback, I will improve.
Counter - Framer Motion
Published: 2022-01-17 11:15:45


{% codesandbox react-tailwind-starter-forked-7hmb6 %}

I have been enjoying Framer Motion's animation library.
Framer Motion is beautiful and easy to use out of the box.
I was inspired by Ehsan Rahimi's counter design as I took on the challenge of developing it with framer motion.

Dribbble:
[Tally Counter Micro-Interaction by Ehsan Rahimi on Dribbble](https://dribbble.com/shots/16434514-Tally-Counter-Micro-Interaction)

I used tailwind css for styling, react icons for icons, and animation framer for animation.
For state, interaction will manage using a simple use state. 
We will have a number for the count and a boolean for showing the clear icon action.
Let's dive into the drag gesture. 
The drag gesture follows the rules of the pan gesture but applies pointer movement to the x and/or y axis of the component.
dragConstraints  - constraints on drag area.
drag and on drag end events listener.
Look at the code for the full vision. 

Link for framer documentation:
[Gestures | Framer for Developers](https://www.framer.com/docs/gestures/#drag)
my z-index
Published: 2022-01-17 10:55:06

__z-index: 12;
  width: 360px;
  padding: 15px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  border-left: 1px solid rgba(255, 255, 255, 0.5);
}
.container input[type="text"]{
  width: 100%;
  height: 100px;
  margin: 0 3px;
  outline: none;
  border: none;
  color: #fff;
  font-size: 20px;
  text-align: right;
  padding-right: 10px;
  pointer-events: none;
  background: transparent;
}
.container input[type="button"]{
  height: 65px;
  color: #fff;
  width: calc(100% / 4 - 5px);
  background: transparent;
  border-radius: 12px;
  margin-top: 15px;
  outline: none;
  border: none;
  font-size: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.container input[type="button"]:hover{
  background: rgba(255, 255, 255, 0.1);
}```