teleren/devto huggingface dataset:
Changelog: Subscribe to a Post’s Threads v2
Tags: changelog
Published: 2020-05-06 09:45:02

You could already subscribe to a post's comments on DEV, but the problem was many community members were not aware that you could. We had this feature pretty well hidden. From a post page, you had to click on the three dots to see a post's comment subscription options.

![Screenshot of the old comment subscription feature](https://dev-to-uploads.s3.amazonaws.com/i/0sj1vxrqee4oji1r2yz2.png)

With the new comment subscription component, comment subscriptions are front and center in the discussion area of a post.

![New comment subscription component](https://dev-to-uploads.s3.amazonaws.com/i/airq1toftv6k2u0zaggl.png)

All the existing functionality still exists, it's just easier to find. 😄 You can subscribe to all comments, top comments, author comments or unsubscribe.

![New comment subscription component displaying comment subscription options](https://dev-to-uploads.s3.amazonaws.com/i/u5ngx2iqvxvz5ysi1771.png)

Take it for a spin to stay engaged with the posts that interest you.

Here are the PRs related to this feature for those interested.

{%github https://github.com/thepracticaldev/dev.to/pull/7205 %}

{%github https://github.com/thepracticaldev/dev.to/pull/7415 %}

{%github https://github.com/thepracticaldev/dev.to/pull/7136 %}

{%github https://github.com/thepracticaldev/dev.to/pull/7048 %}

{%github https://github.com/thepracticaldev/dev.to/pull/6987 %}
Best Open-Source Javascript Date Picker Plugins and Libraries
Tags: javascript
Published: 2020-05-06 13:30:36

---
title: Best Open-Source Javascript Date Picker Plugins and Libraries
published: true
date: 2020-05-06 09:43:27 UTC
tags: JavaScript
canonical_url: https://www.ma-no.org/en/programacion/javascript/best-open-source-javascript-date-picker-plugins-and-libraries
---

For date pickers, selecting menus is a common choice as they are simple to set up. But I suppose our customers deserve better after centuries of using MM / DD / YY menus.For many companies, datepickers are vital. They can also be used for any defined purpose to monitor time.It seems to be a easy and trivial mission to choose a datepicker plugin. But if this decision is made wrongly, it may have catastrophic implications for a product. Imagine if you set up a conference with your doctor or purchase a plane ticket for the incorrect date, how things can… !

[Read more](https://www.ma-no.org/en/programacion/javascript/best-open-source-javascript-date-picker-plugins-and-libraries)
React - handle Image loading error gracefully using custom hook
Tags: react, javascript, html, css
Published: 2020-05-06 09:31:21

With the introduction of a hook in react, things around the functions becoming more popular day by day and I really love the idea of "sharable state logic" across the component which is being achieved by the hooks.

__Problem statement:__ How to handle the image throws an error in loading.
The one solution of this would be to directly use onError everywhere in the image. However, you can bring the custom hook here in a very cool way. Let's dive in -


```jsx
function Image() {
  const [setImg, hasError, retry, imgRef] = useImageError();

  return (
    <img ref={setImg} src="hello.png" alt="hello" />
  );
}
```

Though the above example serves the purpose. But you what if there is a use cases like - showing something else when there is an error in the image. In that case, there must be use of state which can toggle the component based on error, which I think very tedious process. Instead, the custom hook can be used.

Let's modify the above example a little bit and introduce a hook.

```javascript
function Image() {
  const [setImg, hasError, retry, imgRef] = useImageError();
  
  if (hasError) return <div>Error !!!</div>
  
  return (
    <img ref={setImg} src="hello.png" alt="hello" />
  );
}
```

The above example shows that there is a hook called useImageError which exposes four keys, setImg - a function which will be used as a callback ref, hasError - a flag which indicates whether there is an error or not, retry - a function which can be used to re-render the image and the last one - which gives the image ref.

```javascript
const useImageError = () => {
  const [el, setEl] = useState(null); // contains image reference
  const [error, setError] = useState(false); // contains error flag

  const _handleError = () => { setError(true); }  // set error
  const retry = () => { setError(false); } // set error false to img can re-render

  useEffect(() => {
    // use of error event of the image tag
    el?.addEventListener(“error”, _handleError);

    return () => {
      el?.removeEventListener(“error”, _handleError);
    }
  }, [el]);

  return [
    setEl, // set the image ref
    error, // error flag
    retry, // a func, which can be used to re-render image
    el // img ref(for special case which requires ref)
  ];
};
```

So this is the implementation of the useImageError hook which basically listens to the error event on image reference and toggles the error flag based on the error event. The hook takes care of all the state management and event binding which will require tracking the image error.

Of course, you would not do this for a single instance of the image, but yes you can take this if you have multiple occurrences of such cases.
How to do a better code review?
Tags: discuss, codereview
Published: 2020-05-06 09:12:36

We recently started doing a code review of every PR that our team members make. 

Most of the time I worry about commenting on something and requesting changes from them. Because in my head I am thinking what if this sounds rude to them or what if I am wrong, or what if they don't feel good about my comments?  

Have you witnessed a similar situation? How do you handle that?
Magento 1 to Magento 2 Migration : Frequently Asked Questions (FAQs)
Published: 2020-05-06 08:43:24

When Magento launched its highly anticipated platform Magento 2, the eCommerce industry welcomed it with open arms. And since then it became the big news for many. Many Magento 1 users and merchants were confused about their store’s future. So, along with the launch of Magento 2, Magento also announced that it will end the life support for Magento 1. And to do that the previously set deadline was extended until June 2020.
Many Magento 1 store owners migrated to Magento 2 foreseeing its future in the eCommerce world. Still, there are many Magento 1 store owners stuck with it with lots of questions and confusion in their minds. Those questions and confusion hold them back from moving to the futuristic platform like Magento 2.
Therefore, we have come up with a guide that answers the most frequently asked questions (FAQs). Questions like how long does it take to migrate, when is the right time to migrate, the total cost for migration to Magento 2 and other frequently asked questions have been answered by our Magento experts. These questions will solve all your doubts so that you are ready before you make any migration decision.

[Magento 1 to Magento 2 Migration : Frequently Asked Questions (FAQs)](https://www.mconnectmedia.com/blog/magento-1-magento-2-migration-frequently-asked-questions-faqs/) on [Mconnect Media](https://www.mconnectmedia.com/).
1.1 simple hello world program
Tags: java, introduction, beginners, devop
Published: 2020-05-06 08:23:10

NOTE- THIS IS SECOND PART OF MY FIRST ARTICLE ABOUT JAVA YOU CAN CHECK IT BY FOLLOWING MY PROFILE. CHHERS...! 


1.2. Hello world Java program
// a small Java program
public class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello World");
    }
}
1.3. Java virtual machine
The Java virtual machine (JVM) is a software implementation of a computer that executes programs like a real machine.

The Java virtual machine is written specifically for a specific operating system, e.g., for Linux a special implementation is required as well as for Windows.

jvmintroduction10
Java programs are compiled by the Java compiler into bytecode. The Java virtual machine interprets this bytecode and executes the Java program.

1.4. Java Runtime Environment vs. Java Development Kit
A Java distribution typically comes in two flavors, the Java Runtime Environment (JRE) and the Java Development Kit (JDK).

The JRE consists of the JVM and the Java class libraries. Those contain the necessary functionality to start Java programs.

The JDK additionally contains the development tools necessary to create Java programs. The JDK therefore consists of a Java compiler, the Java virtual machine and the Java class libraries.

1.5. Development Process with Java
Java source files are written as plain text documents. The programmer typically writes Java source code in an Integrated Development Environment (IDE) for programming. An IDE supports the programmer in the task of writing code, e.g., it provides auto-formating of the source code, highlighting of the important keywords, etc.

At some point the programmer (or the IDE) calls the Java compiler ( javac ). The Java compiler creates the bytecode instructions. These instructions are stored in .class files and can be executed by the Java Virtual Machine.

1.6. Garbage collector
The JVM automatically re-collects the memory which is not referred to by other objects. The Java garbage collector checks all object references and finds the objects which can be automatically released.

While the garbage collector relieves the programmer from the need to explicitly manage memory, the programmer still need to ensure that he does not keep unneeded object references, otherwise the garbage collector cannot release the associated memory. Keeping unneeded object references are typically called memory leaks.

1.7. Classpath
The classpath defines where the Java compiler and Java runtime look for .class files to load. These instructions can be used in the Java program.

For example, if you want to use an external Java library you have to add this library to your classpath to use it in your program.
how we can prevent browsers from killing your RAM 🛑
Tags: browsers, webdev, opensource, firefox
Published: 2020-05-06 07:58:55

Hello all hope you're doing well in this quarantine period in this article I am going to tell you how we can avoid browser from killing your RAM.
One day I wake up from sleep and I opened my browser then I saw I have 49 tabs open then browser gave me one alert **You having 49tabs opened that can make your browser and system slow close some if you can** then I discovered following trick that is going to help you all🔽.

**Begin Here😊**
After a little bit thinking, I tried one thing I open google docs and created a number list and then pasted all links by numbers-wise, and then I pinned that tab to my browser, and then it is good we are sorted now Done thank you .
**Note**
<p>When you have multiple tabs open in your browser after shutdown .you again open that browser with a pack of pin tabs that is going to take more network also and RAM for loading UI things like Google fonts and images but in case of google docs your just storing links and just paper document pin in your browser that is not going to take more ram and network .</p>  


**📷How🔽**

![IMAGE](https://dev-to-uploads.s3.amazonaws.com/i/lx8qy90555ta3za1exnj.png)

**One tab addons that will help you**
chrome one tab addon👉[OneTabAddon for chrome](https://chrome.google.com/webstore/detail/onetab/chphlpgkkbolifaimnlloiipkdnihall?hl=en)
firefox one tab addon👉[OneTabAddon for firefox](https://addons.mozilla.org/en-US/firefox/addon/onetab/)
Step Away from the 'Should' to Embrace the 'What If'
Tags: devjournal, codenewbie, womenintech
Published: 2020-05-06 07:48:56

_This post was originally published on May 6, 2020 on [my blog](https://alexlsalt.github.io/blog)._

I woke up with amazing news today! Can't share directly right now (I know, the frustration!) but just know that I'm feeling GÜD.

From some Pinterest-browsing this morning, I took a break from my regularly-scheduled maximalism-gallery-wall and sprawling-cottage-garden inspiration to fall in love with this sweet quote (author unknown):


> _You gotta start romanticizing your life._

> _You gotta start believing that your morning commute is cute and fun, that every cup of coffee is the best you’ve ever had, that even the smallest and most mundane things are exciting and new._

> _You have to, because that’s when you start truly living. That’s when you look forward to every day._


I seriously love this. Consciously recognizing each moment as unique and exciting has been *the* deciding factor for me in living an amazing life.

The fact that our experiences are shaped directly by our thoughts and that we can learn to cultivate our thoughts to have a more optimistic (or inversely, negative) bent is simply mind-blowing.

I love this time in my life - learning, growing, gracefully stepping away from the 'should' to embrace the 'what if.'

And it's only just getting started.
Điều Bạn Nên Biết Về Ngôn Ngữ Lập Trình
Published: 2020-05-06 07:38:22

Nếu bạn đang xem xét một nghề nghiệp trong phát triển phần mềm, bạn sẽ cần biết ít nhất một ngôn ngữ lập trình. Ngôn ngữ lập trình là nền tảng cơ bản để bạn theo đuổi con đường sự nghiệp IT. Nhưng bạn thật sự đã hiểu về nó chưa và các loại ngôn ngữ lập trình nào đang được ưu tiên hàng đầu.
Ngôn ngữ lập trình là một dạng ngôn ngữ được thiết kế và chuẩn hóa theo những hệ thống quy tắc riêng mà qua đó người lập trình có thể mô tả các chương trình làm việc dành cho thiết bị điện tử mà con người và các thiết bị đó đều hiểu được. Một ngôn ngữ lập trình còn được gọi là hệ thống lập trình, ngôn ngữ máy tính hoặc hệ thống máy tính. Chức năng của ngôn ngữ lập trình rất đa dạng và nó được ứng dụng trong rất nhiều công việc khác nữa.
Một số ngôn ngữ lập trình phổ biến: Java, C/C++, JavaScript, Python.
http://laptrinhvacongnghe.com/ngon-ngu-lap-trinh/
Snowpack: The bundle free build tool - Let's take a look
Tags: snowpack, webapps, javascript
Published: 2020-05-06 07:38:12

---
title: Snowpack: The bundle free build tool - Let's take a look
published: true
description: Snowpack v2 is in early-access, let's have a look at this tool.
tags: Snowpack, web apps, javascript
---

Pretty much most web applications use a bundler to build their applications, webpack, Rollup, Parcel are some of the most popular. But, the problem always is that they take too long to setup and get the config right. It is usually something that I personally don't want to spend time on.

So, let's introduce Snowpack version 2 by [Pika](https://twitter.com/pikapkg). Snowpack claims to be 'The fast, bundle-free build tool for modern web apps.' and to be honest I don't disagree with it at all. 
The setup is really easy and Pika has even built a `create-react-app` style starter template for Vue.js, React, React with TypeScript and Svelte for us to get up and running with really quickly, which they've called Create Snowpack App (CSA). CSA can be used like this: `npx create-snowpack-app new-dir --template @snowpack/app-template-vue [--use-yarn]`

### Key Points

* No Bundling Needed During Development: Snowpack installs your npm dependencies so that they can be imported directly in the browser without an application bundler.
* Instant Dev Startup: 20ms or less is how long it takes for Snowpack’s dev server to start on most machines. Files are only built on-demand, as requested by the browser.
* Instant Dev Rebuilding: Never wait more than a few milliseconds when you hit save. Since there’s no large app chunks to rebuild, changes are reflected in the browser instantly.
* Connect your Favorite Build Tools: Manage your build using a simple, familiar “scripts” interface that replaces traditionally complex plugin ecosystems.
* Bundle for Production: It’s the best of both worlds: fast bundle-free development + optimized bundling in production. Choose between bundled (optimized) or unbundled build output without any additional config needed.

I'm not going to go into any more detail here about Snowpack. I just wanted to introduce it to anyone here that hasn't heard about it yet, enjoy.
BOOTSTRAP LÀ GÌ? NHỮNG ĐIỀU BẠN CẦN BIẾT VỀ BOOTSTRAP
Published: 2020-05-06 07:37:02

Các trang web đang được tất cả mọi người sử dụng hàng ngày và liên tục. Tuy nhiên không phải ai cũng hiểu được cấu trúc của những trang web mình đang dùng. Trong đó, Bootstrap là một trong những công cụ hữu ích và cần thiết góp phần xây dựng trang web. Hãy tìm hiểu một số kiến thức về bootstrap.

Bạn đang muốn tạo một website cho riêng mình nhưng đang còn gặp vấn đề về việc lựa chọn một framework dễ làm dễ học mà hiệu quả tốt. Không còn lo lắng gì khi bạn lựa chọn Bootstrap.

Bootstrap là khung HTML, CSS và Javascript phổ biến nhất để phát triển các trang web với các thiết bị cầm tay như: di động, ipad,...

Bootstrap có sẵn như: typography, forms, buttons, tables, image carousels,...và bên trong nó còn có thêm nhiều Component, Javascript hỗ trợ rất nhiều trong việc thiết kế. Với loạt tính năng hỗ trợ đó bạn có thể làm việc dễ dàng hơn, thuận tiện hơn, tiết kiệm được thời gian

Bootstrap 4 là phiên bản mới nhất của Bootstrap; với các thành phần mới, biểu định kiểu nhanh hơn và phản ứng nhanh hơn.Bootstrap 4 hỗ trợ các bản phát hành ổn định, mới nhất của tất cả các trình duyệt và nền tảng chính. Tuy nhiên, Internet Explorer 9 trở xuống không được hỗ trợ.

Nếu bạn cần hỗ trợ IE8-9, hãy sử dụng Bootstrap 3. Đây là phiên bản Bootstrap ổn định nhất và nhóm vẫn được nhóm hỗ trợ cho các lỗi nghiêm trọng và thay đổi tài liệu. Tuy nhiên, không có tính năng mới sẽ được thêm vào nó.
http://24htechtrend.com/index.php/bootstrap-la-gi/
Live vs static node lists when querying the DOM.
Tags: javascript, webdev
Published: 2020-05-06 03:24:51

Updating the DOM is very common in web development practices in 2020. Knowing how to use your selectors is even more so.

TLDR;

- Brief overview on `.querySelectorAll` and `.getElementsByClassName`.
- `querySelectorAll` and its not "live" (static) properties.
- `.getElementsByClassName` and its "live" properties. (and whatever that means...).

### The difference between .querySelectorAll and .getElementsByClassName

#### querySelectorAll

This returns a NodeList of non-live nodes using a valid css selector. [More about selectors](https://developer.mozilla.org/en-US/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors).

#### getElementsByClassName

Returns a live NodeList using css class names as your selector.

### What are "live" collections?

Now...we got through the paperwork, we can have some fun.

Live node lists update as the DOM updates, non-live or static node lists do not. For example, if I query the DOM for the same collection, one using `.querySelectorAll` and the other using `.getElementsByClassName`. After I make an update to the DOM, only one node list will reflect the changes and the other will have stale data.

> Can you guess which one it is?

DING DING DING! It is in fact .getElementsByClassName!!!!!
```html
<ul>
  <li class="list-item">One</li>
  <li class="list-item">Two</li>
  <li id="three">Three</li>
</ul>
```

```js
const liveElements = document.getElementsByClassName('list-item');

const notLiveElements = document.querySelectorAll('.list-item');

console.log(liveElements.length); // length of 2
console.log(notLiveElements.length); // length of 2 

document.getElementById('three').className = 'list-item';

console.log(liveElements.length); // length of 3
console.log(notLiveElements.length); // length of 2
```

*NOTICE*, when we added a className to the node with an id of three, the changes were reflected in the node list that we got using `.getElementsByClassName`, but were NOT reflected using `.querySelectorAll`

[Here's a codepen for you to play with and see for yourself!](https://codepen.io/sstern6/pen/QWjqVEQ?editors=1111)

### Parting notes

When using DOM selectors like the one above, please be aware if the node list is live or static. For the sake of this article I'm not recommending using one over the other. What I am advocating for is knowing the consequences of the tools you are using.

If you are in fact using `querySelector` or `querySelectorAll`, don't fret, just simply re-query the DOM to get the latest changes!

Thanks for reading!

Scott

**Resources**
- https://developer.mozilla.org/en-US/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors
- https://codepen.io/sstern6/pen/QWjqVEQ?editors=1111
[PT-BR]DotNetRastreioSearch - Localize objetos nos Correios
Tags: csharp, dotnet, webcrawler, webscraping
Published: 2020-05-06 07:29:26

Publiquei mais um package no Nuget relacionado aos Correios. (o primeiro foi um [package para buscar cep e endereço](https://www.nuget.org/packages/DotNetCepSearch))
Dessa vez, você pode obter o status de algum objeto enviado pelos Correios.
Caso queira conferir, aqui estão os links:
Nuget: 
https://www.nuget.org/packages/DotNetRastreioSearch/
Github:
https://github.com/joao2391/DotNetRastreioSearh
Discussion: How much do you learn about a technology before you apply it?
Tags: discuss
Published: 2020-05-06 07:24:46

My case: I decided to use Redis for a simple in-memory store of job requests. I spend only a few hours to read about Redis data structures and functions, then directly went to coding with Node.JS and a Redis client lib.

My approach seems to be "learn just enough to use it".

How are you approaching new technologies? Do you jump in like me? Do you read the documentation carefully? Do you work through tutorials?
Simple app for downloading Youtube videos
Tags: showdev, webdev, node
Published: 2020-05-06 07:24:04

Hello devs, today I just want to show you the simple app that I built.  I called  <a href="https://savevvideo.herokuapp.com/">SaveVideo</a> and it allows you to enter a URL of Youtube video and you'll get various options for saving the video as, video and audio, only video without audio and only audio. App was bulit with NodeJs and Express.Js 
You can visit my app on this url: <a href="https://savevvideo.herokuapp.com/">SaveVideo</a>.
I know that there are the other apps that work in the same way but anyway it's always good to practice your programming skills.

In the next post, I will post all my code
Project X - A Linux Gateway
Published: 2020-05-06 07:12:19

This is a web project I have slowly planned for months, as a gateway to Linux distributions, something that has not quite been done. I mean we have blogs that you can wait 24 years to get on / pay a boat-load of money to be an instant winner. Those blogs, and let's be honest I mean Distrowatch.com, have their design from 1999 and never updated since. Okay that is a lie, they started 2001 and it took a random click into 2003 to get a more modern look. The point still stands.

# What is Project-X's real name
Currently undecided, and we don't care to have one for quite some time. Even getting the domain and stuff, we will be using the temporary name of "DistroEmporium" but this will not be the official long-term name.

# What is the goal of Project-X
Get a real place where people can find distributions of Linux, BSD, and other OS's. Most of the information and things we will take will come from Distrowatch until we can self sustain.

# How to help with Project-X
If you want to help, contact kai.lyons@kaix.live, that is my email. I will not be yet making a listing on dev.to as I still have a lot of work to deal with before I can ask for more help. 

# Will Project-X have any domains
The only domains planned to be used are the distroemporium.github.io domain and distroemporium.ga (plus we got all the other free domains from Freenom) - DO NOT TRUST ANY:
- Twitter Account
- Website domain that we do not recognize (including if we lose the free ones) in this article. We will make sure to notify if/when we lose domains.
- GitHub page that doesn't have [my Github profile](https://github.com/KaiLikesLinux) as public. Currently on [this org](https://github.com/DistroEmporium)
- Facebook page
- Anything else anywhere else

# When will Project-X be available?
Not known at this time.