teleren/devto huggingface dataset:
API Projects for Web Development
Tags: webdev, beginners, api, productivity
Published: 2022-07-22 13:25:00

Hello guys today i want to show you some API's which we can use to create web apps with API's and understand the concept of API's in a much better way.
## What is API?
API stands for Application Programming Interface and it is medium or mechanism that enable two software components to communicate with each other using a set of rules.

## REST API's -
This is the most popular and flexible API's found on the web. It works on client-server architecture , the client sends a request in the form of data to the server and server responds back in the form of response after doing internal functions of server like finding the data in the database, checking validations and security etc.

## API's to practice for Web development-

1.Spooncular API - 
It is an API related to food data like ingredients,recipes,steps to cook,protiens,vitamins,etc.

Source - https://spoonacular.com/food-api
Example Project - https://e-recipes.netlify.app/

2. Wikipedia API -
This api data directly from api and also provides a link to the page that have the complete information of that topic.

API - https://en.wikipedia.org//w/api.php?origin=*&action=query&format=json&list=search&utf8=1&srsearch="YOUR_QUERY"

NOTE - Copy this api and change the "YOUR_QUERY" with anything you want or make it dynamic with HTML input tag 

Example Project - https://knowledge-earth2k99.netlify.app/

3. Unsplash API - 
This api fetch images directly from the Unsplash Website , a website that provides High quality images for free.

Source - https://unsplash.com/developers
Example Project - https://waadu-image-downloader.netlify.app/

4. Open Weathe API - 
It is an api which provides data related to weather forecasts.
It has a free version but limited number of Api calls per day.

Source - https://openweathermap.org/api

5. Pokemon Api - 
This api fetch data about the pokemon's and it is playfull api and can be usefull to learn the concept of API's data fetching.

Source - https://pokeapi.co/

Thats it for this post.
THANK YOU FOR READING THIS POST AND IF YOU FIND ANY MISTAKE OR WANTS TO GIVE ANY SUGGESTION , PLEASE MENTION IT IN THE COMMENT SECTION.
^^You can help me by some donation at the link below Thank you👇👇 ^^
☕ --> https://www.buymeacoffee.com/waaduheck <--

Also check these posts as well
https://dev.to/shubhamtiwari909/javascript-map-with-filter-2jgo

https://dev.to/shubhamtiwari909/e-quotes-3bng

https://dev.to/shubhamtiwari909/deploy-react-app-on-netlify-kl
Types of Networks - Centralized, Decentralized and Distributed | Blockchain
Tags: 100daysofcode, blockchain, programming, codenewbie
Published: 2022-07-22 13:22:00

In this video, we will discuss the different types of networks that exists. We will cover the centralized, decentralized and the distributed networks. We will also see what types of networks do blockchain uses internally. 

{% youtube EpNCBY6ezaE %}
----------------------------------------


Support my channel:
💜 Join the Discord community 👨‍👩‍👧‍👦: https://discord.gg/fgbtN2a 
💜 One time donations via PayPal
Thank you! 🙏

---
Follow me on:
👉 My Blog: https://the-nerdy-dev.com
👉 Twitter: https://twitter.com/The_Nerdy_Dev
👉 Instagram: https://instagram.com/thenerdydev
Should I share my current salary with recruiters?
Tags: discuss, career, anonymous
Published: 2022-07-22 13:18:02

_This is an anonymous post sent in by a member who does not want their name disclosed. Please be thoughtful with your responses, as these are usually tough posts to write. Email sloan@dev.to if you'd like to leave an anonymous comment or if you want to ask your own anonymous question._ 

***


I've been on the job hunt for around a month now, and have been wondering about the benefits to sharing my current salary with recruiters - please let me know the pros and cons to this decision.
Follow Friday: Linux Edition (22 July 2022)
Tags: meta, linux, bash, unix
Published: 2022-07-22 13:14:39

---
title: Follow Friday: Linux Edition (22 July 2022)
published: true
description: 
series: Follow Friday
tags: meta, linux, bash, unix
---

_Happy Friday, friends! 🎉 Follow Friday is your weekly opportunity to shout out fellow DEV Community members doing awesome work. Check out the comments and follow someone new!_

Linus Torvalds started it all in 1991 with the Linux kernel, and 32 years later we’re still learning and creating new ways to wield the mighty power of the Terminal.

So, devs: who are your favorite DEV community members writing about Linux? Authors writing about bash and the Unix shell are also fair game today.

_**Formatting tip**: to populate a card with a follow button, use the liquid tag syntax `{% embed https://... %}` and insert the URL of your favorite author's profile._

Join in on the #FollowFriday fun by @mentioning your favorite author to follow for Linux tales (and letting us know why you love their posts!) ⤵️
Things to look for in an angular Developer before hiring them in 2022!
Tags: angular, developer, softwaredevelopment, webdev
Published: 2022-07-22 12:58:34

If you are looking for an elite-level frontend developer for your project then nothing can beat the excellence of the top-tier Angular Developers. In order to to get the optimum advantage of this amazing frontend technology. However, more than that one needs a well-versed Angular Developer that can understand your requirement and develop your product in accordance with that.

However, there are chances you may hire Angular Developer that can not provide Angular Development services which is not upto the mark. In such circumstances, your resources and is been stuck and you might not get the right result for your project.

In order to avoid such a mess hire Angular Developer with taking these precautionary measures in the initial phase only. Check out these top 5 skills while hiring Angular Developer for your project

## Tips skills to look for in Angular Developer in 2022


### 1. Consistent Angular Development Skills
The prospect Angular Developer should be able to recognize all the technicality of the Angular framework and get updated with the latest technical excellence and upgrades. 

### 2. RESTful API Interaction
The Angular Developer must possess knowledge of building RESTful API including PUT, POST data, and DELETE features. RESTful API Integration can be done profoundly with the tech expertise of the well-experienced Angular Developer.

### 3. Knowledge of Node and webpack
Webpack and Node add potential to the core features of Angular technology. Having acquainted with such extensive tech skills adds value to your project. The position of Angular Developers varies from junior to senior level and this prominently affects such additional skillsets which transform your project.

These were the basics to know whether the **[Angular Developer](https://www.bacancytechnology.com/angular-js-development)** you are hiring possesses the skills that your project requires or not. If you still feel stuck and do not know where to start, Hire Angular Developer from one of the leading Angular Development companies in the industry.
The Peer to Peer Network and Distributed Network in Blockchain
Tags: 100daysofcode, blockchain, programming, codenewbie
Published: 2022-07-22 13:11:00

In this video, we will learn what a peer to peer network actually is and how it is deployed in a blockchain. The blockchain uses distributed peer to peer network in its architecture. So this is what we cover in this very short lesson. 

{% youtube 3ASrMyKGk48 %}

----------------------------------------

Support my channel:
💜 Join the Discord community 👨‍👩‍👧‍👦: https://discord.gg/fgbtN2a 
💜 One time donations via PayPal
Thank you! 🙏

---
Follow me on:
👉 My Blog: https://the-nerdy-dev.com
👉 Twitter: https://twitter.com/The_Nerdy_Dev
👉 Instagram: https://instagram.com/thenerdydev
Understanding the Block Structure and Merkle Root in a Blockchain
Tags: 100daysofcode, blockchain, programming, codenewbie
Published: 2022-07-22 13:09:00

In this video, we will discuss in detail the blockchain and the block structure and then we will understand one of the core components of a block which is the Merkle Root. 

{% youtube Y946gJwr1z4 %}

----------------------------------------
Support my channel:
💜 Join the Discord community 👨‍👩‍👧‍👦: https://discord.gg/fgbtN2a 
💜 One time donations via PayPal
Thank you! 🙏

---
Follow me on:
👉 My Blog : https://the-nerdy-dev.com
👉 Twitter: https://twitter.com/The_Nerdy_Dev
👉 Instagram: https://instagram.com/thenerdydev
Java Script Tracking Script
Published: 2022-07-22 13:05:57

Hi to All Community, 

I want to know that, what makes the java script tracking code light, so when a website owner inject that (in general we called third party js code). 

What efforts i can do to make it more light js script, that won't the website performance as SEO. As normally the this issue covered in reduce the third party js execution time. 

**Suggestions are highly Appreciated. **
Image Animation when Scrolling
Tags: javascript, animate, image
Published: 2022-07-22 13:05:00


![Maurer Krisztián](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j8k68k4eyl9xa4wrbd6r.gif)
Code: [https://github.com/MaurerKrisztian/Scroll_Image_Animation](https://github.com/MaurerKrisztian/Scroll_Image_Animation)

Demo: [https://maurerkrisztian.github.io/Scroll_Image_Animation/](https://maurerkrisztian.github.io/Scroll_Image_Animation/)

##  This project is about making animation with images by scrolling up and down and looping them.

I know, I know, it's not the best way to animate images, but it was a fun little project.

core code: [animateImageByScroll.js](https://github.com/MaurerKrisztian/Scroll_Image_Animation/blob/main/animateImageByScroll.js)

```javascript
function animateImages(allImageNumber, startImageIndex, pixelChange, renderFunction)
```
### animateImages:
* allImageNumber: number of all pictures
* startImageIndex: the initial numbering of the images (now it's 10. m-10.png)
* pixelChange:  animation speed.
* renderFunction: this function will get the actual image number and it will render to the screen

```javascript
function renderImage(ImageNumber)
```
Portlet
Tags: uyumsoft
Published: 2022-07-22 13:01:00

> CoCode Where şartı
`
Portlet de Seçili olan firmaya göre nasıl parametre verebiliriz. 
`

`select M.CO_ID,C.CO_CODE,M.DOC_NO from PSMT_INVOICE_M M
left join GNLD_COMPANY C ON C.CO_ID=M.CO_ID
Where rownum<30 AND C.co_code='{!SessionInfo.CoCode!}'
`
My Cloud Resume Challenge experience on Google Cloud - GCP
Tags: cloud, devops, gcp, cloudresumechallenge
Published: 2022-07-22 12:38:46

A few weeks ago, I came across the cloud resume challenge which piqued my interest and I decided to partake in it. The challenge was initiated by Forrest Brazeal and offers junior/early cloud career professionals as well as beginners an avenue to showcase their resume as a website built on their preferred major cloud provider using the requisite cloud products. The architectural diagram of my solution is depicted here 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kj2pmi3d638njkaypaq1.png)

The first task in the challenge came with a requirement to have get at least the introductory Google Cloud Digital Leader certification. I had originally started learning cloud technologies in 2020 and got the GCP Associate Cloud Engineer Certification a year ago. With this under my belt, I had met the entry requirements and felt confident in my skills so I got to building. 

For the front end, the resume was meant to be designed using HTML and CSS. While I consider my HTML and CSS skills to be decent and above average, I opted to download a template off the internet which I then customized. 

Hosting the static website required that I create a Google Cloud Storage bucket and set the necessary permissions to enable object access from all users. 

For security, the Load balancer was used to configure HTTPS, with the bucket created earlier serving as the backend bucket. Cloud CDN was enabled to cache the website. My domain was purchased from an independent vendor, which means I had to log on to the domain name provider's platform to point the load balancer endpoint to my domain name. 

Having not used Cloud Firestore before now, I had to go read up on the documentation and found it quite easy to set up using Python.  The javascript code for the website counter communicated with Firestore using Cloud Functions based on HTTP triggers. Every time the website was visited, a HTTP event would fire, causing the cloud function to retrieve the current visitor count from Datastore, increment and return the updated value to the site visitor.

Cloud Deployment Manager which is native to Google Cloud was used to automate the infrastructure deployment for this project. For version control, I used Github and created two different repos - one for the front end and another for the backend. Cloud build was used to set up continuous deployment triggers for the website and the infrastructure after any code updates.

This challenge was a great learning experience for me and I feel really glad that I took part in it. Now that it is over I would be moving on to attempt it on Microsoft Azure. I have been studying for the Azure Solutions Architect Expert cert and would attempt this again when I feel ready to take the exam
Killer JavaScript One Liners
Tags: javascript, webdev, productivity, programming
Published: 2022-07-22 12:37:53

[Some useful JavaScript One-Liners](https://dev.to/shshank/some-useful-javascript-one-liners-4eoe)

After a good response from the community, I decided to post some few more JavaScript one liners, that might help you a lot. I have posted a link to my previous article of [Some useful JavaScript One Liners] (https://dev.to/shshank/some-useful-javascript-one-liners-4eoe) 

## Clear All Cookies
```js
const clearCookies = document.cookie.split(';').forEach((cookie) => (document.cookie = cookie.replace(/^ +/, '').replace(/=.*/, `=;expires=${new Date(0).toUTCString()};path=/`)));
```

## Reverse a String
You can reverse a string in one line using split, join and reverse methods.

```js
const strReverse = str => str.split('').reverse().join('');
strReverse('Shshank');
// knahshS
```

## Generate a Random Hex
This method generates a random hex code using `Math.random()` and `padEnd()`.

```js
const hexClr = () => '#' + Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, '0');
console.log(hexClr());
```

## Capitalise a String
Javascript doesn't have an inbuilt capitalise function, so we can use the following code of the purpose.

```js
let str = 'follow Shshank for amazing posts';
let capStr = str.replace(/\w\S*/g, (w) => (w.replace(/^\w/, (c) => c.toUpperCase())));
console.log(capStr);
```

## Copy to Clipboard
Easily copy any text to clipboard using `navigator.clipboard.writeText`.
```js
const copy = (text) => navigator.clipboard.writeText(text);
copy('Shshank');
```

Hope you like this post. If you find this post useful, please like and share with fellow developers. Follow me for more such posts.

Thank you.
5 cool vs code extensions for web developers
Tags: webdev, vscode
Published: 2022-07-22 12:25:02

Hi all, today is this blog I am going to show 5 vs code extensions which I use that boosts my productivity.

## 1. Inline Fold

If you have been using Tailwind css(which you definitely should) then you might want to hide the styles you have applied once you are done with the styling. Using this extension the classNames collapses to three dots and help us focus more on the code.

before
![before](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lq8wmtfyvwq0fh69r5kb.png)

after
![after](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1btxlcwqlpbn4zvuvtq7.png)

[Inline Fold]('https://marketplace.visualstudio.com/items?itemName=moalamri.inline-fold')

## 2. Tailwind CSS IntelliSense

The second extension is also on Tailwind CSS 😛 . As it is clear from the name, this extension provides auto-complete suggestions for Tailwind CSS. I can't emphasis how slick it makes writing CSS. See below for yourself.

![auto complete in tailwind](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ezhriui5tymwomv52ptx.png)

[Tailwind CSS IntelliSense]('https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss')

## 3. Peacock

Peacock gives different colors to different instances of Vs code. This helps in quick identification of which project we are currently working on

![peacock](https://raw.githubusercontent.com/johnpapa/vscode-peacock/main/resources/hero.png)

[Peacock]('https://marketplace.visualstudio.com/items?itemName=johnpapa.vscode-peacock')  

## 4. Rainbow Brackets

Rainbow Brackets gives different colors of nested brackets in Vs code, by which you can distinguish easily closing and opening of the brackets it can be **parenthesis**, **square bracket**, **curly bracket**  .
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cryze8sxtp2nsqa40xq4.png)

[Rainbow Brackets]('https://marketplace.visualstudio.com/items?itemName=2gua.rainbow-brackets')

## 5. CodeSnap

When you have writing a blog or make documentation of your projects and want to give your code with cool looking then this extension is best for you. You can easily install this extension on Vs code then three steps you have to follow.

- Select the code you want to take snap.
- Right click, choose CodeSnap📸.
- After you get an snap of your code, click the image and press the copy keyboard shortcut (defaults are Ctrl+C on Windows and Linux, Cmd+C on OS X)

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

[CodeSnap📸]('https://marketplace.visualstudio.com/items?itemName=adpyke.codesnap')
Recreate mysql database from frm files and idb
Tags: mysql, mariadb, devops
Published: 2022-07-22 12:20:00

Recently, I made a huge mistake on my server and ended up with a failed install and no backups.
I basically had plesk with several wordpress sites and by chance, I still had access to my data, even though it was not useable anymore.

So here is how I did to recover my files and be able to get back a .sql file with structure and data.

## First, retrieve data

So all my mysql data is lying on my server in `/var/lib/mysql` and it's organized in
- `ibdata1` (one important file to keep)
- one folder per database name
- inside each of this folder, `.frm` and `.idb` files

So let's rappatriate everything on my computer using `scp`

```
mkdir mysql
scp -r root@<ip>:/var/lib/mysql/* .
```

## Then, retrieve mysql version

In order to be able to recreate the databases, we need to use the same version of mysql/mariadb

For this, launch `cat /var/lib/mysql/mysql_upgrade_info` on the server.

I got something like `10.1.48-MariaDB`.

## Launch mysql/mariadb on local

As we know the exact version we need, we will now use `docker` to launch a mysql server of exactly this version.
So on your local, run:

```
docker pull mariadb:10.1.48
docker run -p 127.0.0.1:3307:3306 --name mariadbtest -e MYSQL_ROOT_PASSWORD=Password123! -d mariadb:10.1.48
```

For this, we launch docker on port 3307 just in case another mysql server is already running.

Now, we can login to the database by using our favorite mySQL explorer, for me, it's [Sequel Pro](https://www.sequelpro.com/)

You can connect to the database using 
- Host: 127.0.0.1
- username: root
- password: Password123!
- port: 3307

🎉 you got now the same version of mysql you used to have on your server.

## Copy your old databases to the docker machine

So now, let's move each database inside docker to be able to access it:

```
docker cp dbname/ mariadbtest:/var/lib/mysql
```

`dbname` begin the folder holding the `.frm` and `.idb` files.

From there, if you refresh your databases in Sequel Pro, you should see your database but an error occurs when you try to open any table.

`Table 'dbname.mod844_icl_string_status' doesn't exist` for example

## Fix errors

In order to fix this, you need to copy the previous file we backed up:

```
docker cp ibdata1 mariadbtest:/var/lib/mysql
```

After that, restart your docker machine and you should be able to access your data using Sequel Pro.

## Export your data

Now you can safely export your data into a `.sql` file and think about always setting up a backup system from now on!

## Cheers

My name is Martin Ratinaud and I am a full stack developer

I run a [staking crypto comparator](https://stakingcrypto.io) to help you find the best rates for any crypto.

And as a remote worker since 2016, I also want you to discover [your sweet spot](https://remote-family.com) based on your hobbies, so that you can expatriate and live your best life.
Insights from the State of InnerSource 2021
Tags: opensource, programming, productivity, computerscience
Published: 2022-07-22 11:13:28

The [InnerSource Commons](https://innersourcecommons.org/fr/) is the world’s largest community of InnerSource practitioners. Founded in 2015, its goal is to create and share knowledge about InnerSource: the use of open source best practices for software development within the confines of an organization. In a previous post, we discussed [InnerSource](https://packmind.com/innersource-understand-in-5-minutes/) and its benefits. 

To get current trends on InnerSource, the community ran a survey in early 2022 and reached 125 respondents. You can find the full report [here](https://innersourcecommons.org/learn/research/state-of-innersource-survey-2021/). It brings meaningful data that won’t be fully covered in this post, as the report itself is accessible and complete. This post covers some key insights from the report. 

### #1 Knowledge sharing and removing silos are the **top motivations** for adopting InnerSource.

![Source: InnerSource Commons State of InnerSource 2021](https://promyze.com/wp-content/uploads/Untitled.png)



Improving developers’ productivity and code quality also stand as motivations. Companies often lack perceptions of the impact and benefits of knowledge sharing, and those answers support the idea that a direct relationship between knowledge sharing and **software quality** makes sense. 

### #2 InnerSource, through knowledge sharing, has social benefits

![Untitled](https://promyze.com/wp-content/uploads/Untitled-1.png)

In addition to boosting learning and improving code quality, InnerSource fosters **social interactions** between developers and creates opportunities to talk to each other. This is a non-negligible impact on people’s wellness in the organization and prevents [turnover](https://packmind.com/technical-knowledge-loss-it-turnover/) risks.

### #3 InnerSource breaks silos and supports innovation

That’s what respondents reported from the measurable progress. Not all respondents have defined a methodology to measure progress, so in most cases, it remains quantitative. 

![Untitled](https://promyze.com/wp-content/uploads/Untitled-2.png)

### #4 InnerSource is still in progress

 

![Untitled](https://promyze.com/wp-content/uploads/Untitled-3.png)

Only 38,9 % claim to be actively implementing an InnerSource program, and the majority have either an unofficial, “to be started” or “under study” program. To give a comparison, the latest StackOverflow 2022 report claims that 16% of the companies have an InnerSource program. 

We also note that only 22,5% adopted InnerSource for more than five years. So this is still a movement in progress in IT companies. 

![Untitled](https://promyze.com/wp-content/uploads/Untitled-4.png)

At Packmind, as we promote best coding practices reuse, and sharing among developers, we look forward to the following years to get insights into how InnerSource adoption evolves in our industry. If you’re interested in interacting with the community, you can join their public [Slack](https://innersourcecommons-inviter.herokuapp.com/).