teleren/devto huggingface dataset:
My Top 5 Full-stack Frameworks for 2022
Tags: programming, webdev, nextjs, javascript
Published: 2021-12-31 17:25:41

## 5. Express
Express.js is a framework of Node.js which means that most of the code is already written for programmers to work with. You can build a single page, multi-page, or hybrid web applications using Express.js. Express.js is lightweight and helps to organize web applications on the server-side into a more organized MVC architecture.

## 4. NestJs
NestJS is a Node.js back-end development framework built upon Express, leveraging the power of TypeScript.

NestJS leverages the incredible popularity and robustness of JavaScript as a language and Node.js as a technology. It is inspired by common libraries and frameworks such as Angular, React and Vue which improve developer productivity and experience.

## 3. Laravel
Laravel is an open-source web MVC framework for PHP.

Laravel is a robust framework that provides easy development of PHP web applications with features like a modular packaging system with a dedicated dependency manager, access to relational databases, and other utilities for application deployment and maintenance.

## 2. Django
Django is an open-source framework for backend web applications based on Python — one of the top web development languages. Its main goals are simplicity, flexibility, reliability, and scalability.

## 1. Next.js
Next.js is now one of the most popular Fullstack React frameworks for building superfast, and super SEO-friendly Jamstack websites.

## Some Honourable Mentions


## Phoenix Framework
Phoenix is the leading web framework in the Elixir ecosystem. It’s perfect for productively building scalable and reliable web experiences.

Phoenix is similar to other big Model-View-Controller (MVC) web frameworks like Rails and Django. It provides a large part of what you need for a web application out of the box, but it is a bit less “batteries-included”.

## Fastify
Fastify is an open-source Node.js web framework that remains focused on providing excellent developer experience, minimal performance overhead, and a flexible plugin architecture.

Fastify's development efforts are focused on six main features and principles. First, as its name suggests, Fastify is focused on speed, and can currently serve up to 30,000 requests per second.


## Ruby on Rails
Ruby on Rails (or Rails) is a web development framework that gives Rails developers a time saving method for writing code. Rails is one of many web frameworks in the world of app programming and web development.

## That's it, Happy New Year 2022.
If you like it, Please share it with your friends and family and wish them New year.
Three things for 12/31
Tags: devjournal, linux
Published: 2021-12-31 17:19:23

Three things from this week:

1. `/etc/.skel` has files related to `.bash_logout` and `.bashrc` which are created for new users - I needed to remove the `.bash_logout` file for the issues with clearing screen that caused problems with the Gitlab runner and this seemed like the best way to do it.
2. Slack is actually an acronym that stands for `Searchable Log of All Conversation and Knowledge` useless, but fun :)
3. All about [BuildKit](https://docs.docker.com/develop/develop-images/build_enhancements/) in Docker - a simple environment variable `DOCKER_BUILDKIT=1` enables performance improvements.

See you party people next week!!
🎬How To Create Website With Auto Typing Text Effect Using HTML CSS JavaScript🙌
Tags: html, css, beginners, javascript
Published: 2021-12-31 16:54:01

Lets Create a Website With Auto Typing Text Effect Using HTML CSS JavaScript, step-by-step in a very easy to follow along tutorial.

***
{% youtube BE5ebdIAv24%}
***

###Source Code:

**HTML**

```HTML
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Create Website with Auto Typing Text Effect</title>
  <link rel="stylesheet" href="style.css">
</head>

<body>
  <header>
    <nav>
      <img src="img/logo.png" alt="" class="logo">
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Portfolio</a></li>
        <li><a href="#">Services</a></li>
      </ul>
      <img src="img/menu.png" alt="" class="menu-icon">
    </nav>

    <div class="text-box">
      <h1>I'm <span class="auto-input"></span></h1>
      <p>You can reach out to me if you need any nelp in making
        a Website for you or your business.</p>
      <a href="#">Contact me</a>
      <a href="#" class="btn">Download CV</a>
    </div>
    <img src="img/bg7.png" alt="" class="user-img">
  </header>

  <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.12"></script>

  <script>
    let typed = new Typed(".auto-input", {
      strings: ["Emma Downy", "Web Developer", "Blogger"],
      typeSpeed: 100,
      backSpeed: 100,
      loop: true
    })
  </script>

</body></html>

```
Top 3 Free Docusign Alternatives To Use in 2022
Tags: security, tutorial
Published: 2021-12-31 16:47:03

We are not addicted to having heaps of gratuitous contracts for every single thing, and it’s not a commodity I use veritably frequently in my own customer connections. Still, there are times and circumstances when you need inked documents that are fairly- binding to cover you and your business.

These tools come in handy for getting those documents inked duly and securely when your customer isn’t original to you. They all do principally the same job, allowing you to collect autographs in a secure setting and nearly file it down for keeping.

## 3 Top Free Docusign Alternative with Affordable Upgrades Available

We need to use it veritably frequently in our own customer connections. Still, there are times and circumstances when you need inked documents that are fairly- binding to cover you and your business.

These e-Sign tools explained in detail by [Attrock](https://attrock.com/blog/docusign-alternatives/) come in handy for getting those documents inked duly and securely when your customer isn’t original to you. They all do principally the same job, allow you to collect autographs in a secure setting and nearly file it down for keeping.

**1SkySignature**

Pricing Free unlimited autographs and document storehouse up to 10 documents. Upgrade to document storehouse capacity for$ 1/ month or$ 10/ time.

Includes‘ type anywhere’ tool so that you can class right on PDF documents, fill out forms and complete fields presto. Draw custom hand or upload image you have saved and ready to go.

Mobile accessible and easy to use.‘ Subscribe then’ markers show where to subscribe and help the experience feel more like the paper interpretation, but without all the hassle of paper shuffling, cement timber, and tree payoff.

**HelloSign**

Pricing Free account up to 3 documents per month.$ 13/ month unlimited documents for single stoner or$ 40/ month for a platoon ( paid annually).

Integrates with Google Apps, Google Drive, Box, Slack, DropBox, Evernote, and other systems. Mobile options that are easy to use.

Allows mass autographs for group contracts, indeed up to 1000’s of signers at formerly. Templates and redundant features are available with upgraded plans.

**Wondershare eSign**

Pricing Free position up to five sends.$6.99/ month decoration position.

The hand can be done in one of three ways; draw it, class it in, or upload apre-made hand.
Premium position includes unlimited transferring and custom branding options.

I hope this has helped you save some plutocrats on your yearly business charges while still keeping the paperwork you need in order.

## Benefits of Docusign Alternatives
You can enable protection to your all [convert word to google docs](https://wordable.io/convert-word-to-google-doc/) to secure your important content in this high riskable online world at reasonable cost.

You can choose any other tool as per your requirement and secure your online doc transferring.

Do you know of another e-signature tool that wasn’t mentioned over?

Don’t Worry comment below the post, happy to assist you.
How to create an section HTML and CSS!
Tags: css, html, webdev, tutorial
Published: 2021-12-31 16:44:00

Hi, Welcome To tutorial called "How to create an section with html and css" 

First we need to create an section in html and link the css file or you can just <style></style> tags in html


```
<style>

we put the code css in case if we don't want to link the css file!

</style>

<!--Creating section in html and creating an class which will help us to specify it  in css --!>

<section id="chooseyournameforid">
<h1>A very cool Heading!</h1>
<p>A very cool paragraph!</p>
</section>

<link rel="stylesheet" href="yourstyle.css">
```

Now we are Create the css file or the tag style

and we are paste this code!

```
#yournameid {
    background-color: !color you want!;
    width: 100%;
    height:70%; !here we can change our height and width based on text and more!
    position: absolute;  !here we can change position in case if you want but don't change to fixed because the section will come every tiem you scroll down on page!
    left:0px; you can as well on right position too!
    top: 100%; !here we put how far we want to be the bottom when we scroll down!
    color: black; !color for texts!
}
```

And after this,  you should have your new section made by yourself!

Here should look our new section:

https://codepen.io/mihaidev-cloud/pen/xxXWVrK
List all the files containing a phrase | ag, rg
Tags: vim, linux, bash
Published: 2021-12-31 16:38:09

---
canonical_url: https://waylonwalker.com/til/list-all-files-containing-phrase/
description: ''
published: true
tags:
- vim
- linux
- bash
series: til
title: List all the files containing a phrase | ag, rg
---

One of the most useful skills you can acquire to make you faster at almost any job that uses a computer is getting good at finding text in your current working diretory and identifying the files that its in.  I often use the silver searcher `ag` or ripgrep `rg` to find files in large directories quickly.  Both have a sane set of defaults that ignore hidden and gitignored files, but getting them to list only the filenames and not the matched was not trivial to me.

> I've searched throught he help/man pages many times looking for these
> flags and they always seem to evade me.

## ag

Passing the flag `-l` to ag will get it to list only the filepath, and not the match. Here I gave it a `--md` as well to only return markdown filetypes.  `ag` supports a number of filetypes in a very similar way.

``` bash
ag nvim --md -l
```

## rg

Giving `rg` the `--files-with-matches` flag will yield you a similar set of results, giving only the filepaths themselves and not the match statement.  Also passing in the `-g "*.md"` will similarly yield only results from markdown files.

``` bash
rg --files-with-matches you -g "*.md"
```

---

This article is part of my til series, an effort to build a short content pipeline that will eventually form larger content pieces.

https://waylonwalker.com/til
La publicidad online de Amazon está cada vez más cerca de Google y Facebook
Published: 2021-12-31 16:31:06

Grupo Antón, una agencia de medios en Murcia expertos en publicidad online en Murcia, se hace eco de la información dada a través del portal web Puro Marketing sobre la importancia de la publicidad online para los gigantes de la comunicación y lo cerca que se encuentra Amazon en cuanto a posicionamiento respecto a Facebook y Google.

El crecimiento de Amazon en el sector publicitario ha sido notable. A medida que introdujeron mensajes publicitarios y que resultaron ser todo un éxito, el interés por posicionarse mejor en cuanto a publicidad fue mayor.

Además, los analistas han estudiado que solo Amazon está a la altura de competir con los gigantes de la comunicación, Facebook y Google, teniendo una maniobra suficiente para impactar en la cuota de mercado.

La pandemia y el confinamiento, en gran parte, motivaron este crecimiento porque la compra online aumentó de manera considerable. 2020 se cerró con grandes resultados y, a partir de ese momento, en el terreno de la publicidad online no se hablaba de duopolio sino tripolio (Amazon, Facebook y Google). Este cerró teniendo el control del mercado publicitario online en un 10,3%, aumentando un 3% respecto al año anterior, obteniendo de ganancias 15.730 millones de dólares.

Respecto al imperio de Zuckerberg y el gigante Google, estos tienen el control del 28,9% y 25% respectivamente. Además, los patrones de consumo están cambiando, por lo que esto variará el cómo se repartirán los presupuestos publicitarios.

Amazon recibe sus ganancias a partir del marketing y la publicidad. El 90% de los ingresos publicitarios le llegan a través de la tienda online y no de otros servicios como Twitch, el cual desean otras empresas conquistar y recuperar.

[Ver mas...](https://diarioalbacete.com/)
5-must visit useful websites for developers..
Tags: html, css, overapi, programming
Published: 2021-12-31 16:30:51

**T**oday I came across some amazing websites🙂 and thought to share it with everyone. Actually, there are many websites all around which we might not be aware of. 
Here are some amazingly-killer websites for developers.😁

So, are you always wondering and searching about roadmaps on google, YouTube and many more.🤔 Then this website is basically for you..
> [roadmap.sh](https://roadmap.sh/)

Roadmap.sh is a storehouse of numerous roadmaps, guidelines and also other educational content which you could easily refer to and choose an appropriate path to achieve your goals. 

(This is a screenshot of the website for reference)

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

Now, if you are learning frontend and getting hands dirty with CSS then you really need some cool css-tricks.🤩

> [CSS-Tricks](https://css-tricks.com/)

We know that CSS is to make our web look beautiful but this website makes working with CSS even more beautiful and amazing. You can get amazing content on this website as it contains videos, guides, books and articles related to the same.😌👇

![css-tricks](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rhx1ry9lhzd558ws07vu.png)

> [SmartMockups](https://smartmockups.com/)

SmartMockups enables you to create high resolution mockups directly inside the browser across multiple devices. It is comparatively quite easy as compared to photoshop and also very user-friendly.
![smartmockups](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z0qu8g57jdyddmezj9oa.png)

> [Profile Pic Maker](https://pfpmaker.com/)

In today's world, profiles pictures have become very important as we do need them all around like on social media - Facebook, Instagram etc. And also sometimes a professional profile photo is also needed. So, this website creates a  profile for a photo and is very user-friendly i.e. easy to use. 

![pf maker](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1ev804azs28fwdlrch5t.png)

Learning any programming language is not that hard as to remember each and every syntax or details of it and hence a reference is required for its quick overview.🤭 If yes, then overAPI is one of the best websites for it.
> [overAPI](https://overapi.com/)

overAPI contains cheatsheet of almost every programming language and technologies.🤩

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

So, this was all about the 5-amazing websites. Hope you liked it!!😇
Setting up SvelteKit with TailwindCSS
Tags: tutorial, webdev, svelte, tailwindcss
Published: 2021-12-31 06:15:06

Hello everyone. This is my first post on the `dev.to` community so I hope you all like it! :D

In this tutorial I will go over the process of setting up SvelteKit with Tailwind CSS.

## Setting up your SvelteKit project
So, to set up a basic SvelteKit project, you can run this command.
```bash
npm init svelte@next tailwind-sveltekit 
```
You can replace `tailwind-sveltekit` with whatever directory name you want, or if you are already in the directory you want to use, you can remove it.

Now you can run
```bash
npm install
```
(or you can use any package manager you like such as `pnpm` or `yarn`)
and
```bash
npm run dev
``` 

## Adding Tailwind
To add TailwindCSS, we will also need to use PostCSS.
So, first, run this command in your terminal.
```bash
npm install -D tailwindcss postcss autoprefixer
```
You will now have Tailwind, PostCSS, and Autoprefixer installed.
After that, run
```bash
npx tailwindcss init -p
```
This will create two files, `tailwind.config.js` and `postcss.config.js` for you.
Now, you need to rename these files. SvelteKit doesn't accept `.js` files so change the file names to `tailwind.config.cjs` and `postcss.config.cjs` instead.
In your `src/` folder of your project, create a folder called `lib` if you haven't already. Inside, create a `tailwind.css` file and add this into the file.
```css
@tailwind base;
@tailwind components;
@tailwind utilities;
```
In your `src/routes/` you can make a `__layout.svelte` file with this inside of it:
```html
<script>
import "$lib/tailwind.css";
</script>
<div class="pt-2">
  <slot />
</div>
```
Now you can `npm run dev` and see it. But you may have noticed something off.
TailwindCSS doesn't know about your Svelte code and so the Just-in-Time engine will only include the base style reset. So in your `tailwind.config.cjs` file you should change it to
```js
module.exports = {
  content: ['./src/**/*.{js,ts,svelte}'],
  theme: {
    extend: {},
  },
  plugins: [],
}

```
The `content` property is what has changed. This lets Tailwind know that your class names are there, so the JIT engine will know what to generate.

## Conclusion
I hope you enjoyed this tutorial. If you have any questions, please let me know. :D
My Journey through 2021
Tags: aws, devops, management, productivity
Published: 2021-12-31 16:05:11

While we are stepping into New Year 2022, wanted to look back and relish the journey in 2021 as a working mother with online class and work from home, Did I get to do something else? 

To my surprise, quite content with 

1. 15 presentations across the globe with a mix of in-person and online
2. Organizing & hosting AWS Community Day and meetups
3. Learning little literature and tech along with kids to publish poetry book, self-hosting website etc 
4. Most importantly mentoring and enabling my team to put up a 3 hour workshop. 

And certainly not challenging myself to set any new record in 2022. 

Let me continue to **Learn, Unlearn and Share** as always.

![2021 Journey](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b82g4o9i48ozbaon67zy.png)

Wish you all a very happy new year 2022!
🤯 How to Get More Stars on GitHub!
Tags: tutorial, discuss, opensource, github
Published: 2021-12-31 16:01:59

I’ve been working on [my open-source backend server](https://github.com/fairfield-programming/backend-server/) for about a week now, and it already has about 12 stars, 9 forks, and nearly 10 outside contributors. That might not sound like a lot, but the project is only a week old and it isn’t a package or anything that can be used by outside people. 

**So, how did I do it?**

The most important thing has been issues. When GitHub was developing issues, they secretly made the most overpowered label that there is, “good first issue”. I can guarantee that if you create a new issue every two hours on your repository that has “good first issue” on it, you will get outside collaborators. 

[Don’t forget to Star the Backend Server](https://github.com/fairfield-programming/backend-server/)

What else can help with your labels? If you use emojis in the title, anyone that sees your issue will be instantly drawn to it because it is more colorful. This will increase the amount of views on your issue, and increase the likelihood of someone to help you with it as well. 

Finally, if you create a todo list in every issue, this tricks the GitHub system into thinking it’s a bigger issue, and it also tricks the websites, like ‘goodfirstissues.com’ into moving it higher in the rankings. 

There will be more tips like this coming tomorrow and the day after, so if you liked hearing this, make sure to follow me, so you can see more tips as they come out.
Just recently created my Chrome Extension! Any tips?
Tags: javascript, programming, productivity, node
Published: 2021-12-31 16:01:13

I just recently published my first Chrome extension, Screensy!

It's a very powerful screen recorder + video editor for Chrome.

The reasons why this is one of the best screen recorders are [listed here](https://docs.google.com/spreadsheets/d/1M1QEM7xXvxi646dx7DbKdro87V05fg2HlaksdARzEIs/edit?usp=sharing)

Feel free to check out the code [here!](https://github.com/allaboutishaan/screensy)

Does anyone have any tips / suggestions? I would appreciate them very much!
CRUD Operations and relational database(mysql)
Published: 2021-12-31 05:51:20

Backend
CRUD Operations:
CRUD stands for create, read, update and delete.
Each letter of CRUD in SQL ;
CRUD
SQL
Create
Insert
Read
Select
Update
Update
Delete
Delete


Each letter of CRUD in HTTP method ;
CRUD
SQL
Create
Put
Read
Get
Update
Put
Delete
Delete


Relational database (MySql)
Relational database is a type of database where data stored and provide access to data point which are related to one another….
If data will store in table then we call it relational database. Each row in table will have unique id and key and columns in table holds attribute of data.
Id
Name
Age
1
Arif
25
2
Fahim
20
3
Sakib
30

Here ,
Id, name and age are attribute.
The row of id is key, We can call it primary key. There are 3 keys, 
The value of name and age are data


JWT:
JSON Web Token(JWT) is a standard.  All JWTs is token but all token is not JWT. Because of its relatively small size, a JWT can be sent through a URL, through a POST parameter, or inside an HTTP header, and it is transmitted quickly. A JWT contains all the required information about an entity to avoid querying a database more than once. The recipient of a JWT also does not need to call a server to validate the token.
Use of JWT:
Authentication: When a user successfully logs in using their credentials, an ID token is returned. According to the OpenID Connect (OIDC) specs, an ID token is always a JWT.
Authorization: Once a user is successfully logged in, an application may request to access routes, services, or resources (e.g., APIs) on behalf of that user. To do so, in every request, it must pass an Access Token, which may be in the form of a JWT. Single Sign-on (SSO) widely uses JWT because of the small overhead of the format, and its ability to easily be used across different domains.
Information Exchange: JWTs are a good way of securely transmitting information between parties because they can be signed, which means you can be sure that the senders are who they say they are. Additionally, the structure of a JWT allows you to verify that the content hasn't been tampered with.