teleren/devto huggingface dataset:
Elastic File System(EFS)
Tags: aws
Published: 2022-06-27 17:10:32


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dh8toglsd5kkpmi7doke.png)
 
- AWS Elastic File System(EFS) is  one of the three main storage services.
- It is scalable, cloud- based file system.
- Using EFS we can use a single storage for multiple servers.
- In EFS there is no storage limit.
- The amount of storage you use you need to pay for that only.
- EFS has two option 
      - Regional- with this we can mount to any of the zone in the region.In this the data can be shared among all the zone.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hejvxf1p0xzt0xscu6br.png)
 
                   
      - One Zone- with this we can only mount to a particular 
                  region, but in this the data is avaliable for only that region.

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


## Advantage of Elastic file System(EFS)

- Scalable Performance

- Dynamic elasticity

- Fully Managed

- Cost-effective

- Security and compliance
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nw1ongc55h18pxdycwq6.png)
Paracetamol.js💊| #155: Explica este código JavaScript
Tags: javascript, webdev, spanish, programming
Published: 2022-06-27 16:40:14

## **<center>¿Cuál es la diferencia entre ambas funciones?</center>**
#### <center>**Dificultad:** <mark>Intermedio</mark></center>

```js
const f = (n, m) => {
  return {
    n, m
  }
}

const g = (n, m) => {
  return {
    n: n,
    m: m
  }
}
console.log(f(5,6))
console.log(g(5,6))
```

A. `Ambas funciones regresan SyntaxisError`
B. `No hay diferencia, ambas funciones regresan el mismo resultado`
C. `f esta mal escrita, regresa SyntaxisError`
D. `g esta mal escrita, regresa SyntaxisError`

Respuesta en el primer comentario.

---
😵 can any one explain in detail what's happening in this code
Published: 2022-06-27 16:38:18

const textarea = document.querySelector("textarea"),
voiceList = document.querySelector("select"),
speechBtn = document.querySelector("button");

let synth = speechSynthesis,
isSpeaking = true;

voices();

function voices(){
    for(let voice of synth.getVoices()){
        let selected = voice.name === "Google US English" ? "selected" : "";
        let option = `<option value="${voice.name}" ${selected}>${voice.name} (${voice.lang})</option>`;
        voiceList.insertAdjacentHTML("beforeend", option);
    }
}

synth.addEventListener("voiceschanged", voices);

function textToSpeech(text){
    let utterance = new SpeechSynthesisUtterance(text);
    for(let voice of synth.getVoices()){
        if(voice.name === voiceList.value){
            utterance.voice = voice;
        }
    }
    synth.speak(utterance);
}

speechBtn.addEventListener("click", e =>{
    e.preventDefault();
    if(textarea.value !== ""){
        if(!synth.speaking){
            textToSpeech(textarea.value);
        }
        if(textarea.value.length > 80){
            setInterval(()=>{
                if(!synth.speaking && !isSpeaking){
                    isSpeaking = true;
                    speechBtn.innerText = "Convert To Speech";
                }else{
                }
            }, 500);
            if(isSpeaking){
                synth.resume();
                isSpeaking = false;
                speechBtn.innerText = "Pause Speech";
            }else{
                synth.pause();
                isSpeaking = true;
                speechBtn.innerText = "Resume Speech";
            }
        }else{
            speechBtn.innerText = "Convert To Speech";
        }
    }
});
Web Scraping Experience Survey
Tags: scraping, datacollection, webscraping, api
Published: 2022-06-27 16:36:07

Hi all! 

My name is Alex, I am a Product Manager of SOAX and now build Proxy API Web Scraping solution inside SOAX. 

I want to ask several questions about your Web scraping experience, which take not more than 15 minutes overall. 

We appreciate your time and ready to propose a special offer for all survey participants - up to 12 months FREE web scraping experience with our tool after first release. 

If you are interested, please, take a survey [here](https://ituekjrp115.typeform.com/to/ezzmuTwA). 

Thanks!
Create an NFT Collection Website Landing page with React JS
Published: 2022-06-27 16:23:56


I am going to create a whole NFT Collection Landing Page with ReactJS. Here I have used very few libraries and made a unique design.

For this project, I have only used👇
•	Styled-components
•	Gsap (For cool scrolling animations)
•	Typewriter-Effect
•	React-Confetti
•	React-Use

Note: This website is only the front-end UI and there is no backend.


Demo Link🖤: http://the-weirdos-sahulnotsodev.vercel.app/

we're going to learn a lot of stuff like, 
▶️ Complex Animations in React 
▶️ How to create Scrolling effects using Gsap 
▶️ How we can leverage advantages of component structure 
▶️ How to use confetti in React JS for awesome background effects 
▶️ Uses of Lazy and suspense in ReactJS to make components load faster 
▶️ How to use different Hooks from react-use 
▶️ How to draw SVG path on scroll

gsap (GreenSock Animation Platform)
https://www.npmjs.com/package/gsap
npm i gsap
GSAP is a robust JavaScript toolset that turns developers into animation superheroes. Build high-performance animations that work in every major browser. Animate CSS, SVG, canvas, React, Vue, WebGL, colors, strings, motion paths, generic objects...anything JavaScript can touch! GSAP's ScrollTrigger plugin lets you create jaw-dropping scroll-based animations with minimal code. No other library delivers such advanced sequencing, reliability, and tight control while solving real-world problems on over 11 million sites. GSAP works around countless browser inconsistencies; your animations just work. At its core, GSAP is a high-speed property manipulator, updating values over time with extreme accuracy. It's up to 20x faster than jQuery! See https://greensock.com/why-gsap/ for what makes GSAP so special.

react-confetti
https://www.npmjs.com/package/react-confetti
npm install react-confetti

typewriter-effect

https://www.npmjs.com/package/typewriter-effect
npm i typewriter-effect

Swiper
https://www.npmjs.com/package/swiper

npm i swiper

https://swiperjs.com/

Swiper - is the free and most modern mobile touch slider with hardware accelerated transitions and amazing native behavior. It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps.
Swiper is not compatible with all platforms, it is a modern touch slider which is focused only on modern apps/platforms to bring the best experience and simplicity.

Normalize.css
npm install normalize.css
Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.
[Algorithms] 3 - Find First and Last Position of Element in Sorted Array
Tags: algorithms, binarysearch
Published: 2022-06-27 16:16:00

[Link to the problem](https://leetcode.com/problems/find-first-and-last-position-of-element-in-sorted-array/submissions/)

## 1. Understanding

Input: 

- An array of integers
- Target value

Output:
  
- An array of two integers (range)

Restriction: 

- Need to achieve O(logn) time complexity
- The target is not unique. There can be more than two elements match with the given target value. That is why we are returning an array of the range.


## 2. Matching

- Sorted array & O(logn): Suggest that we need to use the binary search.


## 3. Planning

- Find the element has the same value as the target by performing a binary search.

- Now we need to find the starting point and ending point in case there are more than two corresponding target values in the array.

- **Two more binary search would be needed to find the starting point (0...mid-1) and the ending point (mid+1...length)** because if we perform linear search to find the starting point and the ending point, the time complexity of the algorithm would end up being O(n)
Chrome Vimnium を一部のサイトのみ無効化する
Tags: vimnium, gather
Published: 2022-06-27 16:13:12


Vimnium は便利だが、Web アプリによっては深刻に干渉する。

## Gather で Ghost モードが使えない問題

https://withjulio.com/gather-town/5-unique-hotkeys-in-gather-town-you-might-be-not-knowing-before/

Gather では Ghost モードを使えばベンチなどの狭いスペースにも大人数で入れる。ていうか入れないと会議に参加できなくて仕事に支障がでる。

しかし、Vimnium が有効になっていると、
g キーを押しても、上にスクロールされようとしてされないだけで
何も起こらない。

x キーを押してもウインドウが閉じてしまうので
Go cart も乗れない
猫も撫でられない！！！

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

しかし、設定を頑張って変えれば Vimnium のキーを
Gather のドメインでのみ無効化できた。

Options で  

https?://app.gather.town/*

の Exclude Keys を空欄にすることで解決した！
Go cart 楽しい！
Python Cheat Sheet - DataCamp
Tags: python, opensource, codenewbie, programming
Published: 2022-06-27 16:05:58

A handy one pager Python CheatSheet to kickstart your journey in Data Science 

Interested? Check out the main article: [https://www.datacamp.com/cheat-sheet/python-for-data-science-a-cheat-sheet-for-beginners]


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h1a4q9o569apqhd3y5a7.jpg)
Introducing a Kafka Maturity Model
Tags: kafka, apachekafka, confluent, maturitymodel
Published: 2022-06-27 10:51:33

Hi everyone!

Since I am currently writing my master thesis on Apache Kafka, I have developed a model that is used to classify systems into maturity levels. The model consists of 5 levels and is based on analyses of some aspects of similar models and includes points from own research. Unlike most maturity models, the model does not refer exclusively to processes, but to the communication architecture of the system. The model is presented in the attached PDF document.

For the validation in the context of my master thesis I created a survey. The classification into the maturity model can be done by everyone himself and is done by means of questions, which you can find in the survey. Afterwards there are further questions to evaluate the model. The result of the survey will help me in my master thesis and will be included anonymously. Anyone who has developed or maintained a system using Apache Kafka can participate.

[Link to the maturity model document.](https://drive.google.com/file/d/1MHlZZVL5S-66jt8Hxha04801GIuit_AQ/view?usp=sharing)

Link to the survey: [https://forms.office.com/r/Fv6cUwYv4v](https://forms.office.com/r/Fv6cUwYv4v)

I would be insanely happy about a lively participation in this survey. If you have any questions or comments, please feel free to contact me at b.druesedow.uni@gmail.com.
CFP is open for DevoxxMA, apply and don't miss out this unique experience in your tech career!
Tags: javascript, java, eventsinyourcity, techtalks
Published: 2022-06-27 16:03:00

Deadline is approaching, check the application form via this link: https://dvma22.cfp.dev/

Get to know more about devoxx Morocco? https://devoxx.ma/
Devoxx Morocco is a complete technology immersion with +120 experts speakers coming from all over the world to share their knowledges in latest technology around: Cloud, Containers & Cloud Native topics, DevOps & Culture, Big Data Machine Learning & AI, Modern Wed, JS, UX, Java, Architecture, Mobile, IoT, Blockchain….

Developers from across the world attend this conference to enjoy a unique technological experience that allows them to expand their knowledge, sharpen their skills and gain hands-on experience with the latest technologies while having fun in sunny Agadir.
The Benefits of Using Microservices for Edge Devices
Tags: microservices, opensource, library, luos
Published: 2022-06-27 16:01:42

We recently wrote an article about the benefits of using microservices for edge devices in The New Stack.

⏩ https://thenewstack.io/the-benefits-of-using-microservices-for-edge-devices/

We believe that electronic design should be “microservice-able” and are working on an open source library (Luos) that helps separate code into services so that it is easy to integrate and maintain into a project.

Many thanks to The new stack team, Glenn and Joseph.

Hello to our friends mentioned at Pollen Robotics.

Writer: Nicolas Rabault
Devoxx Morocco biggest tech conference in MEA region!
Tags: javascript, java, techtalks, eventsinyourcity
Published: 2022-06-27 15:41:29

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/35uinm4yiy6et666bzki.jpg)
Dev community asked me to post a first post, and here it is about DevoxxMa , do you know what is DevoxxMa and how to be part of a life changing experience? https://devoxx.ma/
Hoisting in JS
Tags: webdev, javascript, beginners, programming
Published: 2022-06-27 15:26:06

Hey geeks, today let's read about hoisting in JS.

Hoisting is one of those fundamentals which i feel every JS developer should know.
In simple terms, hoisting allows you to use functions and variables before they are declared.
Let us look at the code below

```
console.log(name)
var name = 'hello JS'
```
In this case, JS will not throw any error rather it outputs 'undefined'. This is what hoisting is all about. It happens since JS allocates memory to variables and functions followed by the execution. In the memory allocation phase, variable **name** is being initialized with undefined , that is why it does not throw any error. Knowing about **execution context** will help you understand hoisting in a better way. You can check my article on execution context [here](https://dev.to/suhail/behind-the-scenes-in-js-1gbm)

**Variable hoisting**

Variable hoisting behaves differently depending on how the variables are declared. Let us take a look at the code below

```
console.log(testVar)
let testVar = 'hello JS'
```
It is quite surprising that it throws a reference error unlike var. const also exhibits the same behaviour. we get such errors when let and const are in **temporal dead zone**. Temporal dead zone is nothing but the time between the variable is declared and assigned value.

let and const were introduced in ES5 to avoid using variables before their declaration. It is to be noted that interpreter hoists **let** and **const**, but in some other memory space, whereas in case of **var** it is hoisted in global execution context.

**Function hoisting**

Functions are also hoisted in the same way like variables. Let us take a look at the following code.

```
getName()
function getName() {
    console.log("function")
}
```
Here it outputs 'function' since **getName** is allocated memory before execution.

let us look at another example
```
getName()
const getName = () => {
  console.log("Inside function")
}
```
Here you will be surprised to see that it throws reference error unlike the previous example. It is because 'getName' behaves like a variable here. Only function declarations are hoisted and not function statements.
Deploy your React App on Github in 5 minutes
Tags: github, beginners, programming, tutorial
Published: 2022-06-27 15:24:55

- 1. 
At your app root directory, run the command:

```linux
npm install gh-pages
```

- 2. Publish your app to GitHub:

> Ether button is OK. 
> Ignore this step if you have already published your app

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


- 3. Add the following to the first line of **package.json**:

`"homepage": "https://GIT_USERNAME.github.io/REPOSITORY_NAME",`
> For the URL string, you will need to replace it with your git user name and your current repository name.
> TIPS: click the gear icon on the GitHub page, and the URL will show up:

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

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

- 4. Add the following in "scripts" in **package.json**:

`"predeploy":"npm run build",`

`"deploy":"gh-pages -d build",`


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

- 5. Save the app and commit the change to update your remote repo.

> Alternatively, you can directly update your JSON file on the GitHub webpage and commit changes. 

- 6. Deploy the app by running:
```linux
npm run deploy
```

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

> After the deployment, some changes exist. Just commit these changes again.

- 7. Find your app URL at `General` > `Pages`:


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


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

- 8. Have fun!~ 

> This is my React app Demo I used for this tutorial and [welcome to play](https://hyc0812.github.io/deploy-reactapp-typing-game/)
> [Git Repo](https://github.com/hyc0812/deploy-reactapp-typing-game) for this game

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

### Reference
Cover Page from:
https://akhtarvahid.medium.com/setup-git-and-deploy-react-app-to-github-pages-7b5c4180fdaf
Golang - test doubles, where to keep?
Tags: go
Published: 2022-06-27 15:17:43

Hey! I am wondering where should I put my test doubles like Spy/Stub/Dummy implementations of specific interfaces. What do you think?

I'm of course asking about something that's aligned with go standard layout (internal, pkg directories etc).

In other programming languages I'm keeping these implementations in `/test` directory with all tests, object-mothers, object-builders... but in Golang we're often keeping tests close to the production code.

What do you think? Have you're dealing with it? :)

Have a great week!
Deadman's Switch, Uniswapper - Polygon Week 2
Tags: blockchain, ethereum, web3, beginners
Published: 2022-06-27 15:13:57

gm

Part of my journey at the [Polygon Fellowship 2022](https://polygon.technology/polygon-fellowship/).

Blockchain is an interesting piece of technology. The theme for this week was **Smart Contracts**.

Smart Contracts are the backbone of the Ethereum ecosystem. All the business logic of your application is written in Smart Contracts cannot be modified after being deployed. ([Proxies](https://docs.openzeppelin.com/contracts/4.x/api/proxy) are a small exception).

Let's explore what I built.  

## Deadman's Switch
The name is very badass 😂. Reminds me of the movie Pirates of the Caribbean: Dead men tell no tales. 🏴‍☠️. 

What happens if a smart contract is holding funds, but the owner of the fund dies or is unable to access their wallet for whatever reason?  
A deadman's switch requires that the owner calls the `still_alive` function periodically at a set interval, say every 10 blocks.  
If the owner hasn't called `still_alive` when they should have, then the `rescueFunds` function can be called that will transfer all the funds in the contract (like Ether) to a preset `emergency address`.
This ensures that funds are not forever locked in the contract.

You can check out my implementation of the Deadman's Switch at my Github repository: https://github.com/neelansh15/Deadmans-Switch.
It is deployed on Goerli at https://goerli.etherscan.io/address/0x8C51Aec2eAf32852DeD8D89a75Ffd499ed7E7547.

## Uniswapper
I wanted to learn more about the DeFi ecosystem, and what better way to start than with Uniswap! The pioneer in this space.
I took ETH & USDC as a good starting pair and was able to do a couple of things:
1. Get ETH-USDC pair data using UniswapV2Factory and UniswapV2Pair
2. Swap ETH for USDC using UniswapV2Router
3. Add Liquidity to ETH-USDC, with a twist. Instead of providing both the tokens, you just have to send ETH and the contract will calculate the required USDC amount from the reserves data, swap ETH for the required USDC and then add liquidity to the Uniswap V2 Pool of ETH-USDC.  

More Uniswap functionality can be added and I will redeploy as that happens. 
Check out the code that makes it possible: https://github.com/neelansh15/Uniswapper
Deployed at: https://goerli.etherscan.io/address/0xF5ca8778edab3C08897791A37c03AE0ccE525115

## Bridging Tokens
You can actually bridge your ERC20 tokens from Goerli to Polygon Testnet or from Polygon Mainnet to Ethereum by using the [Polygon PoS bridge](https://mapper.polygon.technology)!
What it allows you to do is submit your ERC20 token on say Goerli, and it will map it to the Polygon Testnet so that your tokens can be bridged between the two chains!  
I created an ERC20 token called HILL and I am waiting for the approval from Polygon. According to their site, it usually takes 3 days to a week to approve it. 
Hopefully mine is done soon!

I also learnt about DeFi in a session hosted by the Devfolio and Polygon teams. In fact, that is what the contents of next week is going to be! Very excited to learn more about the DeFi ecosystem and build on top of it.  

gn
6 CLI Tools All Experts Know
Tags: cli, beginners, tooling
Published: 2022-06-27 15:13:45

I work on Mac OSX and Linux command line environments. My tool kit is shaped by the needs I have. This is my tool box of tools that work with almost any command and help me go from just using the command line to being an expert.
Wow, your friends and colleagues. These tools make every other command at the command line more powerful.

Originally published on my personal site: [6 Command Line Tools All Experts Know](https://kamlasater.com/blog/6-command-line-tools-all-experts-know)

## `|` (aka pipe)

Pipe is awesome. It lets me connect the output of one command and "pipe" it into the input of another command. This is the universal glue that instantly lets me level up the effectiveness of my command line usage.

### Gotchas

There are two outputs from each command, standard out (stdout) and standard error (stderr). Pipe by default connects to stdout.

## `-` (aka dash)

Some commands take a file name as an argument. In cases where I want to use stdin or stdout. Dash is the answer.
I use this alot when I want to read a file from s3 and display it to the console or take the output from a command and write the file to s3.
Print file to console: `aws s3 cp s3://some-bucket-name/awesome-file.json -`

## `pbpaste` and `pbcopy`

These are technically commands as well. They interact with the paste buffer.
On mac you can access your paste buffer using the paste-buffer-paste (pbpaste) and paste-buffer-copy (pbcopy) commands. I love how they keep my console clean especially when I have trying to transform a large chunk of text/json
Example:
`aws s3 cp s3://some-bucket-name/awesome-file.json - | pbcopy`

## `xargs`

This is technically a command. It is a command that executes commands.
It executes a command for every line of input it receives. The arguments you pass to xargs form the basis of the command to execute.
Hint: use `-J{}` to substitute `{}` (or some other character string) in the middle of the command to execute or multiple times for that matter.
Example: `pbpaste | xargs -J{} aws s3 cp {} -`

## `2>` and `2>&1`

Sometimes I want to send stderr somewhere else other than the console. Using its number is the way.
Send to trash: `2>/dev/null`
Send to error log: `2> error-log.txt`
Combine with stdout: `2>&1`

## Ctl-z then `fg`

Suspend the foreground process, run some other commands, then return the suspended process to the foreground.

## `man`, `/`, `n`

When I know the command but not the exact syntax my first source of information is the manual. Instead of searching google I search the manual.
Example: `man xargs` then `/utility` advance to next found instance with `n`
‍