teleren/devto huggingface dataset:
Create a QR Code with Python
Tags: python, qrcode, simple
Published: 2021-09-10 10:57:44

It is first necessary to install the pyqrcode module. You can execute this command by writing it in your command prompt or terminal.

`pip install pyqrcode`

It will take a few seconds to install the module.
We need to create a Python file from which we will generate a QR code. 

**1) Import essential modules.**

`import pyqrcode
from pyqrcode import QRCode`

**2) Create the string that will represent the QR Code.**

`s = "https://khushnoodasif.com"`

**3) The following commands will generate the QR code.**

`qr = pyqrcode.create(s)`

**4) The QR code is generated and stored in a 'qr' variable. The svg file can now be created and saved as "website.svg".**

`qr.svg("website.svg",scale = 7)`

Now that we have the code finished, we can run the program. The program creates a .svg file named "website.svg" in the directory where the python file is located. When you open the file, you'll see a QR code (see the QR code image below). Scan it and you will see the string 's' that points to my website.

**QR Code**

![QR Code](https://raw.githubusercontent.com/khushnoodasif/create-qr-code-with-python/main/website.svg)

I have posted this python file's source code on my [GitHub repository](https://github.com/khushnoodasif/create-qr-code-with-python). Also, check the walk-through on [YouTube](https://youtu.be/N9AT6u3Ey-4).

Thanks for reading!
How to add a string type to function return value in TypeScript?
Tags: typescript
Published: 2021-09-11 00:00:00

---
  title: How to add a string type to function return value in TypeScript?
  published: true
  tags: TypeScript
  date: Sat Sep 11 2021 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/add-string-type-to-function-return-value-typescript
  cover_image: https://melvingeorge.me/_next/static/images/main-cee616d44dae493d6bee511d76cbb807.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/add-string-type-to-function-return-value-typescript)
  
To add `string` type to function return value first, declare the function, then add a `:` symbol (colon) after the parameters opening and closing brackets `()` and then type the word `string` to indicate that the function's return value is of `string` type.

### TL;DR

```ts
// simple function with return
// value of string type
function greet(): string {
  return "Hello!";
}
```

For example, let's say we have a function called `greet()` and on calling the function should return the string value `Hello World!`.

It can be done like this,

```ts
// simple function
function greet() {
  return "Hello!";
}
```

This is fine. But what if we need to enforce that the return value of the `greet` function should only return the value of `string` type. To do that we can add the function return type like this,

```ts
// simple function with return
// value of string type
function greet(): string {
  return "Hello!"; // ✅ allowed
}
```

After defining the return type as a `string`, we must return a value of the `string` type or it may show an error.

Now Let's also try to return a value other than the `string` type like this,

```ts
// simple function with return
// value of string type
function greet(): string {
  return 1; // ❌ not allowed. Type 'number' is not assignable to type 'string'.
}
```

As you can see from the above code the TypeScript compiler is not allowing us to return the value and shows us an error saying `Type 'number' is not assignable to type 'string'.` which is what we want to happen.

See the above codes live in [codesandbox](https://codesandbox.io/s/add-string-type-to-function-return-value-in-typescript-jnd7p?file=/src/index.ts).

That's all 😃!

### Feel free to share if you found this useful 😃.

---
🎬Log In / Sign Up | html & css✨
Tags: html, css, javascript, login
Published: 2021-09-10 23:56:36

Create from scratch a “Responsive Login and Registration Form” using just html, css and JavaScript…



---
{% youtube JbWdz88oi90 %}

---
We’re also going to use @media queries to make it responsive in whatever screen you want display it.

It’s a quite simple project to do, but at the same time it will teach you a lot of cool thing on css like animation, grid and how to make it responsive.
console.log("Hello World! Open Source Development begins");
Tags: opensource, github, senecacollege, browserextension
Published: 2021-09-10 23:47:50

###TD;LR 
I am Ritik Bheda, a student interested to learning more about browser extensions and Open Source Development. So, I choose Redefined GitHub project to explore the area.

##Introduction
Hello World, I am Ritik Bheda. My ethnicity is Indian, and I was born and bought up in India, later moved to Canada in 2019. I am currently in Brampton, Ontario. JavaScript and C++ are my favorite programming languages. One of them being new, easy, and ever booming and the other gives me the exact sense and logic behind writing code in any language brings my love to these programming languages. People I have met think of my personality as a person who tends to learn and explore new technology but never missing the base idea/motivation that brought it.
##Open Source
I am very excited to study this course as it is going to be my first step in the Open Source Community where I always wanted to contribute to and be a small part of a big project. Open Source development also helps networking and sharing of ideas around the globe while Closed Source development is confined to a team and learning is limited to the team members. Open source development would give the overall development experience without any firm commitment. My main goal in this term is get a near industry experience. I think browser extensions have very bright potential in future and which is why I want to contribute to its Open Source and get experience in the field. 

##Project I want to contribute to
I was searching for a browser extension project on GitHub and I came across many but I choose [Redefined GitHub](https://github.com/sindresorhus/refined-github). Redefined GitHub simplifies GitHub interface and adds useful feature(on the browser!!). Some of its features I find amazing are, it adds a button to revert the changes in a file in a PR, shows the associated pull requests on branches for forked repositories, adds a button to copy all the file contents and much more! The extension has developed quite enough and still has a lot of room to develop which attracts me to join the community and contribute to it. Working on this project will help me to get experience on browser extensions, git & GitHub and, how medium sized projects go large. 
{% github sindresorhus/refined-github %}

##Lets Connect
and discuss ideas and tech! Find me online
*[GitHub](https://github.com/ritikbheda)
*[LinkedIn](https://www.linkedin.com/in/ritik-bheda-04920318b/)
13 project ideas for frontend dev
Published: 2021-09-10 22:58:59

## 10 project ideas that will help you to evolve your programming skills
+ covid tracker 
+ note app
+ e-commerce store
+ typing test speed 
+ netflix clone
+ random quotes app
+ books store
+ chat app
+ quiz game
+ Social Network
+ hangman
+ spotify clone
+ blog

## awesome libraries to use in the project
+ styled-components
+ react-leaflet
+ material-ui
+ font-awesome
+ axios
+ react-select
+ react-google-login
+ react-facebook-login
+ firebase
+ redux
+ numeral
+ react-icons
+ socket.io
+ bootstrap
+ tailwindcss
+ node-sass
+ quilljs
+ react-avatar

have a good day
Meu Boilerplate Fullstack
Tags: react, node, boilerplate, fullstack
Published: 2021-09-10 22:48:34

Nos últimos tempos em praticamente todos os meus projetos, tenho utilizado Reactjs para as minhas aplicações Front-end e Nodejs para os meus serviços Back-end. E para otimizar o processo de setup, criei boilerplates para facilitar e agilizar o início dos meus projetos.

Divido aqui com a comunidade meus repositórios de template, e agradeço qualquer comentário, e sugestões de melhorias que quiserem enviar.

[Reactjs boilerplate](https://github.com/vinisaveg/react-future-boilerplate)

[Nodejs boilerplate](https://github.com/vinisaveg/node-future-boilerplate)

Happy Coding! 🙂
OSD-600 Introduction
Tags: opensource
Published: 2021-09-10 22:25:02

 Hello everyone, my name is Jory Macneil. I am currently in my (hopefully) last semester of the CPA program at Seneca. 

 I decided to take this course because I have been interested in Open Source programming for a while. What interested me about Open Source is how so many people can work on and contribute to a project. I am currently living in Toronto but am going to travel to Ireland in November to see family. I am hoping to be able to learn more about how open source projects work and be able to make meaningful contributions to open source projects. Some open source projects that interest me are ones that provide a free version of a premium software. For example GIMP is a free open source version of Photoshop. 

 The trending repo I decided to research was freqtrade.https://github.com/JoryMacNeil/freqtrade. Freqtrade is a crypto trading bot that also has money management tools as well as strategy optimization by machine learning. I choose this project because I have been interested in crypto currency for half a decade and hopefully with freqtrade's strategy optimization and money management tools I lose a little less money the next time I decide to invest in crypto currency.
Day 449 : Just Another Day
Tags: hiphop, code, coding, lifelongdev
Published: 2021-09-10 21:55:26

_liner notes_:
- Professional : Could not really focus today. Not sure if it's because of the issues I was having with my package not arriving and getting the run around, but I only did some more clerical tasks like make sure my Jira tickets where updated. My mind kept going to where is my package. May have to do a little work this weekend so I feel better, haha. At least there's Sundays at https://untilit.works .

- Personal : So when my package didn't show up last night, I called the delivery company, because their website changed from deliver by 8pm to end of day. Riiiight...so I had to escalate it to a manager who said he would get it delivered between 8am and 10:30pm. Turns out he was lying, because I called in the morning and they were telling me it would get here by the end of the day. Nothing noted about having it delivered in the morning. Spoke with another manager, said they would call when the package was headed my way so I wouldn't waste yet another day waiting. As you may have guessed, nope, no call. At least I got my package. I can worry less until the other half of my order is sent. haha.

![A chain of islands covered in green trees with some beaches in Palau, Oceania in turquoise blue water](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7tgj57ho7o9eozqawkav.jpg)

The plan for tonight is to finish up prepping the radio show, and set up the new device I ordered. Happy I at least got it before the weekend, because I would have to wait til Monday even though it wasn't my fault the package was late. It's here and I can sort of relax more. It sounds like it's about to RAIN! Just another day in Florida. haha

Have a great night and weekend!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube tXWT92VL4js %}
Myth: Prefers reduced motion means no motion
Tags: a11y, webdev
Published: 2021-09-10 21:46:12

---
title: Myth: Prefers reduced motion means no motion
published: true
description: There are many misconceptions surrounding Web Accessibility, most of the times fueled by lack of knowledge (or interest) in the matter. This article is a collection of some of those accessibility misconceptions or myths.
tags: a11y,webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5hehcxw23j2eoyq2n2ep.jpg
canonical_url: https://alvaromontoro.com/blog/67989/myths-about-web-accessibility#prefers-reduced-motion-means-no-motion
series: Myths about Web Accessibility
---

<aside><blockquote><small><strong>There is an <a href="https://dev.to/alvaromontoro/myths-about-web-accessibility-237k">all-in-one article including every part from this series</a> (if you want prefer to read it all at once instead of "by installments")</strong></small></blockquote><hr/></aside>

This is more of developers' good intentions based on a misconception. We (myself included) found an option to reduce motion, and we "brute-force" our way through it, cancelling all transitions and animations like this:

```css
@media (prefers-reduced-motion) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}
```

Not everything is black or white. There are many shades of grey, and not all animations and transitions are bad. [Some of them are worse than others](https://alistapart.com/article/designing-safer-web-animation-for-motion-sensitivity/).

We don't need to cancel every motion on a website. Instead, we need to think through them, check what's appropriate and not, and provide an expanded/animated experience for everybody.

In An Event Apart, [Val Head had a great presentation about accessibility and animation](https://aneventapart.com/news/post/making-motion-inclusive-aea-video). In the video, she explains different animations and transitions and which ones are better when trying to avoid triggering a negative reaction: color changes, opacity fades, small movements...

Also, related to this myth, reduced motion applies to more than just animations and transitions: background videos, animated GIFs, or scroll behavior are examples of things that need changes when the user opted for reduced motion. So let's not forget them.
Myth: HTML is accessible by default
Tags: a11y, webdev
Published: 2021-09-10 21:41:43

---
title: Myth: HTML is accessible by default
published: true
description: There are many misconceptions surrounding Web Accessibility, most of the times fueled by lack of knowledge (or interest) in the matter. This article is a collection of some of those accessibility misconceptions or myths.
tags: a11y,webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5hehcxw23j2eoyq2n2ep.jpg
canonical_url: https://alvaromontoro.com/blog/67989/myths-about-web-accessibility#html-is-accessible-by-default
series: Myths about Web Accessibility
---

<aside><blockquote><small><strong>There is an <a href="https://dev.to/alvaromontoro/myths-about-web-accessibility-237k">all-in-one article including every part from this series</a> (if you want prefer to read it all at once instead of "by installments")</strong></small></blockquote><hr/></aside>

We've heard many times developers say, "_HTML is accessible out of the box_," almost as if the definition of HTML in the dictionary was:

> **HTML**
> _Accessible._

But that is not always the case. There are HTML elements that are not accessible by themselves or may present challenges to the users.

For example, elements like [`<video>` or `<audio>` have controls that are not fully keyboard-accessible](https://developer.mozilla.org/en-US/docs/Learn/Accessibility/Multimedia) and that differ considerably from browser to browser and cause frustration. Or the `<input>` element has many types that open pop-ups, which may not be accessible for everyone.

There are many components and structures that are not native HTML elements (e.g., tab panels), and once we start combining HTML, accessibility issues may pop up from the interaction.

The definition of HTML in that imaginary Hitchhiker's Guide to the (Web) Galaxy should be updated to something more appropriate:

> **HTML**
> _Mostly accessible._

That looks much better, and it is definitely more accurate to reality.
Myth: Overlays are enough to ensure Web Accessibility
Tags: a11y, webdev
Published: 2021-09-10 21:40:59

---
title: Myth: Overlays are enough to ensure Web Accessibility
published: true
description: There are many misconceptions surrounding Web Accessibility, most of the times fueled by lack of knowledge (or interest) in the matter. This article is a collection of some of those accessibility misconceptions or myths.
tags: a11y,webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5hehcxw23j2eoyq2n2ep.jpg
canonical_url: https://alvaromontoro.com/blog/67989/myths-about-web-accessibility#overlays-are-enough-to-ensure-web-accessibility
series: Myths about Web Accessibility
---

<aside><blockquote><small><strong>There is an <a href="https://dev.to/alvaromontoro/myths-about-web-accessibility-237k">all-in-one article including every part from this series</a> (if you want prefer to read it all at once instead of "by installments")</strong></small></blockquote><hr/></aside>

This is more a misconception among executives and people who make decisions about buying these types of solutions. The consensus in the Accessibility community is almost unanimous: overlays don't work. [None of them fully work](https://overlayfactsheet.com/).

An overlay is an automated technology aimed at improving the accessibility of a website. It may come in many flavors: plug-ins, add-on libraries, toolbars, widgets... but their functionality is similar: modify the page's source code on the fly and repair the non-accessible code, replacing it with an accessible version. Something really tempting at an affordable price and with just a single line of JavaScript.

One line of JavaScript does not make a website 100% accessible. In some cases, the results may even be damaging. And all for just a little benefit, as people with disabilities already use tools that fix many of the issues that the overlays claim to fix.

As we mentioned in a previous section, there is no one-size-fits-all solution for Web Accessibility. And that's exactly what overlays try to be.

Things may change. While accessibility overlays may not be enough to ensure Web Accessibility at the moment, with the advances in AI and machine learning, they might become an alternative in the future. But currently, they aren't a solution.
Myth: Accessibility is expensive
Tags: a11y, webdev
Published: 2021-09-10 21:35:33

---
title: Myth: Accessibility is expensive
published: true
description: There are many misconceptions surrounding Web Accessibility, most of the times fueled by lack of knowledge (or interest) in the matter. This article is a collection of some of those accessibility misconceptions or myths.
tags: a11y,webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5hehcxw23j2eoyq2n2ep.jpg
canonical_url: https://alvaromontoro.com/blog/67989/myths-about-web-accessibility#accessibility-is-expensive
series: Myths about Web Accessibility
---

<aside><blockquote><small><strong>There is an <a href="https://dev.to/alvaromontoro/myths-about-web-accessibility-237k">all-in-one article including every part from this series</a> (if you want prefer to read it all at once instead of "by installments")</strong></small></blockquote><hr/></aside>

Is it expensive in time? Expensive in money? Both of them? Either way, it is a dubious claim that can be heard towards the end of projects in which they did not consider Web Accessibility at the early stages... which makes it expensive! Teams will have to work on issues after the fact, rebuilding the solution (almost from scratch in some cases), which will waste time and money. Something that they could have avoided if they had implemented accessibility at the start.

If you have a car and the oil light goes on, you change the oil. It will take you a few minutes, either done by yourself or at the shop, and it will cost you just a few bucks. However, if you don't change the oil, chances are that your engine will seize up and break down after a while. The repair will be in the hundreds (or thousands) of dollars, and it will require a mechanic using special tools and parts. Not to mention that the car will be off-service for days or weeks.

<figure>
![A car with the hood up while a man looks inside](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d9htrxkmdirxbj3g2kl1.jpg)
<figcaption>Don't blame the car! You drove with the oil light on for 50 miles! (picture: <a href="https://www.pexels.com/photo/repairing-a-car-6078/">
Kaboompics</a>)<br/>&nbsp;</figcaption>
</figure>

**If you apply Web Accessibility at the right time (at the start of a project), it will cost less in the long run and save many headaches and stress to the team**. But if you wait to do it until you have to (e.g., after users complain or you get a lawsuit), then it will be expensive and painful. In addition, it will require specialists and be time-consuming.

Taking into consideration that [people with disabilities have a purchasing power of 1.3 trillion dollars](https://www.ruhglobal.com/disability-influences-trillion-dollars-david-perez/) (over [8 trillion including relatives and friends](https://www.computerworld.com/article/2701645/8-trillion-reasons-to-make-your-technology-accessible.html)), maybe it's time to stop talking about Web accessibility as an expensive feature, and start presenting it as a profitable one.
Myth: Automatic tests are enough for accessibility
Tags: a11y, webdev
Published: 2021-09-10 21:40:03

---
title: Myth: Automatic tests are enough for accessibility
published: true
description: There are many misconceptions surrounding Web Accessibility, most of the times fueled by lack of knowledge (or interest) in the matter. This article is a collection of some of those accessibility misconceptions or myths.
tags: a11y,webdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5hehcxw23j2eoyq2n2ep.jpg
canonical_url: https://alvaromontoro.com/blog/67989/myths-about-web-accessibility#automatic-tests-are-enough-for-accessibility
series: Myths about Web Accessibility
---

<aside><blockquote><small><strong>There is an <a href="https://dev.to/alvaromontoro/myths-about-web-accessibility-237k">all-in-one article including every part from this series</a> (if you want prefer to read it all at once instead of "by installments")</strong></small></blockquote><hr/></aside>

Automated testing for accessibility is possible and highly recommended. But it is not a replacement for manual testing: automatic tests only [detect ~30% of the issues](https://alphagov.github.io/accessibility-tool-audit/index.html).

Even if we can simulate a user's behavior with the keyboard and tab, check for color contrast, or a specific HTML structure, there are still tests that we cannot automate and behaviors that we cannot simulate. Thus, limiting the capacity of what automated tests can do.

This is not to say that we should drop automatic accessibility tests. On the contrary, we should embrace them and use them in all our projects. It is important to remember that they complement and not replace good old manual testing.