teleren/devto huggingface dataset:
State of the WebAssembly 2022
Tags: webassembly, webdev, serverless, javascript
Published: 2022-06-20 19:37:57

[The State of the WebAssembly 2022 is out 🎉](https://blog.scottlogic.com/2022/06/20/state-of-wasm-2022.html)

# Languages in the WASM world

Unsurprisingly Rust Language dominates the most used and most wanted to use language. I am also super excited to see Blazor adoption is increasing!

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

JavaScript surprisingly is the second highly used language. As the report mentions "there is an increasing usecase where they compile the JavaScript engine itself into WASM and execute on it". 

{% tweet 1535304420426141696 %}

# Usage 

Web Applications is still the number 1 use case for WebAssembly but it is on the decline. I believe it is because, folks started to realise that WebAssembly is not a silver bullet for performance. It supports only some use cases

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


Super fascinated to see WASM dominating serverless  + Cloud world! Docker replacement coming soon... 


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

# Runtime & Features

As expected wasmerio wasmtime dominates the runtime. If you haven't tried them, then give them a shot :) 

> My getting started post on [wasmtime](https://sendilkumarn.com/blog/wasi-with-wasmtime). 


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


What next to SIMD? The threads proposal is the top feature requested by the community in the web world. On the server side I/O operations lead the list.

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

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

WebAssembly needs proper debugging & building support and enable non-browser APIs in the future. This is interesting as the first two will give enormous Developer Experience while the latter focus on the server side Wasm

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

---

If you want to get started on the WASM with Rust - checkout my Dev.to series 

{% embed https://dev.to/sendilkumarn/rust-and-webassembly-for-masses-introduction-1034 %}
What is the best way to enter in Backend?
Tags: webdev, discuss, javascript, programming
Published: 2022-06-20 19:36:59

I'm currently a frontend developer and I'm slowly moving into making bigger projects using nextjs and typescript. I want to dabble into backend and become a fullstack js/ts dev but since there are Prisma/Supabase/Firebase, is there really any point in learning things like express/django? Does anyone have any pointers in having a great transition to being a fullstack? I've heard using [tRPC](https://trpc.io/) is the best place to start.

P.S: sorry for the lack of blog posts; I've been really busy with school and traveling but I'm somewhat back. School is still a bit hectic but I'm working on TDD post that has great visuals so you can really understand it in almost all regards.
DxDD - developer experience driven development
Tags: opensource, design, typescript, javascript
Published: 2022-06-20 19:21:16

Basically all OSS libraries are built by developers for developers and developers tend to think solution first while I always advocate to think API first. Let me explain.

By solution first I mean designing APIs of the library to an implementation. You wrap interface around working core which is a fundamental flaw. You lose an opportunity to make it the best version of itself, you lose freedom of thought, you are now bounded by a solution core you've already made. Sometimes it might work, but most of the time it's not.

I've noticed that phenomena when we were building chatbots. When you give developer Telegram Bot API and business demands - they usually produce a bot that works like a terminal application. Same for the clients when they used Google Sheets for business demands.
When I asked developer to use ChatFuel interface to build a chat flow for a bot immediately I got an output of a humanised version of a conversation with stickers, photos and GIFs. That led me to an idea of building chat bot design tool, hopefully we'll build someday, but this is another story.

The API first design is when you have all the freedom, you play around and fantasise on what would be the most useful and clean and compact and explicit API of the library and then and only then you try to design solution based on the API design. And do your best to fit, weigh compromises. Treat your library as a product and developers who gonna use it as customers.

Thanks!
Introduction to Data Structures and Algorithms
Tags: python, algorithms
Published: 2022-06-20 19:20:34

* **Data Structures** 
Denotes a certain way of organizing, storing and managing data flow to increase efficiency (with **respect** to time and **memory**) of a program in a computer.

* **Algorithms** 
A set of instructions to be executed in a certain way 
to get the desired output.

## Classification of Data Structures
1. **Primitive Data Structures:** these are numbers and characters built in a program meaning they can be manipulated by machine level instructions. Ex. *integers, characters, Booleans..* 

2. **Non-Primitive Data Structures:** they are derived from primitive data structures thus can not be manipulated by machine level instructions. They form a set of data elements either in homogenous(same data types) or heterogenous(different data types).

Next,
Non-Primitive Data Structures are further divided into:

* **Linear data structures**

> Elements in a linear data structure maintain a linear relationship among them and although data is arranged in a linear form, arrangement in memory may not be a sequential.

Ex. _Arrays,_
* **Non-Linear data structures**

> This kind of data structure data elements form a hierarchical relationship among them.

Ex. _Trees and graphs_  

            Classification of Data Structure

![Classification of Data Structures](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i4cfzwnvx03p359vqfna.png)
 
### Data Structures can be of two types:

- **Static Data Structures:**

> The size of this type of structure is fixed meaning data elements can be modified without changing the memory space allocated to it.

e.g. _Arrays_

- **Dynamic Data Structures:**

> This data structure allows changing the size of the memory allocated and contents of the structure can be modified during the operations performed to it or at runtime. e.g. _Linked Lists_

**Comparison between Static vs Dynamic Data Structures**

| Static Data Structures   | Dynamic Data Structures |  
|------------|----------| 
| Fixed memory size      | size can be randomly updated during run time     | 
| Memory allocation done prior to program execution      | Memory allocation done during program execution    | 
|Overflow is not possible to occur since memory allocation is fixed     | Has possibilities Overflow or underflow since memory allocation is dynamic    |
Introduction to Data Structures and Algorithms.
Tags: beginners, algorithms, datastructures, programming
Published: 2022-06-20 19:05:25

A carpenter has several tools, yet each one has a specific purpose in completing a task. Similar to a programmer, depending on the task at hand, programmers will require the appropriate tool to handle a certain challenge.
Data structures are programmers' tools, and each one serves a specific purpose. Many companies uses data structures challenges in their interviews to see if a programmer is a strong problem solver.
Data structures are classified into two major sections:
    1. Linear Data structures → stores data in a sequential manner.
    2. Non-linear Data Structure → stores data in a  non- sequential manner.

Types of Linear data structures:

    1) Arrays → stores values in arranged continuous memory. Elements stored in the arrays are determined by the programming language.
    2) Stack →  It stores its elements according to the LIFO (last in, first out) principle, which means that the last element added is the first one withdrawn.
    3) Queues → It stores its elements using the FIFO (first in, first out) principle, which means that the first element inserted will be the first one withdrawn
    4) LinkedList → It organizes its data as a connected network of nodes, with each element containing the address of the next node.

Types of  Non-Linear data structures:

    1) Graphs → it’s made up of nodes or vertices and edges. Edges connects two nodes.
    2) Trees → stores data in a hierarchical manner which is tree-like structures arranged in multiple levels. It has the root node(top most part) which is the central node. 

Algorithms
Is a set of instructions or procedure for solving a specific problem, you can think of it as a recipe to solve a problem or as a blueprint for solving a problem to make it easier to grasp.
Types of Algorithms:
    1) Sort algorithms
    2) Search algorithms
    3) Hashing

Each written algorithm uses some memory to complete. This is where algorithm complexity comes into play; it calculates the amount of time and space required to execute an algorithm.
Space complexity → The overall amount of space taken up by the algorithm in relation to the input size.
Time complexity → is the amount of time algorithms takes to run. It is mostly expressed using the big O notation(asymptotic notation to represent time complexity). For example,a problem of size n:
    1. O(1) is a constant-time function
    2. O(n) is a linear-time function
    3. O(n^2) is a quadratic-time function
The 21 Most Popular Coding Challenge Websites
Tags: beginners, programming, discuss, productivity
Published: 2022-06-20 19:05:05

If you are a programmer, then solving problems using programming languages is something you should do for yourself. Programmers need to deal with all sorts of problems almost every day.

However, there are a lot of websites nowadays where you can solve problems using your favorite programming languages. Some of them are for free but some of them cost money. 

Moreover, people often get confused about where they should start their problem-solving journey. Based on the preferences and the efficiency level, there are some specific websites for each preference. 

So, after analyzing a lot, I have gathered the 21 most popular coding challenge websites, which might help you in the long run, whether you are e beginner or a professional in your field of work.


## Contents 📦

1. [beecrowd](https://www.beecrowd.com.br/judge/en/login)
2. [HackerRank](hackerrank.com)
3. [Codeforces](https://codeforces.com/)
4. [LeetCode](https://leetcode.com/)
5. [Kaggle](https://www.kaggle.com/)
6. [CodeChef](https://www.codechef.com/)
7. [AtCoder](https://atcoder.jp/)
8. [Topcoder](https://www.topcoder.com/)
9. [Coderbyte](https://coderbyte.com/)
10. [Project Euler](https://projecteuler.net/)
11. [Codewars](https://www.codewars.com/)
12. [SPOJ](https://www.spoj.com/)
13. [CodinGame](https://www.codingame.com/)
14. [GeeksforGeeks](https://www.geeksforgeeks.org/)
15. [Toph](https://toph.co/)
16. [LightOJ](https://lightoj.com/)
17. [Exercism](https://exercism.org/)
18. [Online Judge](https://onlinejudge.org/)
19. [HackerEarth](https://www.hackerearth.com/)
20. [Code Jam - Google's Coding Competitions](https://codingcompetitions.withgoogle.com/codejam)
21. [ICPC](https://icpc.global/)



## You can watch this complete video on YouTube as well if you like 🎥

{% embed https://youtu.be/45wrQ-RAefI %}

## I have also written complete guidelines on freeCodeCamp which will help you getting a nice overview on all of the websites. 

{% embed https://www.freecodecamp.org/news/the-most-popular-coding-challenge-websites/ %}

Thanks for reading till now. 😀

If you want to follow me, 

⭐ [GitHub/FahimFBA](https://github.com/FahimFBA) 
⭐ [LinkedIn/fahimfba](https://www.linkedin.com/in/fahimfba/)
⭐ [YouTube Channel](https://www.youtube.com/channel/UCG97GCUifMS2Vm28tgXQi0Q)
⭐ [Twitter/Fahim_FBA](https://twitter.com/Fahim_FBA)
SSH-BM, An SSH bookmarking program
Tags: javascript, cli, ssh
Published: 2022-06-20 19:02:11

---
title: SSH-BM, An SSH bookmarking program
published: true
description: A quick rundown of my SSH bookmarking tool
tags: deno, javascript, cli, ssh
cover_image: https://pbs.twimg.com/media/FVnvsW9WIAEUBN-?format=jpg&name=large
# Use a ratio of 100:42 for best results.
---

Welcome to my latest goofy project: ssh-bm.
https://github.com/IamFlowZ/ssh-bm

If you've ever been on the ops side of things, more than likely you've had to remember more than a couple domain/ip + user combos for logging into various machines.

My usual go-to in the past for cataloging those combos has either been a spread sheet, or a series of bash functions. Neither of which is particularly maintainable.

So with the hope of removing some of the overhead, I developed this tool. ssh-bm which aims to declutter the process of logging into various machines.

ssh-bm serves as a key-value store for ssh connection strings. You hand it the name you want to use along with your normal arguments to ssh. Then when you give ssh-bm that name, it will automatically pass those arguments to ssh and send you on your way.

---
Find me on [Twitter](https://twitter.com/therealdakotal) | [LinkedIn](https://www.linkedin.com/in/dakota-lewallen/)

Sponsor me on [Github](https://github.com/iamflowz)
XPath vs CSS Selector: what is going on with these two?
Tags: scraping, xpath
Published: 2022-06-20 18:40:37

As I was learning scraping I have done many tutorials on it. Some tutorials used XPath and others used god ol' CSS Selectors. Until today I always resorted to CSS because it was a familiar choice. All I new about XPath is that Scrapy uses it by default and any CSS selectors are converted to XPath behind the scenes. Being a complete noob at the time I did not give it much thought. Alas, the time has come for me to sink my teeth into this topic and understand what is the difference between these two types of selectors.

&nbsp;

# XPath

&nbsp;

### What it is
XPath stands for XML Path. It uses XML document and queries it to identify elements within it. The path part of XPath means that we need to specify the path from the beginning to the desired element.

&nbsp;

### Advantages of XPath
- Allows navigation up the DOM when looking for elements
- More flexible than CSS Selectors
- Allows searching for full or partial text in element names with `contains` keyword

&nbsp;

# CSS Selector

&nbsp;

### What it is
CSS Selector uses styles specified in Cascading Style Sheet (CSS) to select desired elements. Most of the web pages online are styled using CSS and that makes CSS Selector a popular choice for a lot of people.

CSS relies on tags, class names, and ids among other things to select what we want. This is in contrast with XPath which uses tree-like structure to select the element.

&nbsp;

### Advantages of CSS Selector
- Simplicity because CSS is easy to pick up 
- Faster than XPath because we can specify the exact element and completely disregard everything else on the page
- Allows attribute selection based on values assigned to them
- Allows pseudo selectors for elements whose state is declared with CSS, such as on-hover attributes and checkboxes

&nbsp;
# Syntax for XPath and CSS Selector
This a great table that shows the differences between XPath and CSS Selector made by [Slotix](https://gist.github.com/slotix/11f0930b2d46d2946249a10e6216735b#file-css3vsxpath-csv) :
![xpath-vs-css-selector](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a6iz0mfocerlnregrbwg.png)
How to Trim Videos Using Python and FFMPEG
Tags: python, tutorial, beginners, programming
Published: 2022-06-20 18:46:19

In this exciting tutorial we are going to learn how to trim a video using Python and FFMPEG.

I will guide you through setting up the python project in VSCode. I assume you have Python 3 and Pipenv installed.  Using the FFMPEG-Python package we will trim a video.  

I will show you how to install the FFMPEG command line tool on Mac and Windows.

Let's jump into the video:

{% embed https://youtu.be/SGsJc1K5xj8 %}
Day 21 - 30
Tags: react, javascript, 100daysofcode, webdev
Published: 2022-06-20 18:26:45

## Day 11: React Router
Today I read the react router docs. I learnt that it's a library for server-side routing. I did the Quick Start tutorial and understood some concepts. I will be doing some projects with react router in the coming week and explain more of what I have learnt.

---
Your views on: Tailwind CSS vs Bootstrap
Tags: discuss, help, productivity, webdev
Published: 2022-06-20 18:23:19

🤝🌍Catch me on : [GitHub](https://github.com/deepakydv9315) || [Codepen](https://codepen.io/deepakydv9315) || [Instagram](https://www.instagram.com/syco_coders/)

Everyone is confused between Bootstrap and Tailwind CSS, me too 🙂🙂.

## **let's Decide together in Comment section ✍️👇**
Flutter Performance Tip
Tags: flutter, performance, vscode, dart
Published: 2022-06-20 17:55:26

In Flutter 💙, always try to use the** Listview.builder **instead of **Listview.**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7iwwi8vra71oyffy8bpq.jpg)

Because** Listview** renders all the list items at once even if they are not visible to the user.

On the other hand,** Listview.builder** renders only those list items which are visible to the user and renders them when needed.
7 Ways To Use Email To Boost Organic Traffic
Tags: digital, marketing, webdev, tutorial
Published: 2022-06-20 17:51:06

Email marketing can do more than help you find and engage with new customers. It can also improve your search engine rankings.

For digital marketers, this means primarily one thing: directing recipients to a website, either for more information, to make a purchase, or to perform some other action.

## 1. Target With Accuracy
Bounce rate – it’s a dirty word in online marketing.

## 2. Understand User Intent
There are three main types of user intent and email marketing can be used for all of them:

Navigational – in which a user is trying to get to a certain site, in which case, congratulations, job done.

Informational – where a user is looking for information.

Transactional – when a user is prepared to buy or take another online action.

> Connct with [whatsapp](https://wa.me/+919033863013)

## 3. Use Newsletters With Exclusive Content
Once you know what your target audience is looking for, you can create content to address it.

## 4. Integrate Email And Social Media
On their own, both email and social media marketing are useful tools. But when combined, the effectiveness of both grow exponentially.

## 5. Personalize Your Email Content
As a marketer, you probably already know: that personalized emails have better open rates and click-throughs – and that’s just when they use the recipient’s name.

## 6. Conduct A/B Testing With SEO Keywords
We touched on this briefly in number two, but it bears repeating; your email campaigns should be using A/B testing, just like your landing pages and other content.

## 7. Ask For Reviews
After all, 98% of consumers read reviews. People tend to trust online reviews as much as personal recommendations.

>_** Connct with [whatsapp](https://wa.me/+919033863013)**_
YouTube SEO Tools to Boost Your Video's Search Rankings
Tags: tutorial, youtube, career, seo
Published: 2022-06-20 17:40:14

Optimizing your video content is critical for ranking in search, so that the audience can find you on YouTube. Fortunately, we are presenting you those awesome tools to optimize your YouTube videos and content.

Here are those top 5 tools that most of the successful YouTubers use. Article is originated from [this post](https://blog.webmatrices.com/web-stories/5-youtube-seo-tools-to-boost-your-video-rankings/).

![YouTube SEO Tools](https://miro.medium.com/max/552/1*wZiye1VvLg0m_BrpBuhxSw.png)

## [YOUTUBE TAG GENERATOR](https://apps.webmatrices.com/platforms/youtube-tag-generator)


A successful YouTuber uses a combination of keywords and relevant tags to make their videos stand out from the crowd.

And, this free tool helps you to find and get the perfect keywords and tags for your YouTube videos.

## [GOOGLE KEYWORD PLANNER](https://ads.google.com/aw/keywordplanner/home)


Google offers tons of free tools that creators can use to find just the right keywords to include in their content.

This is a great tool. You can access this tool from your Google Ads dashboard. You don't have to run ads to use it, it's free.

## [YOUTUBE RANK TRACK](https://ytrank.net/?utm_source=webmatrices%20forum&utm_medium=linkedin-webmatrices&utm_campaign=webmatrices.com)


The Youtube Rank Checker is an effective web-based/online tool that, as the name says, instantly allows you to check your video rank for specific keyword(s) on Youtube.

You should keep track of your videos rank to understand the audience hook and optimize it well.

## [ANSWERTHEPUBLIC](https://answerthepublic.com/?utm_source=webmatrices%20forum&utm_medium=linkedin-webmatrices&utm_campaign=webmatrices.com)


AnswerThePublic is another handy solution for keyword research.

This beautifully designed online tool allows you to research the most common questions associated with your keywords.

## [RELATED KEYWORD GENERATOR](https://apps.webmatrices.com/generator/related-keyword-generator)

The Related Keyword Generator tool helps you to get similar search terms, related keywords and suggestions to quickly increase the search engine visibility of your YouTube channel or video.

What you have to do is mention those related keyword in your YouTube video description and create some awesome content.

Thanks for reading. Have a great time YouTube-ing!
Data Structures 101: Introduction to Data Structures and Algorithms.
Tags: dsa, algorithms, software, programming
Published: 2022-06-20 17:27:34

## What is Data Structure?
A data structure is a named location that can be used to store and organise data. And, an algorithm is a collection of steps to solve a particular problem.

Learning data structures and algorithms allow us to write efficient and optimised computer programs.

## What is an Algorithm?
An algorithm is a set of well-defined instructions to solve a particular problem. It takes a set of inputs and produces the desired output. 
**For example;**
An algorithm to add two numbers:
Take two number inputs
Add numbers using the + operator
Display the result 

## Qualities of Good Algorithms

1. Input and output should be defined precisely.
2. Each step in the algorithm should be unambiguous.
3. Algorithms should be the most effective among many different ways to solve a problem.
4. An algorithm shouldn't include computer code. Instead, the algorithm should be written in such a way that it can be used in different programming languages.

Data structure helps us understand the working of each data structure. And, based on that you can select the right data structures for your project.