teleren/devto huggingface dataset:
How to use your github ssh keys for different accounts
Tags: git, github, ssh
Published: 2023-03-12 10:40:09

When you have couple different github accounts and different permissions for each of them it can get tricky to manage your projects. I found the best way is to use ssh and create a ssh config file to manage which key is for which github account. 

Create a ssh key from your terminal:

`ssh-keygen -t rsa -b 4096 -C "foo@bar.com"`

Copy and paste the outcome to :
`github -> settings -> SSH and GPG keys -> New SSH key`

Now you should have .ssh folder, in there manage your keys like for example if you have 2 different keys you should have 4 folders like: `work-ssh, work-ssh.pub, personal-ssh, personal-ssh.pub`

Create a file called config without any extension to name and add this config:

```
Host *
IgnoreUnknown UseKeychain

// Personal GitHub account

Host github.com
HostName github.com
User git
AddKeysToAgent yes
UseKeychain yes
IdentityFile ~/.ssh/personal-ssh

// Work GitHub account

Host github.com-work
HostName github.com
User git
AddKeysToAgent yes
UseKeychain yes
IdentityFile ~/.ssh/work-ssh
```

To use work ssh above you need to clone the repo like this:

`git@github.com-work:[Project Group]/[Project Name].git`

To use personal ssh above you need to clone the repo like a regular repo:

`git@github.com:[Project Group]/[Project Name].git`

Also keep in your mind that author will be the current global user if you don't change your global git user you can commit with wrong account even though you don't have access on github. So, to make it simple here is how I created my alias to change global git config in powershell:

```pwsh
Function GitCurrentUser { 
git config user.name; 
git config user.email 
}
Set-Alias -Name gcur -Value GitCurrentUser

Function SwitchToPersonal { 
git config --global user.name "[Your Gh user name"; 
git config --global user.email "[Your Gh Email]"; 
git config user.name; 
git config user.email 
}
Set-Alias -Name gpersonal -Value SwitchToPersonal
```
Feel free to comment if you have questions!
What is html &why it is used ?
Tags: html, website
Published: 2023-03-12 10:33:04

HTML (HyperText Markup Language) is a markup language used to create web pages and other type of documents that can be displayed on the internet. HTML provides a structure for organizing and formatting content such as text, images, videos, and links on a web page.
 HTML is used to create web pages that can be accessed by anyone with an internet connection and a web browser, and it provides a structure for organizing and formatting content on a web page.
What is event bubbling and event capturing in JavaScript?
Tags: javascript, webdev, beginners, programming
Published: 2023-03-12 10:26:36

Imagine you're at a party with a group of friends. You're all hanging out in the living room, but suddenly someone yells "PIZZA IS HERE!" and everyone starts rushing towards the door.

Event capturing is like your friend who heard the pizza guy outside and ran out to meet him at the front gate. He's trying to intercept the pizza before it even gets to the door, so he can get the first slice.

Event bubbling, on the other hand, is like when the pizza finally makes it to the door, and everyone in the living room rushes towards the door to get their slice. It starts with the person closest to the door, and then moves outward to include everyone else in the room.

In JavaScript, events work in a similar way. When something happens, like a button is clicked, the event starts at the top-level "document" element and then moves down to the specific element that was clicked. That's event capturing. Then, once the event has been handled by the clicked element, it starts "bubbling" back up to the top-level document element, passing through all the parent elements along the way.

I hope that helps make event bubbling and event capturing a bit more fun and memorable!

If you enjoyed this post, please consider following me for more content like this!
Learn About RedwoodJS: A Full-Stack JavaScript Framework for Faster Development and Scalability
Tags: redwoodjs, webdev, javascript, programming
Published: 2023-03-12 09:26:18

RedwoodJS is a full-stack JavaScript framework that aims to make building web applications simple and intuitive. It is based on React and GraphQL, and provides a set of conventions and tools to help developers quickly create and deploy production-ready applications.

Some of the key features of RedwoodJS include:

- A strong focus on developer experience and ease of use
- A built-in routing system for creating dynamic, client-side routes
- Seamless integration with Prisma ORM for database management
- A powerful CLI for generating code and scaffolding new features
- Integration with popular hosting platforms like Netlify and AWS
- A modular architecture that allows for easy extensibility and customization

RedwoodJS is designed to be opinionated and provide a clear path for building scalable, maintainable web applications. It has gained popularity among developers due to its focus on simplicity and productivity.

**Why we need to use RedwoodJS?**

There are several reasons why someone might choose to use RedwoodJS for building web applications:

**Faster Development:** RedwoodJS provides a lot of built-in functionality and conventions that help developers build web applications quickly and easily. It has a powerful CLI that can generate boilerplate code for common features like authentication, database models, and forms, which can save a lot of time and effort.

**Full-stack Framework:** RedwoodJS is a full-stack JavaScript framework, which means that it provides a complete solution for building web applications from the frontend to the backend. This eliminates the need for developers to use multiple tools and technologies, which can be time-consuming and error-prone.

**Scalability:** RedwoodJS is designed to be scalable, with a modular architecture that allows developers to add or remove features as needed. It also integrates well with Prisma ORM for database management, which can help with scaling data access.

**Developer Experience:** RedwoodJS prioritizes developer experience, with a focus on making it easy and enjoyable to build web applications. It provides clear documentation, a friendly community, and a set of conventions that can help reduce cognitive overhead and improve productivity.

[RedwoodJS Intro](https://www.youtube.com/watch?v=m_3I9mufZfs&ab_channel=RedwoodJS)
[redwoodjs.com](https://redwoodjs.com/)
[The App Framework for Startups](https://github.com/redwoodjs/redwood)

Overall, RedwoodJS can be a great choice for developers who want to build scalable, full-stack web applications quickly and easily, while also enjoying a good developer experience.

![My RedwoodJS stickers ](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vcd985moomgtol6cgryi.JPG)
These are the stickers I got from RedwoodJS. Give me a message if you want these too. [instagram](https://www.instagram.com/_abhixsh/)
The H Word
Tags: perl, python, theweeklychallenge
Published: 2023-03-12 09:21:36

## Weekly Challenge 207

[Challenge](https://theweeklychallenge.org/blog/perl-weekly-challenge-207/), [My solutions](https://github.com/manwar/perlweeklychallenge-club/tree/master/challenge-207/sgreen)

## Task 1: Keyboard Word

### Task

You are given an array of words.

Write a script to print all the words in the given array that can be types using alphabet on only one row of the keyboard.

Let us assume the keys are arranged as per the standard QWERTY keyboard.

### My solution

This is pretty straight forward. Go through the list and find any values that match the regular expression `^(?:[qwertyuiop]+|[asdfghjkl]+|[zxcvbnm]+)$`. In Python, I use the [for if](https://peps.python.org/pep-0289/) method to filter this list. In Perl, I use the [grep](https://perldoc.perl.org/functions/grep) method.

### Examples

```bash
$ ./ch-1.py Hello Alaska Dad Peace
("Alaska","Dad")

$ ./ch-1.py OMG Bye
()
```

### Task 2: H-Index

### Task

You are given an array of integers containing citations a researcher has received for each paper.

Write a script to compute the researcher’s H-Index. For more information please checkout the [wikipedia page](https://en.wikipedia.org/wiki/H-index).

The H-Index is the largest number h such that h articles have at least h citations each. For example, if an author has five publications, with 9, 7, 6, 2, and 1 citations (ordered from greatest to least), then the author’s h-index is 3, because the author has three publications with 3 or more citations. However, the author does not have four publications with 4 or more citations.

### My solution

There are probably better ways of doing this, but I'm just brute forcing this. Like with many of these challenges, the sample size is so small that any improvements aren't going to provide any major gain.

Go from 1 to the length of the list (array in Perl), and check if there are at least that many items that are greater than or equal to that number.

### Examples

```bash
$ ./ch-2.py 10 8 5 4 3
4

$ ./ch-2.py 25 8 5 3 3
3
```
Flowchart editor dgrm.net / announcement / hotkeys
Tags: webdev, javascript, productivity
Published: 2023-03-12 08:48:30



![Hotkeys Ctrl C + Ctrl V support](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a2yy2uu2sqefmcge4le6.gif)

[Dgrm.net](https://dgrm.net/) now support

- `Ctrl C`, `Ctrl V`, `Ctrl X`
- `Del`, `Backspace`

You can copy and past between charts.

Give a star on [GitHub](https://github.com/AlexeyBoiko/DgrmJS) to support the project.
A Beginner's Guide to Understanding Scalability in Cloud Computing
Tags: devops, community, cloud, devrel
Published: 2023-03-12 08:16:44

## 🎯 What is Scalability?
Let's make it simple for you. Suppose you're running your own e-commerce web app like Amazon or Flipkart. For handling customer data you use rented servers or your own purchased servers. You observed high sales growth and new customers during festival season.

Now, what you would do to handle new customers ? 

Either you will increase the server capacity or you will add more servers to your list.
This ability of your infrastructure to increase or decrease IT resources as per usage and need is called Scalability.

## 💥 Types of Scaling
There are two basic types of scaling: Vertical scaling and Horizontal scaling. Let's take a look of each one by one.

### Vertical Scaling
Let's say you have a resource it can be anything a database, a VM or a container. How would you scale it?
You can scale it by increase it's size, wait what do you mean by size? Here size refers it's core features like CPU, memory and storage.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dacexc0h2mu4412830vw.png)
 
This method of scaling where increasing or decreasing the size of the resources happens is known as Vertical Scaling. Increasing the size is called scaling up and decreasing the size is called scaling down. 

It is easy to scale vertically but sometimes you have to face major downtime which will affect your system performance 🥵

### Horizontal Scaling
In this method we increase or decrease the amount of resources in our system to spread the workload equally. Which will result us better performance and higher availability.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rg74pv2v9vthrqrsxi14.png)

The risk of downtime with horizontal scaling is lower than vertically scaling. So that most of people suggest to use this type of scaling.

## 👋End credits
Now, most of the cloud service providers have a feature of Auto-scaling, which allows you to automatically scale up or scale down your cloud services like EC2, AWS S3, etc. Check-out [this](https://avinetworks.com/glossary/auto-scaling/) for more about Auto-scaling.

So that's all about scaling and its types. I will be back again with new topic in cloud and DevOps. Do subscribe my blog 🤠
Animation -1 : Pure CSS Bouncing Basketball Loader
Tags: css, design, animation, webdev
Published: 2023-03-12 08:06:23

Are you looking for animations to enhance your website? We've got you covered with our wide selection of creative and engaging #animations. Say goodbye to endless searching and hello to seamless integration on your website!

#### We're excited to introduce our latest YouTube series, which features diverse creative and inspiring website animations.

---

In our short videos, you'll find a variety of #animations that can be easily implemented on your website to enhance user experience.


---

### Pure CSS Bouncing Basketball Loader

---

{% youtube  51tRLhi0JkI %}

 ---
### [Source code](https://codepen.io/jerrylow/pen/JjdrmwY)


---
## For more information

1. Check my GitHub profile
[https://github.com/amitSharma7741](https://github.com/amitSharma7741)

2. Check out my Fiver profile if you need any freelancing work
[https://www.fiverr.com/amit_sharma77](https://www.fiverr.com/amit_sharma77)

3. Check out my Instagram
[https://www.instagram.com/fromgoodthings/](https://www.instagram.com/fromgoodthings/)

4. Linktree
[https://linktr.ee/jonSnow77](https://linktr.ee/jonSnow77)

5. Check my project

- EVSTART: Electric Vehicle is the Future
[https://evstart.netlify.app/](https://evstart.netlify.app/)
-  News Website in react
 [https://newsmon.netlify.app/](https://newsmon.netlify.app/)
-  Hindi jokes API
 [https://hindi-jokes-api.onrender.com/](https://hindi-jokes-api.onrender.com/)
- Sudoku Game And API
[https://sudoku-game-and-api.netlify.app/](https://sudoku-game-and-api.netlify.app/)

---
---
Twitter Followers Realtime Tracker
Tags: webdev, twitter, nextjs, react
Published: 2023-03-12 08:02:48

TwiterStats is a Realtime Twitter Followers Tracker with some cool features.

1. Real time followers count
2. Export the profile card as image
3. Dark Mode Support
4. Much more coming soon

Try Demo now -> https://twiter-stats.vercel.app

Dedicated article to develop -> https://dev.to/nilanth/twitter-followers-tracker-using-nextjs-nextauth-and-tailwindcss-1em7
A Quick 10-Second Programming Joke For Today
Tags: jokes, dailydeveloperjokes
Published: 2023-03-12 08:00:29

---
title: "A Quick 10-Second Programming Joke For Today"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
published: true
tags: #jokes, #dailydeveloperjokes
---

Hi there! Here's today's Daily Developer Joke. We hope you enjoy it; it's a good one.

![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1258d992c4e.png)

---

For more jokes, and to submit your own joke to get featured, check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/). We're also open sourced, so feel free to view [our GitHub Profile](https://github.com/dailydeveloperjokes).

### Leave this post a ❤️ if you liked today's joke, and stay tuned for tomorrow's joke too!

_This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit._

<!--
Joke text:
___Q:___ How do programming pirates pass method parameters?

___A:___ Varrrrarrrgs.
 -->
How Do You Balance Short Term Versus Long Term Career Goals?
Tags: discuss, beginners, codenewbie
Published: 2023-03-12 08:00:00

Balancing short term versus long term career goals is especially important in the tech industry, where things are constantly changing. Short term goals can help you achieve immediate success, stay motivated, and build momentum. Long term goals can help you create a vision for your future and make strategic decisions about your career path.

Coders both new and more experienced: what considerations do you make when setting your goals? Personal interests? The current job market? And what are your goals, both near and far? Share with us!
Earn Money by Technical Blogging for QA
Tags: webdev, beginners, programming, tutorial
Published: 2023-03-12 07:02:23

Earn Money by Technical Blogging for QA:  In this video, we are going to discuss about my experience with freelancing QA & Websites which pay you for testing and writing blogs.

{% embed https://youtu.be/DfyTricouBw %}

✅ Part 1  - 
Top 11 Freelancing Websites for Software Testers& QA. (Even as Manual Tester) - https://youtu.be/NS16TsvKNRI

✅ Part 2  - 
Earn Money By Testing Websites, Is $100 a Day Possible? 
https://youtu.be/1YJiWk_a1vw

Most of the projects are related to usability testing, accessibility testing and UI Testing related projects.

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
✅ Mastering API Testing Course   https://learnapitesting.com

✅ Join at  :  https://learn.thetestingacademy.com

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

Join Facebook Group :  http://bit.ly/learntesting2019

Website:   https://scrolltest.com

Website:   https://thetestingacademy.com

Twitter: https://twitter.com/itstechmode

🚀 Tools and services I recommend:
Some of the courses that I recommend to become better Automation Tester 🙌🙌

✅API Testing - 
https://www.learnapitesting.com


✅Cypress Tutorial with LIVE Projects -
http://cypresstutorial.com
Greet your visitor
Tags: javascript, programming, opensource, dashboard
Published: 2023-03-12 06:57:29

Greet your Visitors with Good Morning, Good Afternoon or Good Evening Message using JavaScript

#### Install using npm

```bash
npm install greet-visitor
```

https://www.npmjs.com/package/greet-visitor

#### Sample Output - with emoji


| Time Range    | Output            |
| ------------- | ----------------- |
| >= 3 - <= 12  | 🌞 Good morning   |
| >= 12 - <= 17 | 🌞 Good afternoon |
| >= 17 - <= 20 | 🌓 Good evening   |
| >= 20 - <= 24 | 🌒 Good night     |
| >= 23 - <= 3  | 🌚 Oh! working late night   |

#### Configurable Default Options

```
{
    "emoji": true,
    "morning": "Good Morning",
    "noon": "Good Afternoon",
    "evening": "Good Evening",
    "night": "Good Night",
    "midnight": "Oh! working late night",
}
```

#### Sample Code

```javascript
var greet = require("greet-visitor");

greet();
// Based on system default time it will show different messages. as mentioned above
```

#### Sample Code with Option Change

```javascript
var greet = require("greet-visitor");

greet({emoji: false, noon: "Good noon !"});

// Output- at noon
"Good noon !"

// Output- in morning
"Good Morning"
```
How to display line breaks in React for the "\n" newline character.
Tags: webdev, react, javascript, beginners
Published: 2023-03-12 06:42:54

In React, displaying the newline character "\n" as a line break in HTML can be tricky as it won't be interpreted as a newline character. However, React provides a way to display line breaks for string with "\n" characters in HTML.
For example, to display a newline code contained in a value received from the API, etc. as a newline, one function must be interspersed.

When dealing with strings that contain newline characters (\n) in React, you may want to convert them to <br> tags to display line breaks in the UI. However, simply replacing \n with <br> in the string won't work as expected in JSX, since the string <br> will be rendered as text rather than as a line break.

```js
// const text = "Apple\nOrange\nBanaa";
const element = ({ text }) => {
  const newlineText = text.replace(/\n/g, '<br />');
  return <div>{newlineText}</div>;
}
```
The results is here:

```
Apple<br />Orange<br />Banana
```

Here is an example of how to display line breaks in React for the "\n" newline character:

```javascript
import React from 'react';

function TextWithLineBreaks(props) {
  const textWithBreaks = props.text.split('\n').map((text, index) => (
    <React.Fragment key={index}>
      {text}
      <br />
    </React.Fragment>
  ));

  return <div>{textWithBreaks}</div>;
}

export default TextWithLineBreaks;
```

In this example, the TextWithLineBreaks component splits the input text string into an array of substrings using the split() method with "\n" as the separator. It then maps over each substring, adding a <br> element after each substring to represent the newline.

The React.Fragment component is used to group multiple elements returned from the map() function into a single element.

Here is how the TextWithLineBreaks component can be used to display text with line breaks:

```javascript
import React from 'react';
import TextWithLineBreaks from './TextWithLineBreaks';

function App() {
  return (
    <div>
      <TextWithLineBreaks text="Hello\nWorld" />
    </div>
  );
}

export default App;
```

In this example, the TextWithLineBreaks component is passed the string "Hello\nWorld" and will display it with a line break between "Hello" and "World".

Using this method, you can easily display text with line breaks in React for the "\n" newline character.


The sample code in this article is partially modified from the one generated by openAI.
Beyond Technical Interviews: Rethinking Hiring Criteria for Top Talent.
Tags: recruit, webdev, interview
Published: 2023-03-12 06:41:54

Although technical interviews are a commonly-used tool to identify the most suitable candidates, they often overlook the immense potential of many good or even exceptional employees.

As a developer myself, I can attest to this fact. I am someone who consistently goes above and beyond to resolve issues, even if they are not within my designated responsibilities.

> I am always willing to carry the weight of the company on my shoulders, and I consistently exceed performance expectations. However, I struggle when it comes to technical interviews.

Whether due to nerves or other factors, I may not perform as well as I know I am capable of.

My personal experience has given me a unique perspective on how to hire the best candidates for my future endeavors. I am now convinced that technical interviews should not serve as the sole criterion for assessing the suitability of a candidate. In my next piece, I will elaborate on alternative benchmarks that should be used for hiring, in order to ensure that companies attract and retain top talent.

Don’t forget to clap if you find this article interesting.

Follow me here: https://twitter.com/BillionsJoel
Use AI to commit like a PRO in 1 second
Tags: git, tutorial, productivity, ai
Published: 2023-03-12 06:41:09

_first — let's grow [my twitter](https://twitter.com/_sukharev_), so i can tell about my inventions quicker and make the world even better place (or not, idk)_

---

I struggled making commit messages since 2017. When you think of a commit message — you switch context from writing code. When you switch context — you waste time. Wasting time is lame.

I usually made 1 line commits like "amends", "fixed bug", "refactoring" and then tried to come up with a good general message when merging a branch to production.

It has changed when ChatGPT was published.

I open-sourced [OpenCommit](https://github.com/di-sukharev/opencommit).

![opencommit — before and after](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fdik9aq5iwk3e4bqsqbk.png)

The library uses [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/) convention which makes commits concise and comprehensive. You can also turn on [GitMoji](https://gitmoji.dev/) setting if you like.

Simply install it with npm:
```sh
npm i -g opencommit
```

After installing type `oc` and hit "Enter" in a terminal:
```sh
oc
```

That's it.

For more info [read the docs](https://github.com/di-sukharev/opencommit#setup).

![opencommit animation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m58jycy84s4jak2gfcl2.gif)

i know it's impressive, i'll probably help the world more with other extraordinary inventions, you may follow my bird [twitter](https://twitter.com/_sukharev_)