teleren/devto huggingface dataset:
How to learn Reactjs?
Published: 2023-09-23 17:43:58

Complete guide to learn React JS
***What do we need to know in advance to learn React?**
1. Basic knowledge of HTML, CSS, and JavaScript.
2. Must have a good understanding of some ES6 features of Javascript. For example-
a) Let and Const; b) Arrow Functions; c) Class and 'this' keyword etc.
.
You should learn React with a good understanding of the following topics in bold: (Variables; if/else conditions and switch statements; Difference between var, let & const; Functions; Arrays; Array methods like filter, map, reduce etc.; ES6 Concepts; Promises; Callbacks; Async/await; Classes and OOPs Concepts; Working with APIs
3. Must have a good understanding of Nodejs basics.
4. Must know the proper use of code editor.
Some important topics we need to understand well to learn ReactJS-
1. Component architecture: One of the good things about React is that it is component-based, allowing developers to break complex code into smaller parts, i.e. components, and help developers organize their code better.
2. State: State actually holds synchronous variables, suppose you change a State, then all the places where those specific variables are there will be changed.
3. Pops: This is exactly as the argument is passed to the function.
4. JSX: JSX, or JavaScript Expressions, is a syntax extension to JavaScript written for use with React. JSX is a technology that allows you to describe how a user interface will appear on a website.
Also, have a clear concept about several other things-
(5. Styling(CSS) in React; 6. Learn how to connect to APIs with React apps; 7. Functional Components, Class Components; 8. Lifecycle Methods; 9. Handling events; 10. Form; 12. Conditional Rendering; 13 Context 14. Hooks; 15. Higher Order Components; 16. Code Splitting
**How long does it take to learn React?
- It may take you one to six months to learn React. How much time it takes will depend on your experience in web development and your dedication.
**Is learning React difficult?
-If you have basic knowledge of HTML, CSS, and JavaScript, learning React is not difficult at all given regular time. The more connected you are with web development, the easier it will be for you to learn React. And learning one framework well makes learning other frameworks easier.
** Where to learn React?
The number one way to learn React is to read the React Documentation. w3school, frecodecamp also has a lot of free content on YouTube - you can learn from there if you want. There are also several paid courses - udemy in English, codecademy teach React very well. Apart from this, React is taught from the very beginning in Programming Hero's web development course in Bengal where some full projects are also shown on React.
40.41% of websites worldwide are now being developed with React with a growing rate of 22%, so those who want to learn React should start soon without delay. Resources are now sufficient - you just have to make decisions and jump in. Best wishes to all.
DAY 1 Js
Published: 2023-09-23 17:35:14

## **How to import JS in HTML**

```
<script src="app.js"></script>
```

**defer**
attribute in script tag to ensure the HTML page loads before the js file or we can add the the script tag below the HTML file


## **How To import and Export in js**

exportfile.js
```
export const apiKey="ASZFWXWFWGBWFKKG"
```

importfile.js

```
import {apiKey} from "./exportfile.js"
```

OR

By using the default method only one value can be exported from the file. you can give any name for the imported variable

exportfile.js
```
export default "ASZFWXWFWGBWFKKG"
```
importfile.js
```
import apiKey from './exportfile.js'
```
OR

**Grouping**
 
But you can have both in single file

exportfile.js
```
export default "agsdgadsh";
export const data="1234";
export let admin = true;
```

importfile.js
```
import * as exp from './exports'
console.log(exp.default)
console.log(exp.data)
console.log(exp.admin)
```
How to create rss feed of new updated pdf file on website that has no service of rss to e-mail
Tags: beginners, html, productivity, tutorial
Published: 2023-09-23 17:28:59

I'm the user of program than developer. Can anyone suggest how to create rss feed of new updated pdf file on website that has no service of rss and any audience is allowed to see updated pdf file? I would like to make my working life more automated to save time of routine work by feeding new updated file from source website to my email or at least getting notification to know when there's new file uploaded on specific website. Can anyone suggest the simplest way to do it? For example, how to get feed of new updated file or notification once new file is uploaded to personal email or feed on MS outlook instead of browsing this website many times to see if it's updated and it wastes time when we can't find any updated on target website. Here is example of target website https://www.ons.gov.uk/economy/nationalaccounts/balanceofpayments/datasets/uktradecountrybycommodityexports/current

Johann
Cache busting in Angular for static assets
Published: 2023-09-23 16:32:39

In general, there might be very different solutions to that problem, but try the following way:

* Install npm package [@sitelintcode/angular-static-assets-hash](https://www.npmjs.com/package/@sitelintcode/angular-static-assets-hash).
* We'll use the CLI command `npx createAngularStaticHashes`.
* By default, the package searches for static assets in the folder `[angular root]/assets/images`, but you can set any location through the parameter `--staticAssetsPath=[path to static assets]`.
* The package gathers a list of all files from a given location, but you can change that by adding the parameter `–-globPattern=[glob pattern]`. Default: `/**/*`

Once the file `assets.json` is created:

```
{
  "assets/images/example.png": "iY5RY0G8wePLPRkZSTgW2XYZFZ7kQOqXoJTFpQFG5nI",
  "assets/images/avatar.svg": "7A7qFs_iOghsdUtLG-7y-5cxT3FC8S_BRXl5ldsNY7Y",
  "assets/images/body-background.svg": "K2FTBtDsxgKLQFr4BUW1ptnLWqPCKPyGypHCBTfcctQ",
  "assets/images/icons.svg": "Ka-ngr7Fht6ucmN03kzJeMN7f2iOtnkD-D63QJ01jhM"
}
```

then you need to use it in your app through the Angular Pipe.

The final URL for the static asset should contain unique URL parameter that forces the browser to fetch the latest file.

Example: `<img src="assets/images/example.png?c=Ka-ngr7Fht6ucmN03kzJeMN7f2iOtnkD-D63QJ01jh" alt="Example image">`

See further information's in the article "[Cache busting in Angular for static assets](https://www.sitelint.com/blog/cache-busting-in-angular-for-static-assets/)".
The Ultimate Software Testing Glossary: Your Feedback Needed!
Tags: testing, beginners, learning
Published: 2023-09-23 16:05:44

## Introduction

Every so often, we stumble upon challenges that push us to create solutions. For me, that challenge was identifying a singular, detailed, and comprehensive reference for software testing terms. While there are numerous resources available, most seemed either incomplete or lacking in depth. Driven by this, I've combined insights from ChatGPT and my personal notes to craft what I believe is the most thorough glossary dedicated to software testing. However, this is just the beginning, and I'm reaching out to the vibrant Dev.to community to make this resource even better!

### Dive Into The Glossary

Curious about what's inside? Here's the link: [Software Testing Glossary](https://ray.run/glossary)

## How You Can Help

Your expertise is invaluable. To ensure the glossary is as valuable as possible, I've incorporated a feedback mechanism. Every term comes with a "Was this helpful?" form that will gather your insights.

You might wonder, "Do I need to review all 184 terms?" The answer is no. Simply browse and if something stands out or needs correction, do let me know. Every piece of feedback, whether minute or significant, can lead to a richer and more refined resource.

### What's On The Horizon?

To give you a glimpse of what I'm planning next:

- **Wikipedia Links:** Enhancing each term with a relevant Wikipedia link for deeper insights.
- **Synonyms:** Including alternative terms to make searches more user-friendly.
- **Category Tags:** Classifying each term under relevant categories (e.g., automated testing, manual testing) for streamlined navigation.
- **Interactive References:** Anytime these terms are cited in https://ray.run/ articles, users will have the convenience of hovering over the term to view its definition.

## Let's Co-create

I've laid the foundation, but with your insights and suggestions, we can elevate this glossary to new heights. What features or improvements would make this your go-to reference in times of need? Let's collaborate and create a tool that benefits us all!

Looking forward to your invaluable feedback and suggestions!
Touchpad Not Working While Charging? Here’s How I Solved It in 5 Minutes
Tags: laptop, touchpad, resolved, hardware
Published: 2023-09-23 16:02:00

I had been quite frustrated with an issue on my Lenovo laptop for the past few days - my touchpad would cease to function whenever I plugged in the charger. Thankfully, I managed to resolve this problem today. 

Before we get started, make sure you have an external mouse on hand. If you don't already have one, it's essential, as you won't be able to use your touchpad without it. Now, assuming you have your mouse, let's proceed:

**Step 1:** Open the Control Panel.


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

**Step 2:** Within the Control Panel, locate and click on "Device Manager."

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

**Step 3:** In the Device Manager, you will see an option labeled "Human Interface Devices." Click on it.

**Step 4:** Within "Human Interface Devices," look for the option that reads "HID-compliant touchpad." Click on it.

**Step 5:** A new window will appear. Click on the "Driver" tab, which you'll find in the menu bar.

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

**Step 6:** In the Driver tab, you'll find various options. Firstly, check whether your touchpad driver is up to date. Often, this issue occurs when the driver is outdated.

**Step 7:** If your driver is up to date and the problem persists, you can try the following steps: 

   - Click on the "Disable Device" option.
   - Now, connect your external mouse.
   - Using the external mouse, re-enable the touchpad.
   
**Step 8:** Restart your laptop.

Following these steps should resolve the issue, and your touchpad should work as expected. If you found this solution helpful, please consider sharing it with anyone you know who might be facing a similar problem. Thank you for reading!
Generate Truly Random Numbers Using Quantum Random Number Generator
Tags: python, security, programming, coding
Published: 2023-09-23 15:50:00

## Hi 🙂🖐

In this post, I will share with you How To Generate Truly Random Numbers Using Quantum Random Number Generator.



{% embed https://www.youtube.com/watch?v=-WxlBHgrJMI %}

**Introduction**

Random numbers are a fundamental part of many computer programs. They are used to generate simulations, generate passwords, and even to play games. However, generating truly random numbers can be difficult.

Traditionally, random numbers are generated using pseudorandom number generators (PRNGs). PRNGs are algorithms that produce a sequence of numbers that appear to be random. However, PRNGs are not truly random. They are based on a deterministic algorithm, which means that if you know the initial state of the PRNG, you can predict the next number in the sequence.

Quantumrandom is a Python library that provides a way to generate truly random numbers using quantum mechanics. Quantum mechanics is a branch of physics that deals with the behavior of matter and energy at the atomic and subatomic levels. Quantum mechanics is inherently random, which means that it is impossible to predict the next number in a quantumrandom sequence.


**Generating Random Numbers With quantumrandom**

For example, the following code generates a random number between 0 and 255:

```python
import quantumrandom

random_number = quantumrandom.randint(0, 255)
print(random_number)

```
## result

```
211.25291828793775
```

**Conclusion**

The quantumrandom library provides a way to generate truly random numbers in Python. Quantumrandom is based on quantum mechanics, which is inherently random. This means that quantumrandom numbers are truly unpredictable.

The quantumrandom library is a valuable tool for generating random numbers. It can be used for a variety of purposes, including simulations, generating passwords, and even to play games.

**Now we're done 🤗**

**Don't forget to like and follow 🙂**

**Support me on PayPal 🤗**
https://www.paypal.com/paypalme/amr396
A journey with Markdown support: A contribution to an Open Source
Published: 2023-09-23 15:39:45

Open source project participation can be both thrilling and intimidating. This blog article describes the procedure, difficulties encountered and the lesson which I have gained while making a code modification to an Open Source Project.

**[TIL-Markdown2](https://github.com/Vishnudas2003/TIL-Markdown2)**

The project I has chose for making he contribution is "TIL-Markdown2". It is a command line tool designed to convert "Today I Learned(TIL) posts written in the Markdown to HTML. The application could convert plain text (.txt) files into HTML, but it was unable to handle Markdown (.md) files. It was my aim to update the TIL Converter so that it could also handle Markdown files and translate Markdown syntax into HTML.

**The Initial Setup**

- Fork the repository
- Clone the Fork
- Create a New Branch
- Implement Markdown Support

**Filing an Issue**
I have created an issue on GitHub repo to suggest the functionality and get comments before going into the coding. 
Adding Markdown Support #issue-5 was the issue's title and it has the explanation of the necessary changes need to make. I also expressed my readiness to participate and asked for clarification on the project owner's preferred method for implementing the feature.

**The Pull Request**

- Push to Fork

- Create Pull Request

- PR Description:

1. I gave the PR description a concise title, "Add initial support for Markdown," and a detailed explanation of my improvements. I linked the PR to the original issue using the "Fixes #5" phrase.

- Review and Submit

As I engaged on the TIL Converter, I proposed Markdown support and gained important knowledge about teamwork, efficient communication, and manually implementing code. I anticipate having more open source adventures and developing my coding abilities.
Quantum Computing
Published: 2023-09-23 15:31:18

Quantum computing is a complex and rapidly evolving field that leverages the principles of quantum mechanics to perform certain types of calculations much faster than classical computers. Here's a simplified overview of how quantum computing works:

1. Qubits: The fundamental unit of quantum computing is the quantum bit, or qubit. Unlike classical bits, which can only be in a state of 0 or 1, qubits can exist in multiple states simultaneously due to a phenomenon called superposition. This allows quantum computers to explore many possible solutions to a problem at once.

2. Entanglement: Another key concept is entanglement. When qubits are entangled, the state of one qubit is intrinsically linked to the state of another, regardless of the physical distance between them. This property enables quantum computers to perform certain calculations that would be impossible for classical computers.

3. Quantum Gates: Quantum computers use quantum gates to manipulate qubits. These gates are analogous to classical logic gates but operate on quantum states. Quantum gates can perform operations such as flipping the state of a qubit, creating entanglement, or applying various transformations.

4. Quantum Algorithms: Quantum algorithms are designed to take advantage of the unique properties of qubits, like superposition and entanglement, to solve specific problems more efficiently than classical algorithms. For example, Shor's algorithm can factor large numbers exponentially faster than classical algorithms, which has implications for breaking some encryption schemes.

5. Quantum Measurement: When a quantum computer performs a measurement, it collapses the superposition of qubits into a specific state (0 or 1) with certain probabilities. The result of the measurement provides the output of the computation.

6. Error Correction: Quantum computers are extremely sensitive to environmental disturbances, which can introduce errors into calculations. To address this, researchers are working on quantum error correction codes to make quantum computers more reliable.

7. Quantum Hardware: Quantum computers are built using various physical systems, including superconducting qubits, trapped ions, and photonic qubits. Each type of quantum hardware has its own advantages and challenges.

It's important to note that quantum computers are not simply faster versions of classical computers for all tasks. They excel in specific areas, like factoring large numbers, simulating quantum systems, and optimizing certain complex problems. For many everyday computing tasks, classical computers remain more practical and efficient.
Var vs Let vs Const
Tags: webdev, javascript, programming, coding
Published: 2023-09-23 15:17:14

If you're new to JavaScript, you've probably come across three ways to declare variables: var, let, and const. These might seem like just different ways to do the same thing, but they have some crucial differences that can affect your code. Let's dive into the world of JavaScript variable declaration and understand when to use each one.

## Var
var used to be the only way to declare variables in JavaScript until ES6 (ECMAScript 2015) introduced let and const. While var is still valid, but it comes with some quirks that make it less preferred in modern JavaScript development.

## Scope: Functional
Variables declared with var have a functional scope, which means they are function-scoped. This can lead to unexpected behavior if you're not careful.

`function example() {
  if (true) {
    var x = 10;
  }
  console.log(x); // Outputs 10, even though 'x' was declared inside the 'if' block.
}
`

## Hoisting

Variables declared with var are hoisted to the top of their containing function or global scope. This means you can use them before they are declared, which can be confusing.

`console.log(y); // Outputs 'undefined'
var y = 5;
`

## let
let was introduced in ES6 to address some of the issues with var. It has a block scope, making it easier to predict where a variable is accessible.

## Scope: Block
Variables declared with let are block-scoped, which means they are limited to the nearest enclosing block (usually denoted by curly braces {}).

`function example() {
  if (true) {
    let x = 10;
  }
  console.log(x); // Throws an error: 'x' is not defined
}
`
## No Hoisting
Unlike var, variables declared with let are not hoisted. You can't use them before they are declared.

`console.log(z); // Throws an error: Cannot access 'z' before initialization
let z = 5;
`
## const
const, also introduced in ES6, is used to declare constants. Once you assign a value to a const variable, you can't change it.

## Scope: Block
Like let, const is block-scoped. However, the value it holds is immutable.

`if (true) {
  const pi = 3.14;
  pi = 42; // Throws an error: Assignment to a constant variable
}
`
## When to Use Each
Use const when you want to declare a variable that should never change its value.

Use let when you need to reassign a variable.

Avoid using var in modern JavaScript unless you have a specific reason to use it.

In modern JavaScript, it's generally recommended to use let and const because they provide better control over variable scope and immutability. This helps prevent bugs and makes your code easier to maintain.

So, remember: var is old-school, let is versatile, and const is for constants. Choose the right tool for the job to write clean and reliable JavaScript code.

Happy coding!
The early days of open source
Tags: webdev, javascript, programming, opensource
Published: 2023-09-23 15:02:02

Ah, the good ol’ days of open source. Let's take a trip back in time, shall we? The idea of open source software, where anyone and everyone could contribute, was nothing short of revolutionary. Picture a world before Google, Facebook, or even smartphones. That's where it all began.

🔍 Remember Linus Torvalds? The young guy from Finland? In 1991, he kickstarted this whole movement by releasing the Linux kernel. He casually dropped it on the internet like, “Hey, here’s this thing I made. Thoughts?” The tech world went *nuts*! Today, Linux is the backbone for many systems worldwide.

🌉 Then there was the iconic battle: Netscape vs. Internet Explorer. Netscape took the bold step of open sourcing their browser in 1998, which eventually evolved into Firefox. A phoenix rising from the ashes, Firefox showed the world the true power of collaboration.

Big enterprises weren’t far behind. IBM, a titan of the tech world, threw in a whopping $1 billion in support of Linux in 2000. Fast forward, and companies like Google and Microsoft are now some of the biggest contributors to open source projects. Oh, how times have changed!

✨ **Speaking of Changing Times...** ✨

Do you love React? Well, there's something bubbling up that you'll *definitely* want to know about: Meet [Webcrumbs](https://github.com/webcrumbs-community/webcrumbs). Envision WordPress, but for React. It's a plug-in registry for React that you can manage *without* writing a single line of code. Cool, right?

💬 Want to be part of this game-changer? Join the [discussion](https://github.com/webcrumbs-community/webcrumbs/discussions) and shape its future! And hey, if you love the idea (we bet you will!), don’t forget to give it a ⭐ on GitHub. Every star counts!

So, from the humble beginnings of open source to the exciting innovations like Webcrumbs, the journey is never-ending. With passionate contributors like *you*, the sky's the limit! 🚀