teleren/devto huggingface dataset:
Selenium Web Driver Vs Proxies API
Published: 2021-02-18 09:52:21

The world of web scraping is varied and complex and Proxies API sits at one of the most crucial junctions. Allowing web scrapers/crawlers to bypass IP blocks by using a single API endpoint to access our 20 million-plus high-speed proxies on rotation.
One of the questions we get frequently is how we are different from services like OctoParse or Diffbot. Many times it is like comparing Apples and Oranges but when we send this comparison table to our customer's developer team, their CXO, their marketing or SEO team, they typically get it quite easily if we are a suitable service or not.

So here is how we are different from Selenium Web Driver...

Selenium was built for automating tasks on web browsers but is very effective in web scraping as well...

Here you are controlling the Firefox browser and automating a search query...
Its language agnostic so here is the same thing accomplished using Javascript.

Selenium Web Driver vs Proxies API
Aspect	Proxies API	Selenium Web Driver
Who is it for?	Developers	Developers
Cost	1000 free CallsStarts at $49 pm	Open Source
API access	Yes	yes
Size of project	enterprisemediumsmall	enterprisemediumsmall
Easy to setup	single api call for everything	manual setup
Product/Service	product	product
Rotating Proxies	Yes	no
Single API?	Yes	no
Desktop App	no	no
Visual Scraping	no	no
Getting my hands dirty with coding !!!
Tags: hacktoberfest
Published: 2020-11-02 11:42:20

Hi ✨developers ✨, I am 👤 Suraez aka Suraj from Nepal. I am a CS student and passionate about coding and programming.I joined DEV 'cause when it came to learning something, there were always articles written by some DEV people with a thorough explanation.So I would also like to share my learnings and learn from other DEV people at the same time.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vrd96bkve70i0os77s24.png)
           I participated in the Hacktoberfest challenge this year (#hacktoberfest2020). Apparently, this open source competition has been around for more than 5 or 6 years.Had I known about this competition before, I would have participated every year.So, I look forward to get notified about such events or competition through DEV.
        Since, I am from Nepal. I doubted if I could participate in this hacktoberfest challenge but DigitalOcean, Intel and DEV made it all easy.Kudos to DigitalOcean, Intel and DEV for giving a platform for students like us to leave a mark on the world.

Here are the 4 PRs that counted for Hacktoberfest2020 challenge:
https://github.com/furaxdev/portofolio/pull/1
https://github.com/Arvind19999/meslaApp/pull/1
https://github.com/pujamudbhari/myportfolio/pull/1
https://github.com/prakriti75/quote-generator/pull/1

Since, this challenge #hacktoberfest2020 literally made me see how can I contribute to this huge, gigantic open source community,I am gonna contribute as much as I can. As of now, I intend to participate in Google Summer Of Code. (GSoC). 
Thanks for reading my post. ✍
MY HACKTOBERFEST EXPEREINCE
Tags: hacktoberfest, opensource, github, git
Published: 2020-11-03 03:38:16

This was my first Hacktoberfest . Being a fresher, I always thought that my level was not that high for clearing this event. But when I started, I started with goal of learning new things and not for completing events.

The things I learned from Hacktoberfest 2020:
1. Git and Github

2. Java


3. Working on issues
Setting Up UFW on Ubuntu Server
Published: 2020-11-16 12:47:03

---
title: Setting Up UFW on Ubuntu Server
published: true
date: 2019-12-15 11:29:00 UTC
tags: 
canonical_url: https://bowlerdesign.tech/posts/setting-up-ufw-on-ubuntu-server/
---

 ![Setting Up UFW on Ubuntu Server](https://images.unsplash.com/photo-1558494949-ef010cbdcc31?ixlib=rb-1.2.1&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=2000&fit=max&ixid=eyJhcHBfaWQiOjExNzczfQ)

[UFW](https://help.ubuntu.com/community/UFW) (Uncomplicated Firewall) is a program that allows you to internally control ports on your Linux instance. This gives you the ability to forward ports from your machine.

The common use of a firewall is to control the ports that have access from the outside world, for instance, running a website would need ports `80`/`443` exposed on your network to be able to route your site.

UFW is different, think of port forwarding, but between local instances. You can lock down internal exposure to port `22` (`ssh`) for example.

## Why? What's the point?

Security.

In the coming weeks, I'll be writing blog posts on how I have set up my jumpbox server. UFW plays a key part in my setup. I have used UFW to only open port 22 on my jumpbox server. I can `ssh` in, but that's it. No other ports can be attacked or sniffed.

From the jumpbox server I can then **only** `ssh` into my other internal instances. This means that if I wanted to `ssh` into server `B` I would have to go via the jumpbox `A`.

## I think I get it, how can I install it?

We're running [Ubuntu Server on a Raspberry Pi](https://ubuntu.com/download/raspberry-pi). But these instructions are for all Debian instances, the Raspberry Pi is irrelevant for this tutorial.

### Let's install

1. Install UFW

`sudo apt-get install ufw`

1. Check the status of UFW

`sudo ufw status`

You should see that UFW is **disabled**

1. Let's allow some ports, it's really important that you allow your `ssh` port, otherwise you can lose access when we get round to enabling UFW.  
The default `ssh` port is **22** unless you have changed the default port.

`sudo ufw allow 22`

You can use the above command to allow the necessary ports for your instance. We're just going to stick with port `22` for this example.

1. Let's enable UFW

`sudo ufw enable`

## That's it

You now have a firewall running on your local instance, locked down to be only accessible by port `22`.

In the future, if you're running services on this box, you'll need to expose any other ports that you want to have access outside of your machine. Let's say you set up [OpenVPN](https://openvpn.net/), you have to expose port `1194` on the machine it's running on.

## Thanks for reading

Thanks for reading, hope I've helped in some way!

<!--kg-card-end: markdown-->
💥 Best of #explainlikeimfive
Tags: bestofdev, explainlikeimfive, beginners
Published: 2020-11-25 20:20:03

> If you can't explain it simply, you don't understand it well enough. 
> -- Albert Einstein

Explain me like I'm five is the best tag on DEV.to and you should definitely follow it

{% tag explainlikeimfive %}

I have compiled for you some incredibly pedagogical answers on this website. Specifically I selected answers that were enlightening yet concise, and that explained with words only - no code.

There are lots of great content here, so **🔖 bookmark the article** if you want to read it when you have more time.

Without further ado, here is the selection:


<!-- TOC -->
- [DNS](#dns)
- [TCP](#tcp)
- [Websockets](#websockets)
- [GraphQL](#graphql)
- [What is programming?](#what-is-programming)
- [What is a programming language?](#what-is-a-programming-language)
- [GitHub](#github)
- [Recursion](#recursion)
- [Dependency Injection](#dependency-injection)
- [Optionals](#optionals)
- [Promises](#promises)
- [Async Await](#async-await)
- [Open-Source](#open-source)
- [Smoke Testing](#smoke-testing)
- [Vue](#vue)
- [React](#react)
- [Redux](#redux)
- [What is DevOps?](#what-is-devops)
- [CI / CD](#ci--cd)
- [Containers](#containers)
- [Docker & Kubernetes](#docker--kubernetes)

<!-- /TOC -->


# Developer roles

{% comment i9k7 %}


# Networking

## DNS

{% comment 127gi %}

## TCP

{% comment ehm %}

## Websockets

{% comment g0g %}

## GraphQL

{% comment hdi %}

# Programming

## What is programming?

{% comment hh25 %}

## What is a programming language?

{% comment hfil %}

## GitHub 

{% comment 3jei %}

## Recursion

{% comment 62mf %}

## Dependency Injection

>  When you go and get things out of the refrigerator for yourself, you can cause problems. You might leave the door open, you might get something Mommy or Daddy doesn't want you to have. You might even be looking for something we don't even have or which has expired.
> What you should be doing is stating a need, "I need something to drink with lunch," and then we will make sure you have something when you sit down to eat.

[John Munsch](https://stackoverflow.com/questions/1638919/how-to-explain-dependency-injection-to-a-5-year-old/1638961#1638961)

## Optionals

{% comment 3395 %}

## Promises 

{% comment 9e0g %}

## Async Await

{% comment nmjk %}

# Methodologies

## Open-Source

{% comment 4444 %}

## Smoke Testing

{% comment 14a0f %}

# Frameworks

## Vue

{% comment hbbp %}

## React

{% comment ha19 %}

## Redux

{% comment oi6 %}

# DevOps

## What is DevOps?

{% comment 3ghf %}

## CI / CD

{% comment bjlp %}

## Containers

{% comment f7l %}

## Docker & Kubernetes

{% comment filh %}

## Did I miss something?

If you have found other explanations which are enlightening and concise, and which use only analogies, words and images, no code, please add them in the comments :)

---

_That was it, thanks for reading! If you’d like to ask a reader question, you can do so at my [“ask me” page](https://jmfayard.dev/contact/) on https://jmfayard.dev/_
3 Useful Websites Everyone Should Know! 2021 🔥
Tags: html, css, javascript, programming
Published: 2021-01-25 17:14:09

1. https://t.co/vZrZ3XyPqG 
(Send Notes That Self-Destruct)

2. https://t.co/DSTOyCfqw4
(Username, Domain & Trademark Search.)

3. https://t.co/XdiEPd7TXO
(Take beautiful, high-resolution screen captures of websites.)
Introduction to Python
Tags: python, git
Published: 2021-08-15 09:17:00

![python](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lieh8mnxvflhmvxc7pic.jpeg)
Python is a programming language created by Guido van Rossum and it was released in 1991.
The language is used in
- Server side web development using frameworks like [Django](https://www.djangoproject.com/) or [Flask](https://flask.palletsprojects.com/en/2.0.x/)
- Science and mathematics using tools like [scipy](http://scipy.org/) or [Pandas](http://pandas.pydata.org/)
- Desktop GUIs using the [TK GUI library](http://wiki.python.org/moin/TkInter)
- Software Development using various python tools like [Scons](http://www.scons.org/),[Buildbot](http://buildbot.sourceforge.net/) or [roundup](http://roundup.sourceforge.net/)
- Business applications
The functions stated above are just among the few areas where Python is used.

### Why use Python?
- Python runs on multiple platforms (Windows, Linux,Mac etc)
- Python has a very simple syntax, It was designed for readability and it has some similarities to the English language
- Python supports functional programming, procedural programming and Object Oriented Programming

### First Python Program (Hello World)
Steps:
- Install [Python](https://www.python.org/downloads/) in your pc
- Open your favourite IDE and paste this line of code:
`print("Hello, World!")`. The output should be *Hello, World!*

Python is easy to pick up whether you're a first time programmer or you're experienced with other languages. Visit the official [Python site](https://www.python.org/) for more information.
Eryn -  React Native Template
Tags: reactnative, react, mobile
Published: 2021-01-26 15:55:04

Always starting a project with React Native leads me to make some changes and make choices on how it should be structured. In general, I think in:

- Directories Structure
- Common Libraries
- Libraries Configuration

Even tho some choices can vary between projects, some of them are constant. I noticed then that I could create a template for making life easier and simple, yet still keep offering a place for dealing with the different kinds of projects that could appear.

I also noticed that I could create a "foundation" for all those who also wanted to use this template at this peak, leaving the project and architectural choices with documentation and some more general Q&A about my vision related to the project structure.

So, I present you 🌲Eryn Template! A React Native Template that could be used directly with the CLI and gives you the support to scale your application and let it open to community contributions! Use it with the command:

```sh
$ npx react-native init MyProject --template react-native-template-eryn
```

### References

- [GitHub Project](https://github.com/caiangums/react-native-template-eryn/)
- [Docs](https://caiangums.github.io/react-native-template-eryn/)
- Cover Photo by <a href="https://unsplash.com/@jaymantri?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Jay Mantri</a> on <a href="https://unsplash.com/?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a>
javascript return?
Tags: help
Published: 2021-01-26 15:23:50

---
title: javascript return?
published: true
description: return quirks, is this just js thingy?
tags: #help
//cover_image: https://direct_url_to_image.jpg
---

```js
function e(){
  return 4, false;
}

e() 
// e () -> false
function f() {
  return 4 + 4, true;
}
f()
// f() -> true
```
Shouldn't I expect it to return 4 or sum of 4 + 4. Why every time my function `e()` and function `f()` return 2nd value?
Show console outputs based on environment
Tags: javascript
Published: 2021-01-26 18:02:36

A project can be beautiful from the outside, but if the browser console is full of messy outputs it will immediately seem confusing and carelessly 😅

## Using the local storange + custom script

In this script we:
- assign the `window.console` to a custom variable named `consoleWrap`
- create a "state" variable `devMode` and save it in the browser local storage. We will use it to determinate if we are in development or production mode!
- instead of use the default `console.log()` function, use the new `consoleWrap.debug.log()` instead, as it will be shown in browser console only when `devMode` local storage var is `'true'`.

```js
// main.js

let consoleWrap = {};

if (localStorage.devMode && localStorage.devMode === 'true') {
  consoleWrap.debug = window.console
} else {
  consoleWrap.debug = () => {}
}
```

```js
// other-file.js

consoleWrap.debug.log('Hello!')
```

To set the `devMode` in browser local storage, please add this line in browser console:

```js
// browser console

localStorage.devMode = 'true'

> Hello!
```

> 🧨 **!important**
>
> local storage values are strings 🤭, so we have to assign the variable as string `localStorage.devMode = 'true'` and check its value as string `localStorage.devMode === 'true'`.

## Using vue env + webpack + loglevel

In a Vue project we already have webpack installed, and do not output noisy `console.log()` in production JS bundle is an efficient way to save kilobytes! 😏

**Loglevel** to the rescue!

- [loglevel](https://github.com/pimterry/loglevel)

> Minimal lightweight simple logging for JavaScript. loglevel replaces console.log() and friends with level-based logging and filtering, with none of console's downsides.

Install it in development packages:

```shell
npm install loglevel --save-dev
```

In every JS file we would need to output something, we have to:
- import _loglevel_
- use its syntax, where `log.debug` == `console.log`

```js
import log from 'loglevel';

log.debug('This output will be in both development and production mode')
```

Why did we talk about webpack above? 😅

Well, webpack will not add into the JS bundle the code that will never be executed, as for example a condition that will never match:

```js
if ((2 + 2) === 5) {
  // This code will never see the sunlight! 😢
}
```

so if we use node `ENV` variables settings:

```shell
# .env

VUE_APP_DEBUG=true
```

```shell
# .env.production

VUE_APP_DEBUG=false
```

we can add all console outputs we want to our project

```js
import log from 'loglevel';

if (process.env.VUE_APP_DEBUG) {
  log.debug('This output will be in development mode, but not in production mode')
}
```

and none of them will output in the final JS bundle! 🎉
Setting Up Webpack for ReScript
Tags: bucklescript, reason, rescript, webpack
Published: 2021-03-24 15:25:51

---
title: Setting Up Webpack for ReScript
published: true
date: 2021-03-20 00:00:00 UTC
tags: ["bucklescript", "reasonml", "rescript", "webpack"]
canonical_url: https://webbureaucrat.gitlab.io/articles/setting-up-webpack-for-rescript/
---

As much as I _strongly_ prefer ES6 modules, using them with ReScript ([formerly BuckleScript / ReasonML](https://rescript-lang.org/blog/bucklescript-is-rebranding)) and ServiceWorkers just isn't practical right now. I'm writing this article so that I can easily grab the configuration the next time I need it. This is a beginner's guide because I am a webpack beginner, and, well, _everyone_ is a ReScript beginner right now.

### Some basic setup

1. Open your _bsconfig.json_ and set the `module` property of the `package-specs` object to `"commonjs"` if it is not already set.
2. Install webpack locally by running `npm i webpack webpack-cli`.

### Configuring webpack

It's important to note for your configuration _where_ your javascript _.bs.js_ files are output, and this is controlled by the `in-source` property of the same `package-specs` object in _bsconfig.json_. This guide assumes `in-source` is `false` (because, quite frankly, that's my preference) but it means that the _.bs.js_ outputs get buried in a deeply nested folder structure.

This is a sample _webpack.config.js_ file based on those assumptions.

```js
const path = require('path');
module.exports = 
{ 
    entry: 
    { 
        index: "./lib/js/src/index.bs.js", 
        about: "./lib/js/src/about.bs.js" 
    }, 
    output: 
    { 
        filename: "[name].js", 
        path: path.resolve(__dirname, "dist/"), 
    }
};
```

This configuration assumes that we should process two output files _index.bs.js_ and _about.bs.js_ (and their dependencies) and then outputs each bundled file by their name ("index" and "about") into the folder called _dist/_. The resulting bundles are _dist/index.js_ and _dist/about.js_.

### Including webpack in the build

You're welcome to run `npx webpack` any time you want to regenerate your bundled files, but it's a good automation practice to add it to your build command like so:

```json
"scripts": 
{ 
    "build": "npx bsb -make-world && npx webpack", 
    "start": "npx bsb -make-world -w", 
    "clean": "npx bsb -clean-world"
}
```

### In conclusion

I'm still not a fan of script bundlers and avoid them wherever possible, but when it's not possible, it's nice to have a configuration pasta on hand. In a future article, I'll talk about my main use for webpack: ServiceWorkers.
Bitcoin T shirt
Tags: tshirt
Published: 2021-01-27 11:05:37

Hi, I offer you a Classic “The Bitcoin Family” T-Shirt design in black. Let everyone know that you accept in BTC. This is best T-shirt quality, thick cotton material.
 
100% Cotton material
High-quality screenprint
Slim-fit ==> Grap Yours Here ==>https://www.bonfire.com/the-bitcoin-family/
ReScript: Adding new actions to an existing useReducer
Tags: rescript, react
Published: 2021-01-27 18:04:08

[Previously](https://dev.to/believer/rescript-using-usereducer-in-reasonreact-bin) we updated a React component to use the `useReducer` hook in rescript-react. In this post, we'll add a couple of new actions to our reducer and see how the compiler helps us with adding these new features.

```rescript
type action = Toggle | Display | Hide
```

We start by adding two new actions to the `action` type called `Display` and `Hide`. After we save we'll get an error in the compiler saying that we haven't covered all cases in our reducer's pattern match. It even tells us that we are missing `(Display|Hide)`. This is exactly what we want!

```reasonml
Warning number 8 (configured as error)

 6 │ let make = () => {
 7 │   let (state, dispatch) = React.useReducer((state, action) => {
 8 │     switch action {
 9 │     | Toggle =>
 . │ ...
13 │       }
14 │     }
15 │   }, HideValue)
16 │

You forgot to handle a possible case here, for example:
(Display|Hide)
```

Let's add the new actions to our reducer.

```rescript
switch action {
| Display => DisplayValue
| Hide => HideValue
| Toggle =>
  ...
}
```

By handling both the `Display` and `Hide` case the compiler will be happy, but we don't have anything that triggers our new actions so let's add those next.

```rescript
<Button onClick={_ => dispatch(Display)}> {React.string("Display value")} </Button>
<Button onClick={_ => dispatch(Hide)}> {React.string("Hide value")} </Button>
```

By adding two `<Button>` components that trigger our new actions when clicked we've successfully added the new functionality to our `useReducer`. The complete updated example looks like this

```rescript
type state = DisplayValue | HideValue

type action = Toggle | Display | Hide

@react.component
let make = () => {
  let (state, dispatch) = React.useReducer((state, action) => {
    switch action {
    | Display => DisplayValue
    | Hide => HideValue
    | Toggle =>
      switch state {
      | DisplayValue => HideValue
      | HideValue => DisplayValue
      }
    }
  }, HideValue)

  <div>
    {switch state {
    | DisplayValue => React.string("The best value")
    | HideValue => React.null
    }}
    <Button onClick={_ => dispatch(Toggle)}> {React.string("Toggle value")} </Button>
    <Button onClick={_ => dispatch(Display)}> {React.string("Display value")} </Button>
    <Button onClick={_ => dispatch(Hide)}> {React.string("Hide value")} </Button>
  </div>
}
```
Swimm Live Demo
Tags: tutorial, devtool, documentation, opensource
Published: 2021-01-27 19:42:02

Get Beta Access at Swimm's first Live Demo Event. 
Join Swimm with your team to create and access unlimited tutorials coupled with your repository, or enjoy complimentary tutorials contributed by the community.

https://www.eventbrite.com/e/swimm-live-demo-version-035-tickets-137414651923

Swimm makes development more fluid with smart docs that are synced and coupled with your code. Never let onboarding, outdated documents, or project switching slow you down.

www.swimm.io