teleren/devto huggingface dataset:
About Google Scrapped Content Policy
Tags: webdev, webmonetization, googlepolicy, scrapingcontent
Published: 2020-09-19 06:43:50

<h2>What is scraped content?</h2>

Google consider scraped content as content that has been taken from other websites and has been published on your own website without attribution or permission. 

Publishers who publish articles or content from other websites and publish them as their own content are in violation of this policy. 

<h2>Why did Google create this policy?</h2>

Your content is the reason users are on your site. 

Visitors are visiting your site for a reason, whether they're looking for business advice or finding the <a href="https://a2zeshoping.com/">latest information</a> on a particular topic. 

By providing users with the information they're looking for, you're satisfying their needs in the moment that they need it the most. 

Delivering this content is so vital to building a strong and loyal user base. 

When users enjoy your content, they continue to visit your site and can share their positive experiences with others, which helps to grow your site. 

Keep in mind, our goal is to help facilitate a healthy digital advertising ecosystem. 

Google understand that users come to a publisher's sites to view interesting, valuable, and unique content. 

Sites without original content, or sites that have no content, are not useful to users, and advertisers don't want their ads on these pages either. 

These web pages ultimately pose a threat to the trust users and advertisers have in our industry. 

Google understand that some publishers take content from other more well-known sites on the assumption that increasing the volume of pages on their site is a good long-term strategy, regardless of the relevance or uniqueness of the content. 

Purely scraped content, even from high-quality sources, does not provide any added value to users, and may constitute copyright infringement in some cases. 

There are no shortcuts to success. 

Take the time to create original content that sets your site apart and provides real value to users. 

This will keep your visitors coming back and will provide more useful results for users searching on Google. 

All of Google policies are designed and enforced to build trust in the digital advertising ecosystem. 

The futures of Google and Google partners are linked, and Google believe in fostering an environment where users, advertisers, and publishers can all thrive in a healthy digital advertising ecosystem. And by valuing each, we help ensure the sustainability of our industry. 

We hope this article helps you to better understand Google scraped content and no content policies. 

You can find more such article at <a href="https://yuvrajhinger.in">BlogApk</a>.

Comment a review on this affiliate site <a href="https://a2zeshoping.com/">a2zeshoping</a>.

Thank you.
Dart x Flutter MokuMoku Live Coding 19/09/2020 
Tags: dart, flutter, mokumoku, livecoding
Published: 2020-09-19 06:35:14

I'll make something with Dart and Flutter while doing live coding on 19/09/2020

* not performance coding , not  speed coding

# Code
https://github.com/kyorohiro/mokumoku03


# Live Coding Address

https://youtu.be/5Jy5KFPvgJE



# What is mokumoku

For the time being, people who are interested in a certain theme gather and do their own work. Just that.


# Event Page For JP

https://8beat-mokumoku-2020.connpass.com/event/188590/


# History

- Dart x Flutter MokuMoku Live Stream 05/09/2020
  
https://dev.to/kyorohiro/dart-x-flutter-mokumoku-live-stream-2020-09-05-30oa


- Dart x Flutter MokuMoku Live Stream 12/09/2020

https://dev.to/kyorohiro/todo-dart-x-flutter-mokumoku-live-coding-12-09-2020-bbm

# Result


# know-how
prevState with useReducer hook in React.
Tags: react, usereducer, hooks, prevstate
Published: 2020-09-19 06:18:41

---
title: prevState with useReducer hook in React.
published: true
description: prevState with useReducer hook in React.
tags: react, useReducer, hooks, prevState
cover_image: https://i.gyazo.com/8ebb210937b6c7c3062d0142e12d1412.png
---

I wanted to share not only how I currently do State Management with React Context but also what I do when I need prevState, If there are any suggestions for improvement let me know.

Hope this helps some of you :)

```javascript
import React, {
  createContext,
  useReducer,
  useContext,
  useEffect,
  useRef,
} from 'react';

/* ******* */
/* Reducer */
/* ******* */
function reducer(state, action) {
  switch (action.type) {
    case 'LOGIN':
      return {
        ...state,
        isLoggedIn: true,
      };

    default:
      return state;
  }
}

const StateContext = createContext({});
const DispatchContext = createContext({});
const PrevStateContext = createContext({});

const StateContainer = (Context) => {
  const context = useContext(Context);
  if (context === undefined) {
    throw new Error('Context must be used within a Provider');
  }
  return context;
};

const DispatchContainer = (Context) => {
  const context = useContext(Context);
  if (context === undefined) {
    throw new Error('Context must be used within a Provider');
  }
  return context;
};

const PrevStateContainer = (Context) => {
  const context = useContext(Context);
  if (context === undefined) {
    throw new Error('Context must be used within a Provider');
  }
  return context;
};

const AppContextProvider = (props) => {
  const { children } = props;

  const [state, dispatch] = useReducer(reducer, {
    isLoggedIn: false,
  });

  function usePrevious(value: any) {
    const ref = useRef();
    useEffect(() => {
      ref.current = value;
    });
    return ref.current;
  }

  let prev = usePrevious(state);

  return (
    <StateContext.Provider value={state}>
      <DispatchContext.Provider value={dispatch}>
        <PrevStateContext.Provider value={prev === undefined ? {} : prev}>
          {children}
        </PrevStateContext.Provider>
      </DispatchContext.Provider>
    </StateContext.Provider>
  );
};

const useAppContext = () => {
  return [
    StateContainer(StateContext),
    DispatchContainer(DispatchContext),
    PrevStateContainer(PrevStateContext),
  ];
};

export { AppContextProvider, useAppContext };
```
CSS GRADIENTS 1
Tags: css, webdev, womenintech
Published: 2020-09-19 06:09:13

   Hello Everyone, welcome to my first article on dev.to and I am writing on CSS GRADIENTS.
  
 What are GRADIENTS?
 Gradients are one color that fades into another. This color can fade into another in different directions, example: top, bottom, left, right, diagonal e.t.c. This effect can be accomplished by using CSS GRADIENTS.
 According to W3 schools, CSS defines two types of gradients:
1. Linear Gradients
2. Radical Gradients

Linear Gradients (goes down/up/left/right/diagonally)
The easiest way to understand this concept is that the Linear Gradient function transitions two or more colors along a straight line hence the name linear. 
In creating linear gradients, at least two colors should be specified for it to work and the selector is background-image.
Syntax: 
background-image: linear-gradient(direction, color1, color2, ...);

I will use some examples for better understanding:

Example 1
Direction - Top to Bottom (this is default).
I will start by creating a div in my index.html and put a content inside because the <div> tag does not work unless it has a content. 
Index.html:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/rtjhwets7dqtzsg6vwit.PNG)

Then in my CSS,
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/u31ai3ycic00otrcq0bn.PNG)

The result:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/btruiv99igx0wsyxh12l.jpg)

EXAMPLE 2
Direction - Left to Right

In the CSS file,
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/vobadywnwe7625e1o08o.PNG)

The result:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/6eg6w2n2i4gaplj07rry.PNG)

EXAMPLE 3
Direction - Diagonal:
You can make a gradient diagonally by specifying both the horizontal and vertical starting positions.

In CSS file,
 ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0nmpe38n6t04fn7qiw5w.PNG)

The result:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/i61mz8z7xjmisna0pat2.PNG)

This is where I will stop for linear gradients. I will like to know your comment about the article and if it was helpful. My next post will be on radical gradients.

Thank you.
Leetcode September Day18
Tags: python, computerscience
Published: 2020-09-19 05:45:44

Problem - 
>Say you have an array for which the ith element is the price of a given stock on day i.

>If you were only permitted to complete at most one transaction (i.e., buy one and sell one share of the stock), design an algorithm to find the maximum profit.

>Note that you cannot sell a stock before you buy one.

Example 
"""
Input: [7,1,5,3,6,4]
Output: 5
Explanation: Buy on day 2 (price = 1) and sell on day 5 (price = 6), profit = 6-1 = 5.
             Not 7-1 = 6, as selling price needs to be larger than buying price.
"""
Solution

Approach - Using deque. Using deque to keep track of maximum price to the right. We then iterate again and update the maximum profit.
TC = O(nlogn)
```
class Solution:
    def maxProfit(self, prices: List[int]) -> int:
        # we can use stack based approach
        stack = []
        ans = [0] * len(prices)
        for i in range(len(prices)-1, -1, -1):
            if i == len(prices)-1:
                stack.append(prices[i])
                continue
            while True:
                if prices[i] > stack[-1]:
                    stack.pop()
                    if len(stack) == 0:
                        stack.append(prices[i])
                        ans[i] = prices[i]
                        break
                else:
                    stack.append(prices[i])
                    ans[i] = stack[0]
                    break
        res = 0
        for a, m in zip(ans, prices):
            res = max(res, a - m)
        return res   
```
We can still optimize this approach. For each smaller element we are interested in the greater elements to the right. So, while iterating the array, we can arrive at two possibilities - 
1. New element is greater than our current_min, in that case we update our max_profit.
2. New element is smaller than our current_min, in that case we update our current_min.
Solution
```
class Solution:
    def maxProfit(self, prices: List[int]) -> int:
        current_min = float('inf')
        max_profit = 0
        for price in prices:
            if price < current_min:
                current_min = price
            else:
                max_profit = max(max_profit, price - current_min)
        return max_profit
```
Edit - 
Was trying to have some fun and came up with this one liner 
```
class Solution:
    def maxProfit(self, prices: List[int]) -> int:
        return reduce(lambda p,c: (max(p[0], c - p[-1]) , min(p[-1], c)) if type(p) == type((1,2,)) else (0, c), [0] + prices)[0] if prices else 0
```
Image Magic 
Tags: whatdidilearntoday, image, commandline
Published: 2020-09-19 05:31:07

https://imagemagick.org/

convert input.png -bordercolor white -border 0 ( -clone 0 -resize 16x16 ) ( -clone 0 -resize 24x24 ) ( -clone 0 -resize 32x32 ) ( -clone 0 -resize 40x40 ) ( -clone 0 -resize 48x48 ) ( -clone 0 -resize 64x64 ) ( -clone 0 -resize 256x256 ) -delete 0 -alpha off -colors 256 output.ico

This command allows you to provide an image and output all the different sizes defined.
React Bootstrap Table
Published: 2020-09-19 05:17:10

Original Post : <a href="https://askavy.com/react-bootstrap-table/">react bootstrap table</a>

MDBDataTable is a React Bootstrap Table component one needs to install it using the following command and pass data for table and pagination.

<h1>How to install</h1>

npm install mdbreact --save

Link where one find npm package

https://www.npmjs.com/package/mdbreact

<h2>React Bootstrap Table (Code Example)</h2>
<code>
```javascript
import React from "react";
import "bootstrap/dist/css/bootstrap.min.css";
import { MDBDataTable } from "mdbreact";

const data = {
  columns: [
    {
      label: "Name",
      field: "name",
      sort: "asc",
      width: 150,
    },
    {
      label: "Position",
      field: "position",
      sort: "asc",
      width: 270,
    },
    {
      label: "Office",
      field: "office",
      sort: "asc",
      width: 200,
    },
    {
      label: "Age",
      field: "age",
      sort: "asc",
      width: 100,
    },
    {
      label: "Start date",
      field: "date",
      sort: "asc",
      width: 150,
    },
    {
      label: "Salary",
      field: "salary",
      sort: "asc",
      width: 100,
    },
  ],
  rows: [
    {
      name: "Nix",
      position: "Architect",
      office: "New City",
      age: "34",
      date: "2011/04/25",
      salary: "$220",
    },
    {
      name: "Wix",
      position: "Accountant",
      office: "Tokyo",
      age: "63",
      date: "2011/07/25",
      salary: "$170",
    },

  ],
};

export default function App() {
  return (
    <div className="App">
      <MDBDataTable striped bordered small data={data} />
    </div>
  );
}

```
</code>
------------------------------------  


https://react-bootstrap.github.io/components/table/
React select
Published: 2020-09-19 04:55:34

Original Post 
<a href="https://askavy.com/react-select/">react select</a>


<h1>How to install react select using npm</h1>

npm install --save react-select

<h1>How to use react-select multiselect</h1>



<code>
```javascript

import React from "react";
import Select from "react-select";
import "./App.css";

function App() {
  const options = [
    { value: "1", label: "Chocolate" },
    { value: "2", label: "Strawberry" },
    { value: "3", label: "Vanilla" },
  ];

  return (
    <div className="App">
      <Select multi options={options} />
    </div>
  );
}

export default App;
```
</code>
</pre>
</div>

http://askavy.com/
I am learning Ruby on Rails
Published: 2020-09-19 04:36:44

I am an iOS developer with experience in C# backend development. I want to create some iOS content on youtube to help people understand more about Networking in iOS apps without Firebase or other similar services. I have played around with ExpressJS in the last couple of years, but the moment I have to write Javascript it gives me a headache with its inconsistencies and bizarre different ways to do the same simple thing and every way has its own gotchas. 

So today I decided to learn Ruby and then Ruby on Rails for my future personal projects. I am excited and nervous at the same time.
View last change of a file in git without knowing the hash
Tags: git, diff, tutorial
Published: 2020-09-19 04:29:18

`git diff` can show you the differences between 2 commits. You can use `git diff HEAD~1 HEAD -- <filename>` if the previous change is in the last commit.

But most of the time, the last change is not made in the last commit. It was made in n-th commits before. You can use `git log -- <filename>` to find out the commit of the last change. This introduces an extra step. 😅

Actually, you can use `git log -p` instead. Suppose we have a setup like below. We want to check the changes of `b`.

```
git init

echo "a1" > a
echo "b1" > b
git add .
git commit -m "1st commit"

echo "b2" > b
git add b
git commit -m "2nd commit"

echo "a3" > a
git add a
git commit -m "3rd commit"
```

It doesn't show anything if we use `git diff HEAD~1 HEAD -- b`, because it is comparing the 2nd and 3rd commit, there is no change in `b`.

If we use `git log -p -- b`, we can see all the changes on `b` without knowing the commit hash.

```
commit 5bb2c7acf3ba237f7c3f2b367996e92dd10b271f
Author: Franz <xxx>
Date:   Sat Sep 19 12:08:34 2020 +0800

    2nd commit

diff --git a/b b/b
index c9c6af7..e6bfff5 100644
--- a/b
+++ b/b
@@ -1 +1 @@
-b1
+b2

commit bd6508390bcb0f305a9e3e1f9a393d874df419c9
Author: Franz <xxx>
Date:   Sat Sep 19 12:07:54 2020 +0800

    1st commit

diff --git a/b b/b
new file mode 100644
index 0000000..c9c6af7
--- /dev/null
+++ b/b
@@ -0,0 +1 @@
+b1
```

If you want to see only the last change, you can use `git log -p -1 -- b`.

One more thing, you can use `--no-pager` if you don't like to switch to interactive mode when checking the diff. Just do `git --no-pager log -p -- b`.
Hard Drive Maintenence
Tags: learning, whatdidilearntoday, chkdisk, harddrive
Published: 2020-09-19 04:20:50

Frequently run chdsk as part of your maintenance.


https://recoverit.wondershare.com/hard-drive/how-to-fix-hard-drive-problems-with-chkdsk-in-windows.html?/topic/347-content-issues/&do=findComment&comment=1114&gclid=Cj0KCQjwtZH7BRDzARIsAGjbK2Yq8zfR0kdC9JU4jpE1f5RlRjdixRVD7xRthdRMoiaPTw1PmCFkzksaAtM_EALw_wcB
An NPM package for fancy liquid-buttons
Tags: javascript, npm, node, github
Published: 2020-09-19 04:19:41

A Liquid effect button built using SVG and vanilla JS, [NPM Repository](https://www.npmjs.com/package/liquid-button).

Live Demo - https://rajesh-royal.github.io/liquid-button/build/

{% github Rajesh-Royal/liquid-button %}

## share your projects 👍👇👇
Cho thuê Sunwah pearl
Published: 2020-09-19 04:05:58

**[Cho thuê căn hộ *Sunwah Pearl](https://canhosunwahpearl.edu.vn/cho-thue-can-ho-sunwah-pearl/)*** với giá tốt nhất, xem nhà liền **1pn giá 500$, 2pn giá 700$, 3pn giá 900$**. Quý khách đang tìm thuê hoặc có nhu cầu ***cho thuê căn hộ chung cư Sunwah Pearl*** với nhiều loại diện tích, view đẹp, nội thất cao cấp hoặc nhà trống.

+ Cho thuê căn hộ 1 phòng ngủ *Sunwah Pearl* nội thất cở bản giá từ **500$ – 600$/tháng**. Còn nhà full nội thất giá từ **700 – 750$/tháng** *==> Xem thêm [thuê căn hộ 1 phòng ngủ Sunwah Pearl](https://canhosunwahpearl.edu.vn/cho-thue-can-ho-sunwah-pearl-1-phong-ngu/)*

+ Cho thuê căn hộ 2 phòng ngủ *Sunwah Pearl* nội thất cơ bản giá từ **700 – 800$/tháng**. Còn nhà full nội thất từ **800 – 1000$/tháng** *==> Xem thêm [thuê căn hộ 2 phòng ngủ Sunwah Pearl](https://canhosunwahpearl.edu.vn/cho-thue-can-ho-sunwah-pearl-2-phong-ngu/)*

+ Cho thuê căn hộ 3 phòng ngủ *Sunwah Pearl* nội thất cơ bản giá từ **900 – 1100$/tháng**. Còn nhà full nội thất từ **1200 – 1500$/tháng** *==> Xem thêm [thuê căn hộ 3 phòng ngủ Sunwah Pearl](https://canhosunwahpearl.edu.vn/cho-thue-can-ho-sunwah-pearl-3-phong-ngu/)*

+ Giá thuê căn hộ Penthouse *Sunwah Pearl* giá thuê từ **4000 – 6000 $/tháng**

+ Giá thuê căn hộ Shophouse *Sunwah Pearl* diện tích từ **58 – 200m2** giá thuê từ **2500 – 4000 $/tháng**

+ Phí quản lý : 18.600 VNĐ/m2+ Phí gửi xe máy: 200.000VNĐ/tháng+ Phí xe ôtô: 2 triệu/ chiếc/ tháng

### **Hợp đồng cho thuê căn hộ *Sunwah Pearl* bao gồm các điều khoản sau**

- + Thời hạn của hợp đồng thuê: thường ký một năm trở lên
- + Giá cho thuê căn hộ: thoả thuận
- + Tiền đặt cọc thuê căn hộ: thường thanh toán 1 tháng và cọc 2 tháng. (Số tiền cọc này sẽ được hoàn trả lại khách hàng Sau thời điểm hợp đồng thuê căn hộ *Sunwah Pearl* kết thúc)
- + Phương thức thanh toán: thoả thuận, có thể thanh toán bằng tiền mặt hoặc chuyển khoản hàng tháng, hàng quý hoặc hàng năm.

*Nếu quý khách đang tìm thuê hoặc đang có nhu cầu ký gởi **cho thuê căn hộ Sunwah Pearl** thì có thể liên hệ ngay đến chúng tôi để được tư vấn hỗ trợ.*

Nguồn Website: [https://gkg.com.vn/cho-thue-can-ho-chung-cu-sunwah-pearl/](https://gkg.com.vn/cho-thue-can-ho-chung-cu-sunwah-pearl/)
Service Lane Explain - Solution | Javascript
Published: 2020-09-19 03:57:16

```javascript
function serviceLane(n, cases) {
  let result = [];
  const caseSize = cases.length;
  for( let i = 0; i < caseSize; i ++) {
    const start = cases[i][0];
    const end = cases[i][1];
    const min = Math.min(...n.slice(start, end + 1));
    result.push(min);
  }
  return result;

}

serviceLane([2, 3, 1, 2, 3, 2, 3, 3], [ [ 0, 3 ], [ 4, 6 ], [ 6, 7 ], [ 3, 5 ], [ 0, 7 ] ])

```
```javascript
// You must change main function for exactly input
function main() {
    const ws = fs.createWriteStream(process.env.OUTPUT_PATH)

    const [n, t] = [...readLine().split(' ')].map(x => parseInt(x, 10))
    const width = readLine().split(' ').map(x => parseInt(x, 10))
    const cases = Array(t).fill(0).map(x => readLine().split(' ').map(y => parseInt(y, 10)))
    let result = serviceLane(width, cases)

    ws.write(result.join("\n") + "\n")
    ws.end()
}

```

[Problem](https://www.hackerrank.com/challenges/service-lane/problem)
How-To Annoy Your Senator into NOT Voting in RBG's Replacement Until After The Election 
Tags: ethics, socialjustice, womeninstem
Published: 2020-09-19 03:49:08

---
title: How-To Annoy Your Senator into NOT Voting in RBG's Replacement Until After The Election 
published: true
description: A Reaction to RBG's passing
tags: ethics, socialjustice, womeninstem
//cover_image: https://direct_url_to_image.jpg
---

If you are concerned about a replacement of RBG being made before the election, I urge you to call your senator first thing tomorrow and advocate for waiting to vote on Ruth Bader Ginsburg’s replacement until after the election is over. 

Then do it literally as often as you can/want to. 

You can find your senator’s number [here](https://www.senate.gov/general/contact_information/senators_cfm.cfm). 

And [here](https://bit.ly/2EiYCa2) is an excellent article on how to have a productive conversation with your legislator’s office, regardless of the issue.

Godspeed. Dissent with fervor.
1 line css to center object
Tags: html, css, webdev, tutorial
Published: 2020-09-19 03:44:34

Your search for a way to put an object absolutely in the dead center has finally come to an end because I'm going to show you how to do just that with a single line of css code<sorta>.

We accomplish this by using the `place-items` property.

First, make sure to set the `display` to `grid`. Then, set the `place-items` to `center` as shown below.

```css
div {
   display: grid;
   place-items: center;
}
```

That's it. ✌️
Chocolate Feast Explain - Solution | Javascript
Published: 2020-09-19 03:05:08

```javascript
function chocolateFeast(n, c, m) {
  let candy = Math.floor(n / c);
  let wrapper = candy;
  let result = candy;
  while(wrapper >= m) {
    const exchanged = Math.floor(wrapper / m);
    wrapper = wrapper - (exchanged * m) + exchanged;
    result+= exchanged;
  }
  return result;
}

chocolateFeast(10, 2, 5);
```

[Problem](https://www.hackerrank.com/challenges/chocolate-feast/problem)
Quick Introduction!
Published: 2020-09-19 02:38:17

Hi there, as this is my first blog. I would like to introduce a bit about my self. My name is Thanh Tien Phat Nguyen. I am a 21 year old student at Seneca College (Toronto, Canada). However, due to the situation of COVID-19, I'm currently back to my country, Vietnam.

There are couple of reasons why I am taking OSD600 course. Firstly, I'm quite fond of with the idea of being able to contribute and cooperate with people all over the world. And this course, I believe, has all the materials to help me do it. Moreover, in my previous semester, a professor highly recommended me to take the course due to the quality of the course and Professor Humphrey. Furthermore, the fact that Seneca College has its own "The Centre for Development of Open Technology (CDOT)" strengthens my willingness to take the course. 

Prior to the course, there are learning objectives that I hope I could accomplish. When it comes to programming, I want myself to be more active. By which, I mean I could learn from others and help contribute to the community. Secondly, I would like to have a chance to connect and collaborate with my classmates and other people. Moreover, I hope I could learn to make the most of git and github.

Currently, I'm interested in a repo on github which is "30-seconds-of-code". Here is the url of the repo:
https://github.com/30-seconds/30-seconds-of-code.git
Even though many people would find it not significant, I believe it is useful for building a strong foundation in JavaScript.