teleren/devto huggingface dataset:
Build Network Effects For Your SAAS Startup
Published: 2022-08-09 10:06:56

The very best startups build network effects along with utility value.

My startup, on the face of it, is just a utility tool. It’s a Rotating Proxy Service. Programmers call the API with a URL and based on that, I fetch the contents of the URL using proxies and give it back to their crawlers — end of the story.

But as a company, that’s not the only value I accumulate or provide. We talk to every customer about their exact needs and see all the problems they face in the whole process of web crawling and web scraping. We are very, very interested in knowing all their issues, knowledge, and lack of it, questions, doubts, options, ideas, failures, and successes. We ask them directly, we infer them by looking at our data, and we look for them actively on the internet. People have many questions on sites like Quora, Reddit, Hacker News, and other forums about Web scraping.

Getting into scenes rather than working in isolation builds another subtle value, the value that emerges as a part of a network. It's not just utility value. Like Facebook, as more and more people join the system, the cost of Facebook increases for every single user. That’s a network effect.

That’s why even when marketing, we want to end up creating network effects in the long run. An ad, for example, works to get you a visit and even a customer, but it doesn’t accumulate any value. A blog post, for example, is slower to produce amount, but it will live forever and produces data network effects.

Quora is an example of data network effects gone wild. As more people ask, view, rate, and answer questions, the value of Quora increases for everyone. We want to be tied into that value growth.

The more we participate in communities like this, post our ideas and thoughts liberally and generously on our blog, on medium, Linkedin, Facebook, etc., the more people find value in interacting with us. It is not just signing up to our service and uses it. It is this collective value of the content we have produced, The understanding of the space and its problems that we have painstakingly accumulated by poking our nose into peripheral issues that we didn’t have to get in. Talking and participating in efforts and discussions that are pushing the boundaries of web scraping is felt and is a benefit to a lot of our existing and new customers. I imagine this whole thing that we do, as an organism, slowly but surely moving, having a life of its own and getting more valuable as it grows in size, in connections, in knowledge, in empathy to the problems and goodwill. All this adds up to the product experience. It is tough work — especially in the beginning when you see no results, but it is now working for us.

This overall network effect also produces a highly defensible company as a side effect. It is complicated to compete with a company like this because of this level of moat. The value doesn’t just rest in the features but also leans heavily in the network, both of data, search engine rankings, and even human connection and goodwill.

The author is the founder of Proxies API the rotating proxies service.
Dynamic url-route generation for React web app with React-router-dom
Tags: react, webdev, tutorial
Published: 2022-08-09 09:55:00

Recently on a project I wanted to generate dynamic url routes, as you can see [here](https://fishy-facts.netlify.app/), each fish has it's own page and each page has it's own dynamic url based on the fish's name. I set out to find out how to do it but surprisingly there wasn't much documentation on it and tutorials that did show how to do it were quite vague about it.

So how did I do it in my app? I used **react-router-dom v6** in my app to help achieve this. Therefore, this tutorial assumes that you're familiar with [react-router-dom](https://reactrouter.com/docs/en/v6/getting-started/overview) to some degree, that being said this is a fairly simple tutorial as react-router-dom does most of the heavy lifting for you. 

### Let's see how it works: 

Here while mapping over the fishStore array I am wrapping every
individual card component with a Link which will lead to every
fish's individual info page.

```javascript
{
  fishStore.map((fishInfo, index) => {
    return (

      <Link

/* Below is the page path with an interpolated string where 
fishInfo.fishPath is the dynamic bit which is being used to 
generated each page's unqiue url from the array the pre-fixed main 
path stays the same */

        to={`/fish-info/${fishInfo.fishPath}`}
        state={{ fishInfo }}
        key={index}
      >
        <Card
          source={fishInfo.fishImageSrc}
          altText={fishInfo.fishImageAlt}
          fishName={fishInfo.fishName}
          fishScientificName={fishInfo.fishScientificName}
          key={index}
        />
      </Link>
    );
  });
}

```
### Allocating the dynamic route variable in the Router:

In the Router we need to add the dynamic route

```javascript
<Router>
  <StyledOuterContainer>
    <Routes>
      <Route path="/" element={<Home />} />

/* Below we are adding the Route path which goes to the 
<FishInfo/> component for rendering each fish's individual page */

      <Route path="/fish-info/:fish" element={<FishInfo />} />
      <Route path="*" element={<Exist />} />
    </Routes>
  </StyledOuterContainer>
</Router>;
```

### Dynamic variable in the Route path string:

Here pay attention to the :fish in the Route path, which is pre-fixed by a colon : symbol. This is important as it tells react-router-dom that this part is subject to being dynamically changed and "/fish-info/" is the base string for every page that stays the same. This colon pre-fixed string can be any name you desire.

```javascript
 <Route path="/fish-info/:fish" element={<FishInfo />} />
```

Now in order to access data in the fishInfo component you can do the following:


```javascript
const location = useLocation()
const {fishInfo}: any = location.state
```

That's all you need to do, you have now completed generating dynamic urls for individual pages using react-router-dom. 

<img src="https://media.giphy.com/media/lD76yTC5zxZPG/giphy.gif" alt="that's all folks">
The story of x, my Redux pure JS all killer no filler
Tags: redux, javascript, beginners
Published: 2022-08-09 09:50:34

I am diving into React with Redux.
I always fall into the trap of trying to skip the fundamentals.
I always choose the hard way.
You can never skip the fundamentals.
I do not understand why they put the essentials before the fundamentals but I should have known better.

Here is the story of x, my Redux pure JS all killer no filler:

```
<!DOCTYPE html>
<html>
  <hread>
    <script src="https://unpkg.com/redux@latest/dist/redux.min.js"></script>
  </hread>
  <body>
    <p id="xValueDisplay"></p>
    <input id="xValueInput" />
    <button id="xValueSetter">Set</button>
    <script>
      // the UI
      const xValueDisplayEl = document.getElementById('xValueDisplay');
      const xValueInputEl = document.getElementById('xValueInput');
      const xValueSetterEl = document.getElementById('xValueSetter');
      
      // the initial state of the reducer
      const appInitialState = {
        x: 'change me'
      }

      // the reducer
      function appReducer(state = appInitialState, action) {
        switch (action.type) {
          case 'x/wasSet':
            return { ...state, x: action.payload};
          default:
            return state;
        }
      }

      // the store
      const appStore = Redux.createStore(appReducer);
     
      // the UI renderer
      function appRender() {
        const state = appStore.getState();
        xValueDisplayEl.innerHTML = state.x;
        xValueInputEl.value = state.x;
      }
      // first render with the state of the store
      appRender();
      // subscribe the renderer to the store updates
      appStore.subscribe(appRender);

      xValueSetterEl.addEventListener('click', function() {
        // we dispatch the x/wasSet action to change store state
        appStore.dispatch({ type: 'x/wasSet', payload: xValueInputEl.value });
      });
    </script>
  </body>
</html>
```
Cannot transfer ONG via JS-SDK
Tags: ontology, ong, blockchain, web3
Published: 2022-08-09 09:35:00

Hi Ontology dev team, 

We stuck with an issue of transfer ONG coin from Ontology EVM to Ontology Native via JS-SDK, this is hard for us to integrate Ontology into our popular crypto ShibaWallet.

Our team is eager to solve the problem so that we hope the dev team is able to answer it here, please.

We just follow the step on docs.https://ontio.github.io/documentation/tutorial_for_developer_en.html

The error is saying: Insufficient balance, but my account actually has 6000 ONG and I can see it on the block exporer explorer.ont.io

Please! please!

Environment:
"ontology-ts-sdk": "^2.0.0"

To get the balance: 
```
const rest = new OntWallet.RestClient(CONST.MAIN_ONT_URL.REST_UR);
let balance = await rest.getBalanceV2(addr)
```
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z9932dej62trhbio99s3.png)


To make a transaction:
```
OntAssetTxBuilder.makeWithdrawOngTx(from, _to, amount, payer, gasPrice, gasLimit);
```
or 
```
OntAssetTxBuilder.makeTransferTx(assetType, from, _to, amount, gasPrice, gasLimit, payer);
```
Both are failed to send due to insufficient balance.

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

Code snippet:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rb4buukqa8bnj6qomla5.png)
What are Azure DevOps Boards?
Tags: devops, azure
Published: 2022-08-09 09:33:31

Azure DevOps Boards are a part of [Azure DevOps](http://dev.azure.com/).  The Boards part of the service is a tool that allows you to plan track and organize your work.  It is an interactive tool that allows you to customize it and provides you with  a rich set of data so that you can get on with your day-to-day tasks and also provide any reporting back to your management team.

It can support Scrum and Kanban management techniques, calendar views, and configurable dashboards.

Check out the video I have created walking you through an example of Azure DevOps boards in use:

{% youtube Ad7KQ0j_VXY %}

## Features of Azure DevOps Boards

- The Azure DevOps Boards is scalable and can grow as your management of your projects tasks and workload grows.  
- Because it is both interactive and customisable you can set it up to display the information that is most important to you and makes the most sense to you.
- There are Marketplace extensions that can be installed to add enhancements to the existing features that are there.

## What is your favourite feature of Azure DevOps boards?
Fix Page not found error when visiting a route directly in react
Tags: react, router, pagenotfound, production
Published: 2022-08-09 09:22:10

Have you ever gotten the dreaded "sorry page not found" error when visiting a particular route by entering its url directly in your browser tab after pushing your react app to production(netlify for instance)?.

There is a quick fix you can use to resolve the issue.

create a file called `_redirects` in your public folder and add this line of code

`/*  /index.html  200`.

This should fix your error.

Thanks for reading.
Need to extract text between two words that last occurred
Tags: regex
Published: 2022-08-09 09:21:46

I am using (?s)(?<=Observation Description\:\s).*?(?=Attachment)  to get the text between “Observation Description:” and “Attachment” words.

I am able to do it with above expression. The word ‘Observation Description’ appears at many places. I want to extract the text between last occurrence of “Observation Description” and next first “Attachment”.

Can you help me how can I do it ?
What mean preview in AKS version ?
Tags: aks
Published: 2022-08-09 09:10:04

Hello All,

I'm planning to upgrade my AKS clusters and targeting the v1.24 when checking the available version i see preview , what does that mean ? 

az aks get-versions --location francecentral -o table 
KubernetesVersion    Upgrades
-------------------  ------------------------
1.24.0(preview)      None available
1.23.8               1.24.0(preview)
1.23.5               1.23.8, 1.24.0(preview)
1.22.11              1.23.5, 1.23.8
1.22.6               1.22.11, 1.23.5, 1.23.8
1.21.14              1.22.6, 1.22.11
1.21.9               1.21.14, 1.22.6, 1.22.11

Thanks .
Blog Engine with Fresh: Logout functionality
Tags: javascript, webdev, react, fresh
Published: 2022-08-09 08:54:00

{% embed https://dev.to/sokhavuth/table-of-contents-41pd %}
GitHub: [https://github.com/Sokhavuth/deno-fresh](https://github.com/Sokhavuth/deno-fresh)
Deno Deploy: [https://khmerweb-fresh.deno.dev/login](https://khmerweb-fresh.deno.dev/login)
<br/>

```js
// routes/logout.jsx

/** @jsx h */
import { h } from "preact";
import { deleteCookie, getCookies } from "cookies";
import { verify } from "jwt";
import { myredis, secret_key } from "setting";

export const handler = {
   async GET(req, ctx) {
        const cookies = getCookies(req.headers);
        if((cookies)&&(cookies.session_id)){
            const jwt = await myredis.get(cookies.session_id);
            try{
              const payload = await verify(jwt, secret_key, "HS512");
              if(payload.user){
                const resp = new Response(undefined, { headers: {location: `/login`}, status: 302 });
                await myredis.del(cookies.session_id);
                deleteCookie(resp.headers, "session_id");
                return resp;
              }
            }catch(error){
              console.log(error);
              return new Response(undefined, { headers: {location: `/login`}, status: 302 });
            }
        }
    },
}

export default function Template(props) {
    return (
        <div>Cookie was deleted!</div>
    )
}
```
If you fail, never give up!
Tags: career, productivity, motivation, beginners
Published: 2022-08-09 08:48:30

**If you fail, never give up because**

## F. A . I . L. means 

> 
_"first Attempt In Learning";_ 

--------------------------------

End is not the end, in fact 

## E. N. D. means 

> 
_"Effort Never Dies";_

---------------------------------

If you get No as an answer, remember 

## N. O. means 

> 
_"Next Opportunity"._

---------------------------------
CSS Battle: #13 - Totally Triangle
Tags: css, webdev, beginners, tutorial
Published: 2022-08-09 08:39:56



In this article, I will solve a [Totally Triangle](https://cssbattle.dev/play/13) CSS Challenge on [CSS Battle](https://cssbattle.dev). Let's look at the problem first.

## Problem 

We need to create the following container by using CSS Properties only:
![Totally Triangle](https://cssbattle.dev/targets/13.png)

## Solution

So now look at the Solution and how we are going to achieve this. 

{% youtube https://youtu.be/T6u4m5ckPOU %}

### HTML


```html
<p> 
```

### CSS

Now let's style the containers. 

```css
* {
  margin: 0;
  background: #0b2429;
}
p {
  position: fixed;
  width: 200;
  height: 200;
  background: #f3ac3c;
  transform: rotate(45deg);
  left: -100;
  top: -100;
}
```

>*Note: In CSS Battle you can use `100` instead of `100px`. You don't need to define `px` in CSS. However, if you are using `rem` or `%`, you need to pass them separately. That's why in the above CSS code there are no units mostly. For more info [visit here](https://cssbattle.dev/tips)*

>*Minify the code or CSS by using any [CSS Minifier](https://www.minifier.org/). It helps you to reduce the characters in the code which will increase the score.*


**Minified Version:**
```
<p><style>*{margin:0;background:#0B2429}p{position:fixed;width:200;height:200;background:#F3AC3C;transform:rotate(45deg);left:-100;top:-100}
```

## Alternative Method

### CSS

```css
body {
  background: linear-gradient(135deg, #f3ac3c 100px, #0b2429 100px);
}
```

You can achieve this by using [`linear-gradient()` ](https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/linear-gradient) also which is a lot simpler. You don't even need HTML in this.


## Wrapping up
There are many ways to solve this. You can share your approach in the comments. If you like this then don't forget to ❤️ it. And I'll see you in the next article. See you soon.
Unboxing my Framework !!
Tags: linux, tooling
Published: 2022-08-09 08:35:00

{% embed https://youtu.be/f8F0_13lFRc %}

My Framework Laptop configuration https://frame.work/fr/fr/products/lap... : 
- Framework: DIY Intel 12th Gen
- CPU: i7-1260P (Up to 4.7 GHz, 4+8 cores)
- RAM: 32 Go (16Go x2, Crucial Ballistix BL2K16G32C16S4B 3200 MHz, DDR4, CL16)
- Storage: 1To SSD (NVMe m2.SATA Western Digital WD Black SN750)
- Wifi: AX210 WiFi (No vPro)
- Keyboard: Ansi US
- Extensions cards: 1 HDMI, 4 USB-C, 1 USB-A, 1 DP
- Power Supply: Caldigit Element Hub

Pre-Order date : May 19th, 2022 (Batch 1)

Delivered on : August 04th, 2022
Model Generation Application
Tags: bpmn, discovery, generation, analytics
Published: 2022-08-09 08:31:08

In our [May news](https://medium.com/@process-analytics/process-analytics-may-2022-news-74b9a879d80e), we announced 📣 our upcoming demonstration tool:  “[Model Generation Application](https://process-analytics.dev/model-generation-application/?utm_source=dev.to&utm_medium=display&utm_campaign=model_generation_app_offline)”.

Built with Process Analytics components, it is a [shiny R application](https://shiny.rstudio.com/) that generates a process from event logs (in [XES format](https://xes-standard.org/)), using 2 representations that can be used for comparison, with execution data (frequency): 

* a basic Process Discovery view 
* a BPMN diagram

For both representations, it lets the user filter out noise that can be generated by the event log, depending on its quality.

With the BPMN view, you can enrich the process semantics by doing gateway and task detection. 
And once the BPMN diagram is generated, you can use it in a BPM platform.

⏩ Go to the [Model Generation Application](https://process-analytics.dev/model-generation-application/?utm_source=dev.to&utm_medium=display&utm_campaign=model_generation_app_offline) page to learn more and try it out 🧪. We’re interested in your feedback!

---

While waiting for the online version, if you want to stay up to date with the latest news and releases from the Process Analytics project, follow us :

* Website: [https://process-analytics.dev](https://process-analytics.dev/?utm_source=dev.to&utm_medium=display&utm_campaign=model_generation_app_offline)
* Twitter: [@ProcessAnalyti1](https://twitter.com/ProcessAnalyti1)
* GitHub: [https://github.com/process-analytics](https://github.com/process-analytics)
Move between words/text
Tags: android, tutorial, productivity, ios
Published: 2022-08-09 08:25:11

Sometimes you have a large text in your phone and want to edit a typo or a word. You always try to click with your finger to that specific word. Its a hassle sometimes and there is a work around for that. Just press your space bar and move your finger from left to write and vice versa. This will move the cursor corresponding to your movement. Here is the video illustrating the same.

{% embed https://youtube.com/shorts/m44VXhHgtAM?feature=share %}
How to Compile the SDK of SSD202D Scheme
Tags: beginners, tutorial, programming, discuss
Published: 2022-08-09 08:23:38

**1. Compile SSD202 SDK**
compile uboot

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

- Select the configuration related to the model
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k78o4vlhgwbwyz39esq0.png)

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

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

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

- For detailed introduction of binary files involved in uboot partition production, please refer to: Development - application development reference - system related - SSD_ system partition

**2. Compile kernel**

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

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

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

- Replace burning image
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0vb95c95yuqrg74jowad.png)

**3. Make file system**

- The UBI partition file system is in the ssd20x rootfs open / ssd20x directory. It only needs to decompress the file system and add customized software to take effect. There is no need to recompile the system image. Take adding an application in ssd202 as an example:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tkdbdaslrjqm3gichkcy.png)

- After adding the files, execute the packaging script of the corresponding partition file system
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jhpctt5u7r2had4czj9s.png)

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

**4. Compile openwrt**

- If you need openwrt to support additional software functions, you need to compile the SDK and replace the image. If you only do UI development or driver development, you do not need to perform this step:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wqvmq04t76s4p8few1wf.png)
Today's Fun Joke For Developers - Daily Developer Jokes
Tags: jokes, dailydeveloperjokes
Published: 2022-08-09 08:00:23

---
title: "Today's Fun Joke For Developers - Daily Developer Jokes"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
published: true
tags: #jokes, #dailydeveloperjokes
---

Hi there! Here's today's Daily Developer Joke. We hope you enjoy it; it's a good one.

![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1259316ab83.png)

---

For more jokes, and to submit your own joke to get featured, check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/). We're also open sourced, so feel free to view [our GitHub Profile](https://github.com/dailydeveloperjokes).

### Leave this post a ❤️ if you liked today's joke, and stay tuned for tomorrow's joke too!

_This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit._

<!--
Joke text:
___Q:___ What are the three hardest problems in computer science?

___A:___ Naming things and off-by-one errors
 -->
10 Card Games To Learn How To Code
Tags: coding, programming, learning, cardgames
Published: 2022-08-09 07:55:20


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


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


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


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


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


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


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


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


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


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