teleren/devto huggingface dataset:
Project to fight DDoS with proof of work
Tags: cybersecurity, typescript, webdev, javascript
Published: 2022-08-01 12:57:00

Spamming and DDoS attacks have increased by a large margin in the past few years. While there are already a lot of rigid mitigation methods for guarding against lower-layer attacks(such as SYN or ICMP flooding, Smurf attack, DNS amplification, and more), implementation on application layer prove to be more troubling.

Application layer DDoS mitigation requires the service itself to differentiate between bot and human, in order to provide services only to legit human users and to curb mass spamming. Attempts at so-called Turing tests were implemented to do so, hence the original captchas. However, bot-makers rendered them useless with text recognition powered by machine learning.

Google then led the switch to image-based ReCaptcha, which is seriously very bad user experience, due to the fact that to make the test harder for bots, the images are barely categorizable in plenty cases. Personally, I really hate Recaptchas, especially when the topic is something like “Choose all the Bridges”. Therefore, I decided to provide an easy alternative with a much better UX: “simply wait for your browser does the rest for you”.

Project Link: [PoW Shield](https://github.com/RuiSiang/PoW-Shield).

We aim to provide the following services bundled in a single webapp / docker image:
- proof of work validation
- ratelimiting and ip blacklisting
- web application firewall

So basically, PoW Shield works as a proxy in front of the actual web app/service. It conducts verification via proof-of-work and only proxies authorized traffic through to the actual server. The proxy is easily installable, and is capable of protecting low security applications with a WAF.

Here’s what happens behind the scenes when a user browses a PoW Shield-protected webservice:

The server generates a random hex-encoded “prefix” and sends it along with the PoW Shield page to the client.
Browser JavaScript on the client side then attempts to brute-force a “nonce” that when appended with the prefix, can produce a SHA256 hash with the number of leading zero-bits more than the “difficulty” D specified by the server. i.e. SHA256(prefix + nonce)=0…0xxxx (binary, with more than D leading 0s)
Client-side JavaScript then sends the calculated nonce to the server for verification, if verification passes, the server generates a cookie for the client to pass authentication.
The server starts proxying the now authenticated client traffic to the server with WAF filtering enabled.

That's it. Please feel free to reach out to me if you got any suggestions, and/or you wanna give a hand in making it better!


[Check it out!](https://github.com/RuiSiang/PoW-Shield)
Can you answer this simple JS async interview question?
Tags: javascript, programming, interview, webdev
Published: 2022-08-01 12:39:48

## See the blow question:

```Javascript
const promise = new Promise((resolve, reject) => {
    console.log(1);
    resolve(5);
    console.log(2);
}).then(val => {
    console.log(val);
});

promise.then(() => {
    console.log(3);
});

console.log(4);

setTimeout(function () {
    console.log(6);
});
```
What will log out in order?




wait.


---




wait..


---


wait...

---


Okay.. here you are :)


--


## Answer: 

[See this gist for answer](https://gist.github.com/re4388/3ff061f378d2f153f9f24a2079b1aca0)

---

## Explain:

We only need to remeber the prioirty is like this:
**sync code -> micro tasks -> macro task**

> See this https://javascript.info/event-loop if you want to know why


First of all, What are the synchronous code runs in order? 
1, 2, 4


Don't be fooled if you think the 1 and 2 inside the new Promise block is async code, these two console.log are sync code.

When we new up a new Promise, we immediately call those and only the resolve callback (and reject callback) are async.

---

Secondly, what are the mico tasks runs in order? 5, 3

Both of them are promise micro tasks and we know those belong to micro task


---
Finally, what's the macro task? 6

And that's the order!

```Javascript
const promise = new Promise((resolve, reject) => {
    console.log(1);   // <-- sync code 1
    resolve(5);
    console.log(2);   // <-- sync code 2
}).then(val => {
    console.log(val); // <-- micro code 1, log 5
});

promise.then(() => {
    console.log(3);   // <-- micro code 2
});

console.log(4);       // <-- sync code 3

setTimeout(function () {
    console.log(6);   // <-- macro code
});
```


That's it for today :)
I Didn't Put My Earnings Back Into My Startup... Here's Why
Published: 2022-08-01 12:21:42

When you are bootstrapping a startup, and you first start making money, it's straightforward advice to put “the money back into the startup.” It shows commitment to grow, they say.

I found it to be precisely the opposite. For me, I decided to take the first thousand dollars and paid myself.

The reason was this:

When I started, my big goal was to get to a modest couple of thousand dollars of recurring revenue per month. Probably enough to match my salary and quit my day job. That goal, amongst creating a great product that people used, charged me up, and kept me going. When I achieved it, there was a great sense of relief. And the monthly recurring revenue kept growing past my goal, and the spirit of assistance turned into confidence.

I didn’t like that.

I needed that goal back again. I need the feeling of the climb from zero to 2–3k back again.

So I made it that. I took the money away from the company and paid myself. So I better build the recurring revenue back up again.

I know this is pretty silly, even stupid but anything to keep the interest going in the beginning stages.

Startups fail not because of a lack of money, but because the founders quit. They lose interest, drive, challenge, and accept defeat. It has happened to me many times before. Not that I would have stopped this time around, but it’s fun to have a laser beam to chase.

Keeping the heart in the business is more important than saving money.

The author is the founder of Proxies API, a proxy rotation api service.
How to link to another site in HTML?
Tags: hyperlinks, website, html, beginners
Published: 2022-08-01 12:05:00

## What is an anchor tag?
An anchor tag is used to specify the link to another site or the same website's pages, the `<a>` element can also be used to link between different sections in the document, for example within the table of content.
Here we will discuss how to implement and apply the anchor tag to link external URLs.

## Basic use of anchor tag.
In the following example, there is the basic implementation of the `<a>` element.

```
<a href="https://gitdemy.com/">Link to gitdemy.com</a>
```
The above syntax creates the link to the URL "`https://gitdemy.com`", which is specified by the href (Hypertext Reference) attribute. When someone clicks on the hypertext "Link to gitdemy.com" the link leads to the required page.

## Using external link type
You can use the external link type to indicate that the link leads to an external website. A `rel="external"` attribute is used to inform the search engines that the link on a site is related to an outside website.

Read more, click the following link.
[https://gitdemy.com/solution/how-to-link-to-another-site-in-html](https://gitdemy.com/solution/how-to-link-to-another-site-in-html)
Priceless Tips for Life and Self Development
Tags: productivity, career, motivation, community
Published: 2022-08-01 11:59:00

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n9cpvfxgyci30ydszlyk.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jjg3v6vo4hlzyqvs6i0s.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z7mt4pk6n7whd1rua7g0.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bxxn1tok43cvxb15cjz8.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/03gy3okl2zomhdcq3sie.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aj5nsyd1qnxwwp24ccv6.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/my0kwksiq7nrge9ywnry.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mdjcc57lag1z8hwntdci.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kvfpv8xnbtdr1lpjtcsp.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6px46gm0v0gn5mlxesfe.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7y49zq8rn8lsbvhjmvoy.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/65vwt8v8ow1vb3zp90j5.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1dfx6xy716u7sd4loa1y.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nd7i8kzougew2v2sd3pj.jpg)

![Priceless Tips for Life and Self Development](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tb2j4z71qiqp1wk3mh4b.jpg)
All you need to know about the Crush Map
Published: 2022-08-01 11:50:24

---
title: All you need to know about the Crush Map
published: true
description: We look into how to set up a good Crush Map and handle the placement and device types of your OSDs in your clusters. The crush map describes where, what type, how much and what is your failure domain or safety requirements.
tags:
cover_image: https://i.ytimg.com/vi/lFHi66F6g08/maxresdefault.jpg
---

{% youtube lFHi66F6g08 %}

We look into how to set up a good Crush Map and handle the placement and device types of your OSDs in your clusters. The crush map describes where, what type, how much and what is your failure domain or safety requirements.
[question] overflow challenge
Tags: nextjs, css
Published: 2022-08-01 11:47:25

hello guys. I'm wondering how the developers in bellow project made this modal. I think the left-hand side is in sticky position but how? because when you use overflow for parent element (modal) you can't use sticky position for child. 

https://shopdressup.com/collections/tops

(click on quick view )
Validator in js
Tags: javascript, typescript, webdev
Published: 2022-07-30 04:58:00

Hello world!!
I'm searching about validator in js and ts. So, I'm gonna write about my summary and conclution.!!


## Comparing
[Trends](https://npmtrends.com/ajv-vs-joi-vs-yup-vs-zod)

| Package  | Feature   | Merit   | Demerit | Link |
|-------------- | -------------- | -------------- | -------------- | -------------- |
| Zod | TypeScript-first schema validation with static type inference | Method chaining and easy to get ts type | Newer package | [zod.dev](https://zod.dev) |
| joi | This is almost same to zod | Have many plugins | Doesn't support static type inference  | https://github.com/sideway/joi |
| Yup | This is almost same to zod | Have many plugins | Missing some feature, function, deep object, promise... ... | https://github.com/jquense/yup |
| class-validator | Validate class properties | Have many features | Code isn't clean | https://github.com/typestack/class-validator |
| ajv | Validate by json scheme | Enable to share schem to other languages | Not supported typescript | https://ajv.js.org/ |


## Recommandation
### If you don't validate by class
I recommand you [zod](#zod).

### If you want to use decorator for validation
I don't recommand you [class-validator](#comparing), instead of it, I recommand you some plugins.

For example, [joiful](https://github.com/joiful-ts/joiful). This is joi plugin.

## zod
```
// In typescript
import { z } from 'zod'

const userScheme = z.object({
    username: z.string(),
    email: z.string().email()
})
type User = z.infer<typeof userScheme>

const data: User = {
    username: 'Takashi',
    email: 'not email'
}

// This code will throw validation error!!
const validated = userScheme.parse(data)

```
Using GraphQL the pythonic way.
Tags: python, graphql, tutorial, programming
Published: 2022-08-01 11:25:41

# Introduction
My main task at work is to implement different interfaces, ranging from database connections to SOAP, RESTful and eventually GraphQL services.

One day whilst implementing another GraphQL service, I thought: "Hold up, why am I writing these graphql queries when i could generate them automatically?"

So I did what every programmer would do. I settled down in my basement, put every other project on hold and dove head over heels into a new project. The result? [qlient](https://qlient-org.github.io/python-qlient/site/). A "blazingly" fast and modern graphql client that was designed with simplicity in mind.

# Installation
[qlient](https://qlient-org.github.io/python-qlient/site/) is a pure-python module. This means that there is no C code which needs to be compiled.

This package is build with [poetry](https://python-poetry.org/) so installation is as you might expect.

```shell
pip install qlient
```

# Usage
My goal was to make the usage as natural and intuitive as possible. It should feel like writing casual python code.

_All examples use a made up http server._

## Queries

{% embed https://gist.github.com/qlient-org/e1160873fb6dfb14c1810a0291c42f1f.js %}

## Mutations

But it is not just queries you can do, mutations are supported as well:

{% embed https://gist.github.com/qlient-org/97ace501c10efdc28a3bfe85b80ae522.js %}

## Subscriptions

And why stop there when we can add subscriptions as well?

{% embed https://gist.github.com/qlient-org/ff47ace6e4c92a5a329c36ddbe76045a.js %}

# Conclusion

If you don't want to write the graphql queries yourself, why don't you go ahead and try out the new [qlient](https://qlient-org.github.io/python-qlient/site/) yourself?

I am happy and open for any thoughts and feedbacks.
How to create "User" object with "Student" and "Admin" sub-classes
Tags: python, javascript, webdev, beginners
Published: 2022-08-01 11:23:10

I want to create "user" class with "student" and "admin" sub-classes. So that the user class would have login and logout methods among others. but I noticed I'm unable to access those sub-classes attr and methods from their parent class "User". I'm an absolute beginner with no mentor. Please I need help...
Why console.log() returns undefined?
Tags: javascript, learning
Published: 2022-08-01 11:04:06

`console.log()` is a function. And a **function is always going to return some value back to the caller.** If a return value is not specified, then the function will return back undefined, _as in `console.log()`_.


_For example, copy and paste the below code in the console:_
```
function isThisWorking(input) {
    console.log("Printing: isThisWorking was called and " + input + " was passed in as an argument.");

    return "I am returning this string!";
}
isThisWorking(3);
```
So, `isThisWorking` function will return back _"I am returning this string!"_ in the console, because that's what the function is returning.

But, _If we removed the return, it will return back undefined:_
```
function isThisWorking(input) {
    console.log("Printing: isThisWorking was called and " + input + " was passed in as an argument.");
}

isThisWorking(3);
```

[_Credits_](https://youtu.be/YY1QFCWGQzE)
Monthly Amazon Location Service Updates - 2022.07
Tags: amazonlocationservice, amplifygeo, amplify, amazonlocationserviceupdates
Published: 2022-08-01 10:57:34

![img](https://day-journal.com/memo/images/logo/aws/location-service.png)

### Monthly Amazon Location Service Updates - 2022.07

<br>

This is a summary of the July updates for Amazon Location Service.

<br>

## 2022.07 Updates

[Announcing quota management for Amazon Location Service](https://aws.amazon.com/about-aws/whats-new/2022/07/amazon-location-service-quota-management/)
Quota management support has been added.

[Amplify Geo - MapLibre GL JS v2](https://github.com/aws-amplify/docs/pull/4446)
"Amplify Geo" now supports "MapLibre GL JS" v2.

[Amplify Geo - Map API's](https://github.com/aws-amplify/docs/pull/4457)
"Map API's" has been added to the "Amplify Geo" documentation.

[Maplibre GL JS Amplify - v2](https://github.com/aws-amplify/maplibre-gl-js-amplify/releases/tag/v2.0.0)
"Maplibre GL JS Amplify" v2 has been released.

<br>

## Other Info

[Amazon Location Service Developer Guide](https://docs.aws.amazon.com/location/latest/developerguide)
Official Amazon Location Service Documentation.

[Amplify Geo Docs](https://docs.amplify.aws/lib/geo/getting-started/q/platform/js)
Official Amplify Geo Docs.

[Amazon Location Service Samples](https://github.com/aws-samples/amazon-location-samples)
Official Amazon Location Service samples.

[amazon-location-service-starter](https://github.com/dayjournal/amazon-location-service-starter)
Build environment to get started with Amazon Location Service.

[A Summary of How to Build Amplify Geo and Amazon Location Service](https://dev.to/aws-builders/a-summary-of-how-to-build-amplify-geo-and-amazon-location-service-5hal)
Summary of Amazon Location Service and Amplify Geo. (as of December 2021)  

[dev.to](https://dev.to/dayjournal)
Articles on Amazon Location Service.

[tags - Amazon Location Service](https://day-journal.com/memo/tags/Amazon-Location-Service)
[tags - Try](https://day-journal.com/memo/tags/Try)
Notes on Amazon Location Service. (Japanese)

<br>

## Related Articles

{% link https://dev.to/aws-heroes/monthly-amazon-location-service-updates-202206-34m %}
Kafka-connect mongodb connector(sink)
Published: 2022-08-01 10:55:03

Hi. Recently, I am working with apache kafka and kafka connect. I have some doubts on kafka-connect. I have connected mongodb-sink connector via plugin.path(connect-distributed.properties). According to the connector properties I am able to create, update and delete the record into db using curl command. Here, before producing the message from producer curl command need to be registered in connector based on curl configuration connector will work.
Below I have given curl command for each operation,
For Create,
curl -X POST -H “Content-Type: application/json” -d ‘{“name”:“test-testing-create”,
“config”:{“topics”:“sunflower”,
“connector.class”:“com.mongodb.kafka.connect.MongoSinkConnector”,
“tasks.max”:“1”,
“connection.uri”:“mongodb://localhost:27017”,
“database”:“flower”,
“collection”:“sunflower-collection”,
“key.converter”:“org.apache.kafka.connect.storage.StringConverter”,
“value.converter”:“org.apache.kafka.connect.storage.StringConverter”,
“key.converter.schemas.enable”:“false”,
“value.converter.schemas.enable”:“false”}}’ localhost:8083/connectors
For update,
curl -X POST -H “Content-Type: application/json” -d '{“name”:“test-testing-update”,
“config”:{“topics”:“testing”,
“connector.class”:“com.mongodb.kafka.connect.MongoSinkConnector”,
“tasks.max”:“1”,
“connection.uri”:“mongodb://localhost:27017”,
“database”:“flower”,
“collection”:“testing”,
“key.converter”:“org.apache.kafka.connect.storage.StringConverter”,
“value.converter”:“org.apache.kafka.connect.storage.StringConverter”,
“key.converter.schemas.enable”:“false”,
“value.converter.schemas.enable”:“false”,
“document.id.strategy.overwrite.existing”:true,
“document.id.strategy”:“com.mongodb.kafka.connect.sink.processor.id.strategy.PartialValueStrategy”,
“document.id.strategy.partial.value.projection.list”:“id”,
“document.id.strategy.partial.value.projection.type”:“AllowList”,
“writemodel.strategy”:“com.mongodb.kafka.connect.sink.writemodel.strategy.UpdateOneTimestampsStrategy”
}}’ localhost:8083/connectors
For delete,
“config”:{“topics”:“subjects”,
“connector.class”:“com.mongodb.kafka.connect.MongoSinkConnector”,
“tasks.max”:“1”,
“connection.uri”:“mongodb://localhost:27017”,
“database”:“flower”,
“collection”:“subjects”,
“key.converter”:“org.apache.kafka.connect.storage.StringConverter”,
“value.converter”:“org.apache.kafka.connect.storage.StringConverter”,
“key.converter.schemas.enable”:“false”,
“value.converter.schemas.enable”:“false”,
“document.id.strategy”:“com.mongodb.kafka.connect.sink.processor.id.strategy.PartialValueStrategy”,
“document.id.strategy.partial.value.projection.list”:“class”,
“document.id.strategy.partial.value.projection.type”:“AllowList”,
“writemodel.strategy”:“com.mongodb.kafka.connect.sink.writemodel.strategy.DeleteOneBusinessKeyStrategy”
}}’ localhost:8083/connectors
My queries are below,
    1. should I register the curl command each time before producing the message? If yes, How can I pass different curl name for each time? 
    2. Is there any way to handle it automatic?
Moving from Vim to Helix
Tags: rust
Published: 2022-08-01 10:46:00

This is my article about `Helix` - a post-modern editor.

Reference: 
- [Helix](https://helix-editor.com/)
- [Github](https://github.com/helix-editor/helix)


### Built-in with Rust.

Yes, `Helix` is an open source written by `Rust`, no `Electron`, no `Javascript`. You can use it `tmux`, plain any terminal. My combo `iTerm2` + `tmux` - very good :), save for battery life and still have a good performance.

### The Begin.

If you use `vim` or `neovim`, you will have a little surprise with `Helix`. `Helix` follows the `selection -> action` model. This means that whatever you are going to act on: a word, a line, etc is selected first and after action on it (delete, yank, change, etc).

You still move with `j`, `k`, `l`, `h` as Vim. But when use `w`, `b` or `e`, you will see a cursor select your word.


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

Some cheatsheet:

| Action | Helix | Vim | 
| ------ | ----- | ----|
| Delete a word | `wd`  | `dw` |
| Delete a character | `d` | `x` |
| Select a line | `x` | `Shift + v` |
| Go to the first file | `gg` | `gg` |
| Go to end file | `ge` | `Shift + g` |
| Go to end line | `gl` | `$` |
| Go to first line | `gh` | `0` |

And you can use shell command in `helix`: 

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

More information: use `tutor`

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

### Easy to config

If vim uses `.vimrc` to config for `vim`, `helix` uses `config.toml` to configure editor. This is official [documents](https://docs.helix-editor.com/configuration.html)
It is easy to config, I show my current config.

```
theme = "gruvbox"

[editor]
line-number = "relative"
mouse = true

[editor.cursor-shape]
insert = "bar"
normal = "block"
select = "underline"

[editor.whitespace.render]
space = "none"
tab = "all"
newline = "none"

[editor.whitespace.characters]
space = "·"
tab = "╎"

```

### Props and Cons

1. Props:
 - Config with file
 - LSP integration
 - Fuzzy file in the project
 - Debugging (experimental)

2. Cons:
 - Not File explorer.
 - Some LSP need a manual config (JSX, TSX).
 - Not support plugin.
 - Status-bar is simple.
 - A lot of issues are pending.

Anyway, `helix` is developing, and we can hope many contributor help to improve.