teleren/devto huggingface dataset:
Server Backend Concepts Exploration
Published: 2021-12-26 06:47:24

**Node JS**
JavaScript is a compiled programming language that runs in the browser by Chrome’s V8 engine. If we run JavaScript outside of a browser then it needs a runtime. Node JS is a JavaScript runtime that helps JavaScript to run outside of a browser. It is used for non-blocking and event-driven servers as it has single-threaded or asynchronous nature. It is used for websites and back-end API services.


**CRUD Operations**
In any persistent storage, there are four types of operations that could be happened. They are - create, read, update, and delete. And these four operations are called CRUD operations. It is implemented by databases or maybe in the HTTP methods known as RESTful APIs.

1. **Create**: This create operation allows users to create new records in the database. Depending on the data storage, it can be specified different name. A user can create a new row and populate it with data depending on each attribute. But users can’t create the attribute. This is handled by the database admin. In SQL it is known as INSERT and in HTTP it is known as PUT.

2. **Read**: Read operation mostly like as search operation. It allows to user to retrieve specific data from the database and read it. Users read the data from the database table based on the criteria. In SQL it is known as SELECT and in HTTP it is known as GET.

3. **Update**: The update operation is used to modify the users’ or users’ related information in the database. From the database table under the attribute, the user is able to change the attribute value. In SQL it is known as UPDATE and in HTTP it is known as PUT.

4. **Delete**: The delete operation allows the users to remove specific data or the users’ info from the database. Depending on the attribute user can remove other information. In SQL it is known as DELETE and in HTTP it is known as DELETE.
In a user interactive website, this CURD operation is used mostly.


**JWT**
JSON Web Token is shortly known as JWT. It is used to share security information within a client and a server. It is useful for Authorization and Information Exchange. Each JWT holds encoded JSON objects including a set of claims. JWTs are signed using a cryptographic algorithm to ensure the claims cannot be altered after the token is issued. JWT web structures are -

- Header: It has two parts. One is the type of token and the other is the signing algorithm.

- Payload: It contains the claims. The claims are statements about an entity and additional data. There are three types of claims: registered, public, and private claims.

- Signature: Signature is the combination of the encoded header and the encoded payload, a secret, the algorithm specified in the header, and sign that.
Each JWT looks like xxxxx.yyyyy.zzzzz.


**Express**
Node JS is a platform for building I/O applications that are server-side event-driven and made using JavaScript. And Express JS is a fast and minimalist web framework for Node JS. Express JS is provide server-side logic for web and mobile applications.
Goal Achieved: 45/45 Books Read This Year
Tags: books
Published: 2021-12-26 06:46:20

I have reached my goal I set for myself by reading 45 books! 

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

## Notes

1. A tracker such as the below helped me considerably. The code that generated that chart can be found [here](https://github.com/MokoSan/BookReviews_2021/blob/main/Progress%20Tracker.ipynb). 

2. Audiobooks help scale - bumping up the playback rate has been helpful.

3. Don't feel bad if you don't want to continue reading a book. 

## Top 5:
1. Atomic Habits - James Clear
2. Mindset - Carol Dweck
3. Stillness is the Key - Ryan Holiday
4. The War of Art - Steven Pressfield
5. Man's Search For Meaning - Viktor Frankl 

## All the Books
1. Autobiography of a Yogi - Parmahansa Yogananda
2. The Subtle Art of Not Giving A F_ck - Mark Mason
3. Unfu_k Yourself - Gary John Bishop
4. The Art of War - Sun Tzu
5. The Case Against Sugar - Gary Taubes
6. Mindset: The New Psychology of Success - Carol Dweck
7. Supermind - Norman E. Rosenthal
8. A Guide To The Good Life - William B. Irvine
9. Stillness Is The Key - Ryan Holiday
10. Good To Great - Jim Collins
11. Zero To One - Peter Thiel
12. Deep Work - Cal Newport
13. The 4 Disciplines of Execution - Franklin Covey
14. Irresistible - Adam Adler
15. Man's Search For Meaning - Viktor Frankl
16. The Science Of Getting Rich - Wallace D. Wattles
17. The Buddha In Your Mirror - Greg Martin et. al
18. Eat Fat, Get Thin - Mark Hyman
19. Steal Like An Artist - Austin Kleon
20. 7 Deadly Innocent Frauds of Economic Policy - Warren Mosler
21. The Greatness of Saturn - Robert Svoboda
22. Breath - James Nestor
23. Masters Of Doom - David Kushner
24. Caffeine - Michael Pollan
25. How To Talk To Anyone, Anytime Anywhere - Larry King
26. Show Your Work - Austin Kleon
27. Brain Maker - David Perlmutter
28. Three Questions - Leo Tolstoy
29. The Beggar - Anton Chekhov
30. The War Of Art - Steven Pressfield
31. How To Win Friends And Influence People - Dale Carnegie
32. The Bet - Anton Chekhov
33. The Kybalion - The Three Initiates
34. Atomic Habits - James Clear
35. Your Invisible Power - Geneviève Behrend
36. The Nameless City - HP Lovecraft
37. The Law of Success - Parmahansa Yogananda
38. The Feeling Is The Secret - Neville Goddard
39. Invent And Wander - Jeff Bezos
40. The Secret of Dreams - Yacki Raizizun
41. The Power of Sexual Transmutation - Mitch Horowitz
42. The Heart of Business - Hubert Joly
43. August Heat - W. F. Harvey
44. The Egyptian Book of the Dead - Ani Osiris
45. The Miracle Club - Mitch Horowitz
Logistics app for android using Mongodb-atlas data api and triggers
Tags: atlashackathon, android, kotlin
Published: 2021-12-26 06:42:43

[Instructions]: # (To submit to the MongoDB Atlas Hackathon on DEV, please fill out all sections.)


### Overview of My Submission
An logistics android app for client and delivery partners using Mongodb-atlas data api and triggers


### Submission Category: 

Action Star


### Link to Code

{% github https://github.com/JoyMajumdar2001/DeliveryGo %}

### Additional Resources / Info

#####Screenshots

| Images      | Images |
| ----------- | ----------- |
| ![ScreenShot4](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ef4xlmqn6iulhrgtbywv.jpg)      | ![ScreenShot2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vuo820rfnnf6p5izro28.jpg)       |
| ![ScreenShot1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3wah89qu7ix3w6kpkubq.jpg)   | ![ScreenShot3](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k553bwaoygzkgf9pn6hv.jpg)        |

#####Used technology

- [Kotlin](https://kotlinlang.org):
In this project kotlin is used to code the full application on Android Studio
- [Mongodb-atlas Database](https://www.mongodb.com/atlas/database):
Mongodb-atlas database is used to store all the data used in this application
- [Mongodb Data-Api](https://docs.atlas.mongodb.com/api/data-api):
Data-Api is used to read and write data from Mongodb Database in the android application through network call
- [Mongodb Triggers](https://docs.atlas.mongodb.com/triggers):
In this project I use Mongodb Database trigger to send emails to recipients when shipment is created and order is delivered using [Sendgrid](https://sendgrid.com/)
React Concepts Exploration
Published: 2021-12-26 06:38:51

A few React JS basic concepts -

**PropTypes**
PropTypes is a React JS property that checks the type of the value. That means it’s a validator. It specifies the value of the property. When it receives invalid data, then it shows a warning in the JavaScript console.

**JSX**
JSX stands for JavaScript XML. It is a syntax extension of JavaScript. It allows the developers to write HTML in React JS. It’s actually not HTML, just looks like HTML that gets transformed to JavaScript. And that’s the React JS unique feature.

**State-Props**
State and Props are the attributes of React JS. The state is used to hold data and manage data. And Props is used to pass data. State data is only usable in the same component where Props can pass the data from parent to child component.

**Component Lifecycle**
Every React component has a lifecycle that can be monitored during its three phases.
1. Mounting: Mounting means putting elements into the DOM(Document Object Model).
2. Updating: When anything changed in the components, then it re-render the changes.
3. Unmounting: When the components finished their rendering, then it removed from the DOM.

**Hooks**
Hooks let the developer use state and other React features without writing a class. It is made of pure JavaScript code. It helps us to write DRY code. There are a few hooks in React.
`useState`
`useEffect`
`useRef`
`useContext`
`useReducer`
`useMemo`
`useCallback`

**Custom Hooks**
The custom hook is a JavaScript function made by the developer themselves to perform specific tasks depending on their needs. It allows them to write DRY code. React Hooks built-in and provided by React, where custom hook made by ourselves.

**Context API**
JavaScript is a single-thread language and asynchronous. For this nature in React, data can send only from parent to child. When we need to send data from 4-5 or more layers down, then it is challenging and unorganized to send data by props. To solve this props drilling problem Context API is used. Context API is a component that uses React’s `useContext` hook and it wrapped every component. Then the Context API is acting as a parent and the other component is children. That’s why, when we need to send data in any component without props drilling it is easy to send data.
CSS Position Property
Tags: css, webdev, design
Published: 2021-12-26 05:54:12

Position property is one of the most important things in css. To make an awesome layout we need to position our element properly. In this case, with the help of position property we can easily place our elements everywhere. Position property specifies the type of the position method for an element. It can be static, relative, fixed, absolute and sticky. 
We will discuss each items clearly so that we can understand this 

Position Static:  
Html elements are by default positioned statically. Static positioned elements do not support top, bottom, right & and left properties. 
An element positioned with static is not positioned in special way. It is positioned with documents normal flow. 

Position relative: 
When we set an elements position relative then it positioned relative to its normal position. Setting up a relatively positioned elements top, bottom, left and right adjust its position from normal position. Other elements do not adjust to fill its gaps. 

Position fixed: 
An element with position fixed always stays in the same place relative to its viewport. It always stays in the same place even when the page scrolls. We use top, bottom, right and left properties to position the element. A fixed element does not leave a gap in the page where it would normally have been located.

Position absolute: 
When we specify an element's position with position: fixed; then it is positioned relative to the nearest positioned ancestor. If the element doesn’t have any ancestor then it is positioned relative to the document body. Position relative and position absolute are almost the same. Only difference is relative positioned relative to body and absolute positioned relative to its nearest ancestor. 

Position Sticky: 
An element positioned with sticky positioned based on users scroll. It is the combination of position:fixed and position relative depend on scroll position.
Dealing with Recursion as a Beginner
Tags: beginners, programming, tutorial, cpp
Published: 2021-12-26 05:15:58

## **What is Recursion**
A function calling itself. Well that's what most of us know.
But something that will help a beginner with recursion is that recursion follows a Mathematical concept that is PMI - Principle of Mathematical Induction. For those who are afraid of maths this'll be a punch. But to know more about this we have to imagine how recursion works...

## Calculate Sum of Digits of a Number
Imagine I have a number 123 and we need to calculate the sum of individual digit in this number i.e. 1+2+3 = 6.
We can do this iteratively easily, using for and while loops. But in recursion we take a Base case that'll return some integer like

```
#include <bits/stdc++.h>
using namespace std;

int SumOfDigits(int number){
  // Base case
  if (number==0){
    return 0;
  };
  // Recursion & Calculation
  number = SumOfDigits(number/10)+(number%10);
  return number;
};
```
Here what base case is doing :

```
 // Base case
  if (number==0){
    return 0;
  };
```
We know that once number gets to 0 it'll return 0. That means that if my number reaches end of the digit. 
We are splitting the whole number into smaller numbers that's what recursion is about, split your problem into the smaller problems. Once you find the answer to smaller problems you'll find your answer to main problem eventually.

What we did here: 

```
  // Recursion & Calculation
  number = SumOfDigits(number/10)+(number%10);
  return number;
```
We split number without last digit every time recursion is called. Once there will be only one digit left say - 1, this is where our base case comes into action, as 1/10 will give 0 and it'll eventually return answer to be 0. In manner 12 will be solved as base case of 1 returns 0 we added first and last digit of the number i.e. 1+2 = 3. Once this is done consecutive recursion will split 3 and 3, now as the previous recursion returned 3, we again added last and first value i.e. 3+3 = 6.
This might be somewhat tough to understand in the beginning, but once you get practice of this by dry running your code in paper you'll start to understand it even more.

## NOTE
One more reason why we used base case to be 0 before conclusion, is that since our recursion doesn't stops by itself and it keeps making the number shorter this will give Runtime error or Segmentation fault at sometime. To avoid this we added a base case that's returning 0 once there is only one element is left in the number.
Hope this helps to get a little clear image of recursion. Keep practicing it on problems and you'll get through it.
Installing system nerd-fonts with Ansible
Tags: dotfiles, ansible, todayilearned
Published: 2021-12-26 05:05:21

---
title: Installing system nerd-fonts with Ansible
tags:
  - dotfiles
  - ansible
  - til
series: til
published: true
canonical_url: https://waylonwalker.com/til/ansible_install_fonts/
---

Lately I've been on a journey to really clean up my dotfiles, and I was completely missing fonts.  I noticed jumping into a new vm I had a bunch of broken devicons when using Telescope with the devicons plugins.

This is one of those things that can be a total pain to get right on some systems, and its so nice when its just there for you pretty much out of the box.


1. make sure your user fonts directory exists
2. chech if the font you want exists on your machine
3. download and unzip fonts into the fonts directory
4. repeat 2-3 for all the fonts you use on your system

``` yaml
- name: ensure fonts directory
  file:
    path: "{{ lookup('env', 'HOME') }}/.fonts"
    state: directory

- name: Hack exists
  shell: "ls {{ lookup('env', 'HOME') }}/.fonts/Hack*Nerd*Font*Complete*"
  register: hack_exists
  ignore_errors: yes

- name: Download Hack
  when: hack_exists is failed
  ansible.builtin.unarchive:
    src: https://github.com/ryanoasis/nerd-fonts/releases/download/v2.1.0/Hack.zip
    dest: "{{ lookup('env', 'HOME') }}/.fonts/"
    remote_src: yes

```

## Links

* andibe unarchive docs: https://docs.ansible.com/ansible/latest/collections/ansible/builtin/unarchive_module.html
* how I install yamlls using ansible: https://waylonwalker.com/setup-yamlls/


---


I am working on a shorter content pipeline to get ideas out of my head before I forget them, let me know what you think.  You can see the full list of tils on my website, https://waylonwalker.com/til/
RBS introduced manifest.yaml
Tags: ruby
Published: 2021-12-26 05:03:26

RBS introduced manifest.yaml
RBS v2.0.0, for Ruby 3.1, has been released!
RBS v2 contains many my patches. I recently work for [`rbs collection` feature](https://dev.to/pocke/rbs-collection-was-released-4nmm) especially. In short, `rbs collection` is "Bundler" for RBS. It installs, updates and loads gems' RBSs for `rbs`, `steep` and `typeprof` commands.

In this article, I describe a feature of `rbs collection`, it is `manifest.yaml`.
`manifest.yaml` is a file to describe standard libraries dependencies for RBS.


## Motivation

`rbs collection` detects the dependencies from `Gemfile.lock`.
For example, if your `Gemfile` has an entry, `gem 'rails'`, `rbs collection` finds dependencies gems, such as `activesupport`, `railties`, `nokogiri` and so on, from `Gemfile.lock`. Then it installs RBSs from [ruby/gem_rbs_collection](https://github.com/ruby/gem_rbs_collection) repository.

It almost works well, but it has a problem. `Gemfile.lock` doesn't have standard libraries entries often.
For example, `rails` gem depends on `pathname` stdlib, but the dependency doesn't appear in `Gemfile.lock`. So `rbs collection` couldn't find pathname dependency from `Gemfile.lock`, then the user sees `Could not find Pathname (RBS::NoTypeFoundError)`.


`manifest.yaml` solves this problem.



## What is `manifest.yaml`

`manifest.yaml` is a file to describe standard libraries dependencies for RBS.

The following is the `manifest.yaml` of activesupport gem.

```yaml
dependencies:
  - name: monitor
  - name: date
  - name: singleton
  - name: logger
  - name: mutex_m
  - name: time
  - name: pathname
```

https://github.com/ruby/gem_rbs_collection/blob/ce6664cec7387b4f5b52d01b80d26e9a9f9ad79c/gems/activesupport/6.0/manifest.yaml

It's simple. If `Gemfile.lock` has `activesupport` entry, `rbs collection` finds the stdlib dependencies from the `manifest.yaml`.


### Who writes `manifest.yaml`

If you are an application developer, you don't need to write `manifest.yaml`. You can add a dependency entry to `rbs_collection.yaml` if your application depends on standard library.

If you are a gem author and the gem contains RBS in `sig/` directory, you can put `sig/manifest.yaml`.

If you'd like to contribute ruby/gem_rbs_collection, you can put `gems/GEM_NAME/VERSION/manifest.yaml`. Follow the activesupport example.


## Future work

Currently `rbs collection` resolves stdlib dependencies, but `rbs -r LIB` option doesn't resolve them unfortunately.
For instance, [logger depends on monitor](https://github.com/ruby/rbs/blob/ad94f262cd1fb61af72e38d1e08afcb9c5a9d9e1/stdlib/logger/0/manifest.yaml), but `rbs -r logger` doesn't load monitor.

I'll work to fix this problem soon.


---

By the way, I'll change my job next year to focus on developing RBS. I'll work for both Rails apps and RBS as my job to make RBS production-ready for real Rails applications!
Rate my Union-Type idea Janky.
Tags: janky, typescript, watercooler
Published: 2021-12-26 04:04:30

So, I want my language to have union types, because they are really convenient for storing data of different types in one variable. - I'd go as far to say that it's the most elegant solution a strongly-typed language could have for such a problem.

So, how do they work?
Well, I've based my idea on TypeScript's union-types... for the most part.

As a refresher, here is how you create and use union types.
```typescript
type QResponse = number|string;

function answer_question(ans:QResponse):void {
    if(typeof ans === "string")
        console.log(`Responded with string: "${ans}"`);
    else console.log(`Responded with number: "${ans}"`);
}
```
But, Janky will be a statically typed language, and won't have room for such a silly concept such as `typeof`.
Well, to get around this, to do anything useful with a value of type `TX|TY`, you must pass it to a function that has overloads for all types.  
For example, if you have `byte|BitSet<1>`, and you want to pass it to a function `f`, there must be at least two overloads for `f`, `f(byte) <return-type>` and `f(BitSet<8>) <return-type>`.

Here's an expanded version:
```cpp
type DiscrimType = unsigned int|string;

User find_user(unsigned int user_id) {
    // Code...
}
User find_user(string       user_tag) {
    // Code...
}

User get_user(string user_tag) { /* Code... */ }

User fetch_user(DiscrimType dsc) { /* Code... */ }

User retrieve_user(DiscrimType dsc) { /* Code... */ }
User retrieve_user(string s) { /* ... */ }
User retrieve_user(unsigned long ul) { /* ... */ }
// If Janky ever has a compiler, this would
// not compile.
// If Janky is interpreted, at runtime,
// an error (`AmbiguityError`) is thrown.



DiscrimType discriminator = getDescriminator();

find_user(discriminator);
// Works.

get_user(discriminator);
// Does not work.
// It is not "promised" that `discriminator` is
// a `string`.

fetch_user(discriminator);
// Has to pass `discriminator`'s
// value to another function.

retrieve_user(145959);
// AmbiguityError: unsigned long or
// DiscrimType:[unsigned long]|number?
```


Any and all feedback, positive, negative, neutral, and questions are appreciated.


<b><h1><strong><center>Thanks!<br/>Cheers!</center></strong></h1></b>
Why Python?
Tags: javascript, python, webdev, tutorial
Published: 2021-12-26 04:39:41

**By** the reference of to the latest **TIOBE Programming Community Index,** _Python is one of the top 10 popular programming languages of 2017._ Python is a general purpose and high level programming language. You can use Python for developing desktop GUI applications, websites and web applications. Also, Python, as a high level programming language, allows you to focus on core functionality of the application by taking care of common programming tasks. The simple syntax rules of the programming language further makes it easier for you to keep the code base readable and application maintainable. There are also a number of reasons why you should prefer Python to other programming languages.

1) Readable and Maintainable Code
2) Multiple Programming Paradigms
3) Compatible with Major Platforms and Systems
4) Robust Standard Library
5) Many Open Source Frameworks and Tools
6) Simplify Complex Software Development
7) Adopt Test Driven Development

So To Get Started And Know Most Of The Tricks You Can See My YouTube Channel For It. 
My YouTube Channel Link - https://www.youtube.com/channel/UCTE0nnqFTe6uQqiJmJribXw
```
user = input('Whats your Name? and haven't you follow me on GitHub yet?')
print('Hello {user}')
print('Do not Forget To Subscribe Me')
```
Can I disable the automatic deferring of module-scripts without the `async` attribute?
Tags: html, javascript, webdev, help
Published: 2021-12-26 04:20:49

So, I read [this short article](https://medium.com/ghostcoder/using-es6-modules-in-the-browser-5dce9ca9e911) on using ES6 modules in the browser, and it says this: 
> Scripts of type module are deferred by default. But you can override that behaviour with making them async. (Psst, confused between deferred and async again? [Here](https://bitsofco.de/async-vs-defer/) you go.)

But, I don't want my script to be deferred OR asynchronous.
So, is it possible I could do something around the lines of:?
```html
<script defer="false" type="module" src="main.js">
</script>
```

<b><strong><h1><center>Thanks!<br/>Cheers!</center></h1></strong></b>
Add color to your code block
Tags: webdev, javascript, beginners
Published: 2021-12-26 04:10:12

So you started a blog on dev.to but when you wrote your code in a code block, you noticed this.
```
let str = 'Hello World';
console.log(str);
```
Fortunately, dev.to offers an easy way to add colors to your codes for better display and readability.
```javascript
let str = 'Hello World';
console.log(str);
```
Simply add the name of your programming language right after the first three back-ticks(or the opening back-ticks) for your code block.

I tried Python, Javascript, and PHP. They all worked fine.