teleren/devto huggingface dataset:
How Do I Check If JavaScript Checkbox is Checked?
Tags: javascript, checkboxgroup, checkboxesjavascrip, ifcheckboxchecked
Published: 2020-02-01 19:08:35

---
title: How Do I Check If JavaScript Checkbox is Checked?
published: true
tags: Javascript , checkbox group,checkboxes javascrip,if checkbox checked
canonical_url: https://www.positronx.io/check-if-javascript-checkboxes-checked/
---

The post [How Do I Check If JavaScript Checkbox is Checked?](https://www.positronx.io/check-if-javascript-checkboxes-checked/) appeared first on [positronX.io](https://www.positronx.io).

## How to Manage Checkboxes OnClick in JavaScript?

I am going to show you how can you handle on click event in JavaScript for checking if checkboxes and groups of checkboxes are checked.

Let’s start binding click event to checkbox using JavaScript. To attach an `onclick` event to the checkbox, we need to get the reference of the **HTML checkbox element** using the ID, and then we bind it to JavaScript function.

[Click here to read more](https://www.positronx.io/check-if-javascript-checkboxes-checked/)
She Believed She Could, so Claire Coded
Tags: wecoded
Published: 2019-03-05 18:27:55

---
title: She Believed She Could, so Claire Coded 
published: true
tags: shecoded
---

![Claire-Tolbert-WWCode](https://thepracticaldev.s3.amazonaws.com/i/b915h445fvi9lt786rki.png)


## I continued to code in 2019 because... 
I never want to stop learning. I think every passing moment is an opportunity for growth. 

## I deserve credit for...
Actively pursuing a new position after growing stagnant. I crave mayhem and derive joy from chaos... so I ran towards a fire.

## I hope to see...
Women Who Code DFW continue to flourish. I hope to see more women feeling confident in their technical abilities.
Embedding a survey into app or website
Tags: discuss
Published: 2019-03-05 18:09:54

---
title: Embedding a survey into app or website
published: true
description: What are the best ways to allow people to embed something in their app or website?
tags: discuss
---

Over at kanochart.com we're getting a bit meta and we're doing a [Kano survey about our own service](https://www.kanochart.com/kano/survey/31fe5c76-ba30-49f4-967c-58b210b51f05).

I've noticed that one feature is firmly becoming a "Perform" feature. ("Perform" means: the better we implement it, the more satisfied the customer). That feature is the ability to embed a Kano survey in your own website or app. (Instead of -- as is the case now -- asking your audience to go to kanochart.com to complete the survey).

The only two ways I see to accomplish this are iframes or with an API.

An API has the added advantage that people can do what they want front-end-wise, but it requires coding skills from them and that I write and maintain an API.

Iframes are the easiest solution, but I'm a bit worried about their bad reputation. In the past, iframes were a real pest and a mess.

Should I still be worried about iframes? Are there any other solutions out there?
I'm Nans Dumortier, and I support women devs.
Tags: wecoded
Published: 2019-03-05 17:53:45

## I will advocate for gender equality by...
Doing my best to be a good teammate, being respectful to anyone !

## I hope to see my school/work/developer/tech community...
Having more and more "gender-balanced" teams. People with different backgrounds can bring a lot to a project, and can teach a lot to each other !
The .every() and .some() Array Methods in JS: The Unpopular Pair
Tags: javascript, functional, methods
Published: 2019-03-05 17:47:46

---
title: The .every() and .some() Array Methods in JS: The Unpopular Pair
published: true
description: Two usually forgotten yet handy methods to keep in your bag of tricks
tags: Javascript, FP, Methods
---

When ES5 came out, many handy methods were introduced such as forEach, map, reduce and filter. The .every() and .some() were also introduced back then but are not as popular. I will share with you what they can do for you with some practical examples.

## The Array.prototype.every() method

This method takes a callback function as a parameter and checks whether every single element in the array passes the test implemented in the provided function. It does it by executing the callback function once for each element in the array until it finds one where a falsy value is returned. If a falsy value is found, the method immediately returns _false_. In the other hand, if the callback function returns only truthy values, the .every() method returns _true_.

### Example:

Lets say we want to know whether every person from the `data` array is older than 18 and if every person has a senior level. We can use the .every() method for this:

```js
const data = [
  {
    name: 'John',
    gender: 'M',
    age: 25,
    level: 'mid',
  },
  {
    name: 'Jane',
    gender: 'F',
    age: 24,
    level: 'senior',
  },
  {
    name: 'Grace',
    gender: 'F',
    age: 30,
    level: 'senior',
  },
  {
    name: 'Mike',
    gender: 'M',
    age: 19,
    level: 'senior',
  },
]

console.log(data.every(i => i.age > 18)) // true

console.log(data.every(i => i.level === 'senior')) // false
```

### Combining it with other methods

If for example, you want to know if all females have "senior" level, you can combine the .every() method with the .filter() method. You can first filter out the objects that correspond to a female and then use the .every() method:

```js
console.log(data.filter(i => i.gender === 'F').every(i => i.level === 'senior')) // true
```

### Fun fact

If the .every() method is used on an empty array, it will always return true regardless of the condition given.

```js
console.log([].every(i => i === 'hello')) // true

console.log([].every(i => i)) // true
```

## The Array.prototype.some() method

Similarly to the .every() method, this method executes a call back function for each element in the array. The difference with this one is that whenever it finds a truthy value, it will immediately return _true_ . Consequently, if none of the elements are truthy, it will return _false_.

Using the same `data` as before, lets use the .some() method to determine if there are any "mid" level people and if there are any "juniors" on the `data` array.

```js
console.log(data.some(i => i.level === 'mid')) // true
console.log(data.some(i => i.level === 'junior')) // false
```

Finally we will check if there are any people under 20 years old on the `data` array:

```js
console.log(data.some(i => i.age < 20)) // true
```

Thanks for reading! Hope you found this one useful.
Changing Fill of SVG within an Image tag
Tags: help
Published: 2019-03-05 17:30:00

---
title: Changing Fill of SVG within an Image tag
published: true
tags: help
---

<h3><em>Is there a way to change the fill of a `svg` within an `img src` outside of the svg itself? </em></h3>


e.g.
```
<img src="/images/logo.svg" alt="company logo">
```

I understand that I can simply change the fill within the svg code itself. I also understand if the svg is inline, I can use CSS to change the fill. Currently I am having issues changing the fill within a print style sheet.

<h4>The scenario</h4>
I am using a svg logo that has a 'fill' of white. But I want to swap the fill from white to black on the print stylesheet, so when a client prints a page, the svg actually shows up on white paper.

Adding any css on my print stylesheet does not affect the svg. Is there a way to change the fill purely with CSS, or would I need to reformat how I am referencing the SVG itself, or would I need to use JS?
Nevertheless, Jenn Maher Coded
Tags: wecoded
Published: 2019-03-05 17:26:58

---
title: Nevertheless, Jenn Maher Coded 
published: true
tags: shecoded
---

## I continued to code in 2019 because I finally have a job where I can work on code full time and I get to practice every day.

## I deserve credit for learning to code on my own and continually working on my coding skills.

## I hope to see my tech community become more diverse.
Nevertheless, Olga Telezhnaya Coded
Tags: wecoded
Published: 2019-03-05 17:16:42

---
title: Nevertheless, Olga Telezhnaya Coded 
published: true
tags: shecoded
---

## I started/continued to code in 2019 because

I love it!

## I deserve credit for

Making second Django Girls event in my city in International women's day.

## I hope that more and more women

Will believe in theirselves, I hope the stereotypes in our society will become weaker and weaker. I believe that in one day people will no longer be surprised with one more girl colleague in their tech team.
Nevertheless, Nnenna Ndukwe Coded
Tags: wecoded, nnennahacks
Published: 2019-03-05 16:33:39

---
title: Nevertheless, Nnenna Ndukwe Coded 
published: true
tags: shecoded, nnennahacks
---

### I continued to code in 2019 because...
I've noticed how much I challenged myself and improved my craft in 2018. I am reaping the benefits of what it means to be consistent, persistent, humble, and disciplined in my practice. Coding teaches me about character and I feel privileged to be able to put that to practice, daily, as a Software Engineer at O'Reilly Media!

### I deserve credit for...
Embracing failure and rising above my fear of not being the smartest person in the room. It has made me more receptive to self-evolution, growth, and more positive perceptions of what progress may look and feel like over time.

### I hope to see my developer community...
Continue to advocate for diversity, equity, and respect for every type of individual who is part of the developer community and affected by it.
Online/Offline? Check in a minute!
Tags: angular
Published: 2019-03-04 09:31:57

---
title: Online/Offline? Check in a minute!
published: true
description: 
tags: Angular
---

Here is a small and easy Angular application to check if you are connected to Internet or not!

First thing you need to do is install a package called ng-connection-service in your angular application. Lets see how do we do that.

Create a new Angular application from the CLI using

ng new InternetTest

Install the ng-connection-service package inside the application from the CLI using:

npm install ng-connection-service — save
Once the packages the installed, go to package.json to check if it has been successfully installed.

Inside package.json, you should see,

https://thepracticaldev.s3.amazonaws.com/i/gkk7naosmjxdwtvh9bmc.png


Now that your required packages are installed, go to the component.ts file and import your Connection service like:

import {ConnectionService} from ‘ng-connection-service’;

Let us finally inject the service inside the component. If you are familiar with service, you’d know that to inject a service, we go to the constructor of the component class and inject it as follows:

constructor(private ConnectionService: ConnectionService){
});

To add the functionality of checking the internet connectivity, we use the service’s functions and toggle the value of isConnected property which is initialized to be true by default and the status property initialized to be ‘ONLINE’ by default. See the code below:

https://gist.github.com/NishuGoel/6bba8594c1424327aee172365bf4f75f

Now we finally alert the status of the connection inside the component class and the completed component looks like this:

https://gist.github.com/NishuGoel/cda15ca29331e6af9edb5dce24c8cb9d


Your component html looks like:

https://gist.github.com/NishuGoel/adb00727c2e1a20ae03033f21bb58159

This is how the result looks like:

https://thepracticaldev.s3.amazonaws.com/i/a3elykc5jdqcq2m1jrzk.gif

The demo has been put up on Stackblitz as well. 
Find it here:

https://stackblitz.com/edit/testinternet
Top 5 DEV Comments from the Past Week
Tags: bestofdev
Published: 2019-03-05 14:44:43

---
title: Top 5 DEV Comments from the Past Week
published: true
description: Highlighting some of the best DEV comments from the past week.
tags: bestofdev
cover_image: https://res.cloudinary.com/practicaldev/image/fetch/s--7VrAA2ln--/c_imagga_scale,f_auto,fl_progressive,h_420,q_auto,w_1000/https://thepracticaldev.s3.amazonaws.com/i/qmb5wkoeywj06pd7p8ku.png
---

This is a weekly roundup of awesome DEV comments that you may have missed.  You are welcome and encouraged to boost posts and comments yourself using the **[#bestofdev](/t/bestofdev)** tag.

Chiming in on the **[Habits of a Highly Effective Software Developer](https://dev.to/lauragift21/habits-of-a-highly-effective-software-developer-baj)**, @tonymet provides a great list of tips and habits to try and follow:
{% devcomment 9432 %}

Staying on theme of productivity and efficiency, @anndd shares a suggestion in **[Productivity tools for your MacBook](https://dev.to/teamxenox/productivity-tools-for-your-macbook-46ed)**.  It's always shocked me that acceptable windows management needs external programs like this:
{% devcomment 94cm %}

In response to **[I Can't Do It All: My Burnout Story](https://dev.to/molly_struve/i-cant-do-it-all-my-burnout-story-1e54)**, @rhymes reflects on the wonderful expression of mutual trust within the story:
{% devcomment 94f8 %}

The **[10 years of remote working. This is what I have learned so far.](https://dev.to/mpermar/10-years-of-remote-working-this-is-what-i-have-learned-so-far-21l9)** article is full of hard-won wisdom and insights about remote work.  @joefiorini shares their experience:
{% devcomment 95gd %}

To round out the week, we have a productive follow-up to the **[Understanding the Spread Operator in JavaScript](https://dev.to/vuevixens/understanding-the-spread-operator-in-javascript-485j)** article.  @sleepyfran adds a helpful addendum:
{% devcomment 94a3 %}

See you next week for more great comments ✌
Is there a good way to find out when your article is shared around?
Tags: discuss
Published: 2019-03-05 14:30:58

---
title: Is there a good way to find out when your article is shared around?
published: true
description: I like seeing when people share and comment on my articles, but haven't found a good way to keep track of it.
tags: discuss
---

A couple of my posts have gotten pretty popular and been shared around the internet quite a bit. But I didn't realize how widely they had been shared until I got a surge of views and reactions on an article one day, decided to google for its title and URL, and found a bunch of places that people had shared it.

To be clear, I'm very happy that people enjoy my writing enough to want to share it around! I don't want it to sound like I'm trying to track and prevent the sharing of my content, or anything like that. But I've found a couple cases where stuff I've written has sparked conversation, and I don't want to miss out on that!

(Also, let's be honest, the narcissist in me just wants to find out how much the world loves me. 😎)

Anyhow, I'm wondering whether anyone has found a good way to keep track of when articles you write are shared around without explicitly @ing you on Twitter or something. I'm aware of Google alerts, but (1) I've found them a bit unreliable, and (2) it would be kind of a pain to add a couple Google alerts for every article you issue.

Is there an existing solution for this out there? Any ideas?
Command-line or GUI for dev tools? Some hate the command-line, really? Still? 
Tags: discuss, tools
Published: 2019-03-05 14:18:01

---
title: Command-line or GUI for dev tools? Some hate the command-line, really? Still? 
published: true
tags: discuss, tools
---

The command-line is the place for doing all of my work, however depending on your background dev platform or tools might not be your thing? 

{% twitter 1102656673502642176 %}

As a long time developer, I started as a prompt style developer because that was all there was until [Visual InterDev](https://docs.microsoft.com/previous-versions/visualstudio/visual-studio-6.0/ms950412(v=msdn.10)?WT.mc_id=devto-blog-shboyer) was introduced to me. 

After going through tools like Eclipse for Java, various [Visual Studio](https://visualstudio.microsoft.com/?WT.mc_id=devto-blog-shboyer) iterations for .NET; I found myself getting back to the command-line when node.js hit the development world.

Today, it is rare that I use the mouse to get around in my daily dev tasks. 

* git
* [.NET Core](https://dotnet.microsoft.com/download?WT.mc_id=devto-blog-shboyer) : `dotnet`
* Node.js, JavaScript : `node`, `npm`, `yarn`, `vue`, `ng`
* [Azure](https://docs.microsoft.com/cli/azure/?view=azure-cli-latest&WT.mc_id=devto-blog-shboyer) : `az`
* Docker, Kubernetes : `docker`, `kubectl`

{% twitter 1102657430092165126 %}

If there's a command-line tool, I am all over it and usually writing some handy bash script to make it even easier.

What are your tools of choice?
Which react-redux-thunk boilerplate do you recommend?
Published: 2019-03-05 13:49:25

---
title: Which react-redux-thunk boilerplate do you recommend?
published: true
description: 
tags: 
---

**creact-create-app** is a great starting point for creating a react app, but once you need to add **react-redux** to your project, you have to write a lot of code and repeat this in each project again and again.

I wish there was a create-react-app command that could create an app which includes also the react-redux parts such as a store file, a reducer folder with an index.js in it, action, thunk etc.

Or is there any good boilerplate, which I can use? Which boilerplate do you recommend?

What do you do to minimise writing repetitive code in a react-redux project?
Why serverless?
Tags: discuss, serverless
Published: 2019-03-05 12:45:04

---
title: Why serverless?
published: true
description: 
tags: #discuss #serverless
---

These days I was looking into serverless and it seems very interesting, cool and futuristic but digging deeper I could not really understand if it's worth given the additional effort.
From what I read it seems that it's more difficult to implement, and it's really hard to predict the cost of it given a lot of hidden costs. Of course, there are pros too, highly scalable and u don't have to manage servers etc.
What are your experiences with serverless? Does it actually cost less? is it worth the additional learning and implementation time?
Export Color Palette from Figma to JSX
Tags: tips, javascript, vscode, showdev
Published: 2019-03-05 12:03:50

---
title: Export Color Palette from Figma to JSX
published: true
description: Export Color Palette from Figma to JSX
tags: tips, js, vscode, showdev
cover_image: https://thepracticaldev.s3.amazonaws.com/i/r3lljjrmyx3by8802297.jpg
---

# How to export colors from figma to JSX?

I wrote simple regex that works inside VS CODE. 

1. Select all the colors you want to export
2. Go to the code tab inside figma
3. Copy all the code to the text document in VS CODE
4. Use my regex1 `\/\* (.*) \*\/\nbackground: #(.*);` and in replace `['$1']: '#$2'`
5. Use another regex to wipe out unwanted CSS `position: absolute;\nleft:(.*);\nright:(.*);\ntop:(.*);\nbottom:(.*);\n` and in replace ``

Remember to turn on regex in find and replace in VS Code

It saves like 30 minutes of composing this file for huge color palettes. It is kinda hacky, so please tell me if there is any other method.
GitHub's GraphQL schema visualized
Tags: github, webdev, discuss, showdev
Published: 2019-03-05 10:01:11

---
title: GitHub's GraphQL schema visualized
published: true
description: GitHub GraphQL schema visualized by GraphQL Editor
tags: github,webdev,discuss,showdev
cover_image: https://thepracticaldev.s3.amazonaws.com/i/if6p0hgm7pykt3tlxrpl.png
---

Hi there! 
Check out this short video presenting the GitHub's GraphQL schema size. 
Guess what ... IT'S HUUUUUUUUUUUGE!
{% youtube cvUgq8cGdCQ %}
You can visualize your schema with https://graphqleditor.com/ 


![](https://thepracticaldev.s3.amazonaws.com/i/ah7nakoykjpjn5m0ifkb.gif)
New Analytics App for Linux Logs
Published: 2019-03-05 09:55:02

---
title: New Analytics App for Linux Logs
published: True
description: 
tags: 
---
Take your Linux log data into a new age of log analysis.

While the log management industry is focused on developing advanced search abilities and simplifying log analysis, nobody has been able to resolve the persistent issues of the long, complex and tedious deployments.

Up until today! 
A new Linux app is here to automate the entire log management lifecycle.


"Brought to us by" XpoLog, the app provides an easier and more efficient solution for IT, Security and Operations Administrators.

You can download it free here: https://www.xplg.com/download

What Does Full Automation Mean For Your Linux Logs Analysis?

XpoLog 7 offers an analytics app for Linux logs which uses machine-learning and NLP analysis to automatically highlight critical insights from the collected Linux logs.

Using this app for Linux, logs are collected from all Linux machines and critical insights are highlighted for your attention and are visualized by dashboards and real-time reports. 
-And it takes less than 10 minutes from installation!

Bottom line: 
Discover problems and errors, understand trends, cron activity/ audit/ security insights, login status visualization and more, automatically!
Read These Books if You Want To Be Rich
Tags: money, motivation, inspiration, education
Published: 2019-03-05 09:34:14

---
title: Read These Books if You Want To Be Rich
published: true
description: this article presents a list of books that will help you become rich
tags: money, motivation, inspiration, education
---
The ultimate benefit of reading books is to learn from the author's experience and to avoid the mistakes he/she has made.

This is my favorite list of books that made me rich (of course smart work is the key. To think that when you finish reading a book, 1$Million will fall down on your head)

<b>1- Think &amp; Grow Rich by Napoleon Hill</b>

This is my favorite book. The object of this book is to help you learn the art of changing your mind from failure consciousness to success consciousness. You shouldn't say "I'm poor I can't buy that", instead you should say, how can I make it make me money. In other words, let's say you want a Ferrari car, that car should motivate you to work more in order for you to make extra money.

<b>2- Your Money Or Your Life by Vicki Robin and Joe Dominguez</b>

This book teaches you how to transform your relationship with money. If you understand how money flows, you can hack it.

<b>Related Article:</b> <a href="https://dev.to/hussein_cheayto/how-to-achieve-your-personal-goals-in-12-months-303o">How to Achieve Your Personal Goals in 12 Months</a>

<b>3- FU Money by Dan Lok</b>

Dan Lok is my idol. Fu money = point of true financial liberation. In this book you learn that the following points are just myths:

• Money can’t buy happiness
• Rich people are assholes
• You can afford to wait
• You have to be lucky
• You have to be a cheapskate
• You have to get rich slow
• You have to work hard to make money
• You have to be perfectly ready

<b>4- Rich Dad Poor Dad by Robert T. Kiyosaki</b>

This book is about Robert Kiyosaki and his two dads—his real father (poor dad) and the father of his best friend (rich dad)—and the ways in which both men shaped his thoughts about money and investing.

<b>Related Article:</b> <a href="https://dev.to/hussein_cheayto/get-rich-while-sleeping-j3n">Get Rich While Sleeping</a>

<b>5-How Rich People Think by Steve Siebold</b>

The author has spent 30 years interviewing 1,000 millionaires and billionaires to figure out what distinguished them from the average person. In this book, Siebold offers concrete action steps to follow as an ambitious person in building your own wealth.

This is my favorite list of books when it comes to understand and make money.
What front end framework do you use most?
Tags: framework, developers, frontend, design
Published: 2019-03-05 09:30:06

---
title: What front end framework do you use most?
published: true
description: Budibase is interested to know what front end framework the Dev.to community are using.
tags: framework, developers, front end, design
---

What front end framework do you use most?

Budibase is framework agnostic, but we'd love to know what frameworks the community are using.

Thanks for your responses!