teleren/devto huggingface dataset:
Full-Stack Youtubers to Follow 🏃 — From Beginner Expert
Tags: youtube, educational, react, node
Published: 2020-09-18 06:22:03

# Everyone Starts Somewhere

Everyone single one of us had a beginning. Learning to code can be tough and frustrating. My journey started in 2014 when I learned about a youtube channel that would change my life forever. This is a life of the Youtubers that guided me along in discovering new technologies and learning them from the ground up.

This list does not in anyway reflect the order of my least and most favorite.

### #1 [TheNewBoston](https://www.youtube.com/user/thenewboston)
![Alt Image](https://puu.sh/GtSJo/b02f995cb8.png)
I guess you could say `Bucky Roberts` introduced me to Web Development. For the longest time I'd follow every single one of his videos and frankly he deserves everything that has brought be to where I am today.

### #2 [Codecourse (Formally Php Academy)](https://www.youtube.com/user/phpacademy)
![Alt Image](https://puu.sh/GtSM8/8b7012a3c5.png)

### #3 [adamthedev](https://www.youtube.com/c/adamthedev/videos)
![Alt Image](https://puu.sh/GtSN0/018e5aa584.png)

### #4 [Ben Awad](https://www.youtube.com/channel/UC-8QAzbLcRglXeN_MY9blyw)
![Alt Image](https://puu.sh/GtSTm/d7f7f91dc1.png)

### #5 [Colt Steele](https://www.youtube.com/c/ColtSteeleCode/videos)
![Alt Image](https://puu.sh/GtSP1/99dac18099.png)

### #6 [Dev Ed](https://www.youtube.com/channel/UClb90NQQcskPUGDIXsQEz5Q)
![Alt Image](https://puu.sh/GtSPP/f0006747e3.png)

### #7 [Fireship](https://www.youtube.com/c/AngularFirebase/videos)
![Alt Image](https://puu.sh/GtSQF/cbd3c76e63.png)

### #8 [freeCodeCamp.org](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ)
![Alt Image](https://puu.sh/GtSRE/73999be934.png)

### #9 [Harry Wolff](https://www.youtube.com/c/hswolff/videos)
![Alt Image](https://puu.sh/GtSSh/3a84797fd0.png)

### #10 [CodingWithChandler](https://www.youtube.com/c/ChandlerKeyes/videos)
![Alt Image](https://puu.sh/GtSVK/57972c4e94.png)


[Vector Illustration](https://icons8.com/illustrations)
Useful Cheatsheets for web developers & designers
Tags: webdev, codenewbie
Published: 2020-09-18 06:15:51

#### Useful cheatsheets that must be in your basket


https://alialaa.github.io/css-grid-cheat-sheet/

https://reactcheatsheet.com/

https://www.supremo.co.uk/typeterms/

https://www.sketchingwithcss.com/samplechapter/cheatsheet.html

https://moz.com/blog/seo-cheat-sheet

https://shortcuts.design/

https://gitsheet.wtf/

https://github.com/LeCoupa/awesome-cheatsheets

http://www.storiesinflight.com/html5/

https://easings.net/en

https://fontawesome.com/cheatsheet

https://mbeaudru.github.io/modern-js-cheatsheet/
Opinion: Convert tutorial to video?
Tags: discuss
Published: 2020-09-18 05:55:58

I had a thought last night i.e. How to make dev.to post reach more audience.

Their are some great post which covers
- explaining hard stuff
- a new concept, package or library
- entire process of developing project

etc...

So, I thought, Why not convert these posts to videos?

In video, I can refer to the post and follow steps while we solve some problem. A credit(link back) to post in video description.

What is your opinion? 

Queries
- Should I do that?
- Am I allowed to do that? What is license of posts done on dev.to
Basic JavaScript: Data Types
Tags: javascript, beginners
Published: 2020-09-18 05:54:15

# Data Types are important concepts in any language. They define the type of data a variable can hold.

## In JavaScript, we have various data types like:

<!-- TOC -->

- [Number](#number)
- [String](#string)
- [Boolean](#boolean)
- [Arrays](#arrays)
- [Object](#object)
- [null](#null)
- [undefined](#undefined)

<!-- /TOC -->

> ## The `typeof()` function can be used to see the data type of the variable.

---

### Number

This data type can hold integers from -Infinity to +Infinity including floating-point numbers.

```js
var a = 2;
console.log(typeof(a)); // "number"
var b = 3.56;
console.log(typeof(b)); // "number"
```

---

### String

A String is a sequence of characters. String are denoted using `" "` or `' '`

```js
var name = "Developer";
console.log(typeof(name)); // string

var letter = "A";
console.log(typeof(letter)); // string
```

---

### Boolean

A boolean is a `true` or `false` value.

```js
var isRaining = true;
console.log(typeof(raining)); // boolean

var isLoggedIn = false;
console.log(typeof(isLoggedIn)); // boolean
```

---

### Arrays

Arrays are a collection of similar data types. They are denoted using square brackets `[ ]`

```js
var numbers = [1, 2, 3, 4, 5]; // array of numbers
var colors = ["red", "green", "blue"]; // array of strings
```

But, in JavaScript, an array can hold various data types too.

```js
var numbersAndColors = [1, "blue", 2, "red", 3];
```

You can access the value of the array by its index.
Every array has an index that starts with 0.

```js
console.log(colors[0]); //red
console.log(colors[1]); //green

console.log(numbers[0]); // 1
console.log(numbers[1]); // 2
```

---

### Object

In JavaScript, an object is a collection of key: value pairs.
They are denoted using the `{}` brackets

```js
var obj = {
  name: "Shubham",
  age: 20,
  role: "Frontend Developer",
  isStudent: true,
  hobbies:['coding","reading","eating"]
};
```

Each object's key: value pair must be separated by a comma.

The data of an object can be accessed by the following syntax.

Syntax:

- `ObjectName.keyName` = if the key is a String.
- `ObjectName[keyName]` = if the key is a Number

```js
var obj = {
  name: "Shubham",
  age: 20,
  role: "Frontend Developer",
  100: "Hundred",
};

console.log(obj.name); // "Shubham"
console.log(obj.age); // 20
console.log(obj[100]); // "Hundred"
```

---

### null

A null data type means that value doesn't exist in memory.

---

### undefined

An undefined type means that value exists but is not yet defined.

```js
var a;
console.log(a); // undefined
```

---

These are the basics data types present in JavaScript.

Next, we will learn about JavaScript Operators.
Warm Welcome Action 🤗
Tags: actionshackathon, github, opensource
Published: 2020-09-18 05:38:18

### My Workflow
`warm-welcome-action` is a very simple GitHub Action I made to learn the basics of how actions work ⚙️ and for the [dev.to actions hackathon](https://dev.to/devteam/announcing-the-github-actions-hackathon-on-dev-3ljn) 🎉

What this action does is every time a user submits a new pull request on a repository with this action installed, it will post a warm welcome gif to make the person who made the PR well, welcome.

### Submission Category: 

Wacky Wildcards

### Yaml File or Link to Code

{% github https://github.com/bntzio/warm-welcome-action %}

### Additional Resources / Info

This super simple action is my first GitHub Action published! 💖 I hope you all find it useful! 😄

PR's are welcome 😉

![welcome_gif](https://media.giphy.com/media/FQyQEYd0KlYQ/giphy.gif)
Will, eventually, Mozilla be a Microsoft acquisition?
Tags: discuss, business
Published: 2020-09-18 05:36:40

[MDN](https://developer.mozilla.org/en-US/), [Rust](https://www.rust-lang.org/), software patents ([Mozilla Open Software Patent License (MOSPL)](https://www.mozilla.org/en-US/about/policy/patents/license/)), open source, ...

I have this feeling that it is not so unlikely. Could even be another acquirer, but this eventuality is not so relevant at the present time.

I am interested in opinions about this topic.
Building and Testing Infrastructure with Github Actions 🏗
Tags: actionshackathon, go, terraform, cloud
Published: 2020-09-18 05:35:59

[Instructions]: # (To submit to the GitHub Actions x DEV Hackathon, please fill out all sections.)


### My Workflow
[Note]: # (Make sure to include the name of your GitHub Action and share where it's being used!)

I've been learning a bit about [Terraform](https://www.terraform.io/) this past month and thought it would be cool to leverage IaC in a CI/CD environment with GitHub Actions!

My workflow runs [terratest](https://terratest.gruntwork.io/) to test the infrastructure then initializes, formats, plans, and applies changes based on the Terraform configuration. Changes are applied after a pull request has been merged. 

To ensure Terraform runs in the correct directory the commit and PR message should be the directory name.


### Submission Category: 

[Note]: # (Maintainer Must-Haves, DIY Deployments, Interesting IoT, Phone Friendly, or Wacky Wildcards)
DIY Deployments

### Link to Code

{% github ari-hacks/infra-github-actions %}

[Note]: # (Our markdown editor supports pretty embeds. Try this syntax: `{% github link_to_your_repo %}` to share a GitHub repository)

Actions used in my workflow
 - [Go setup](https://github.com/marketplace/actions/setup-go-environment)
 - [Terraform setup](https://github.com/marketplace/actions/hashicorp-setup-terraform)
 - [Terraform version installer](https://github.com/marketplace/actions/terraform-installer)




[Reminder]: # (Submissions are due on September 12th (11:59 PM PDT) and winners will be announced on September 23!)
Flexbox: Axes
Tags: css, codenewbie
Published: 2020-09-18 05:26:59

<span>Photo by <a href="https://unsplash.com/@jabdilla_creative?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Jason Abdilla</a> on <a href="https://unsplash.com/s/photos/axes?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></span>


One thing that is useful to have in mind when using Flexbox is what axis are you working on. Depending on the direction you are flexing can change the axis will make a difference to the axes.

The reason to know about axes is that some of the flex container properties effect flex items on different axes. This will help you achieve the end result better as you have a better understanding on how it works.



## Main Axis

The main axis is decided by which flex-direction you have chosen. You have the options of the following;

- row
- row-reverse
- column
- column-reverse



Row is the default option when you just apply display:flex to a container. This would make the main axis go from left to right.

Row reverse would do the opposite, the main axis would go from right to left.

As you may have guessed it, column makes the main axis go from top to bottom and column-reverse goes from bottom to top.



## Cross Axis

You should think of the cross axis as the opposite of the main axis. Where the flex direction is set to row the main axis is left to right so the cross axis is top to bottom.

Where the flex direction is set to column, the main axis is top to bottom where the cross axis is left to right.



## Start and End Lines

It is also useful to know where the start and end lines are on the axes as when you start align and justifying content this will help you position your flex items easier.

The start and end lines change in relation to which flex-direction has been set.

Picture a container box, with two flex items inside it. Then have a guess at the below question, mentally, or draw it out if it helps you, where the start or end line would be.



### Questions

1) Where would the start line on the main axis, if the flex-direction was set to row-reverse?

2) Where would the end line on the cross axis, if the flex-direction was set to column?



### Answers



1) The main axis would be going from left to right, and the start line would be on the right hand side.

2) With the flex direction being set to column, the main axis would go from top to bottom, so the cross axis would go from left to right, and the end line would be on the right hand side.

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

This diagram may help you in understand further what we explained above.



*Taken from the official W3 [documentation](https://www.w3.org/TR/2018/CR-css-flexbox-1-20181119/)* 



I have recently released a FREE book on flexbox called Flexbox Answered: answers to the most common flexbox questions which can help answer some more question on flexbox that you might have.

You can download a copy free on my website [craigdennis.me](http://www.craigdennis.me/)
Subscript All Numbers in Chemical Equations in Excel Office 365!!
Tags: kutoolsexceltutorial, subscriptallnumbersi, kutools
Published: 2020-09-18 10:38:07

---
title: Subscript All Numbers in Chemical Equations in Excel Office 365!!
published: true
date: 2020-09-18 05:21:22 UTC
tags: KutoolsExcelTutorial,SubscriptAllNumbersi,Kutools
canonical_url: https://geekexcel.com/subscript-all-numbers-in-chemical-equations-in-excel-office-365/
---

## Subscript All Numbers in Chemical Equations in Excel:

In this post, we will guide you to learn how to **Subscript All Numbers in Chemical Equations in Excel Office 365** using **Kutools**. Get an official version of **MS Excel** from the following link: [https://www.microsoft.com/en-in/microsoft-365/excel](https://www.microsoft.com/en-in/microsoft-365/excel)

**Note:** [kutools for Excel](https://geekexcel.com/get-kutools-for-ms-excel-2019-2016-2013-2010-2007-office-365/) has more than 180 features which are used to complete the difficult task with several clicks. If you want to use Kutools, you need to install it from Excel’s official website.

## Steps to Subscript All Numbers in Chemical Equations:

To subscript, all numbers in chemical equations in Excel, do as follows.

- First, you need to select a text string that you want to subscript the numbers.

![Example Equations](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/09/1-67.png)<figcaption id="caption-attachment-14179">Example Equations</figcaption>

- On the **Kutools** tab, **select** the **Text** option, and **choose**  **Subscript**  **numbers**  **in**  **chemical**  **formulas**.

![Choose Subscript numbers in chemical formulas](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/09/2-62.png)<figcaption id="caption-attachment-14180">Choose Subscript numbers in chemical formulas</figcaption>

- Now, **Kutools for Excel dialog box** will pop out to tell you that the number of successfully converted cells.
- **Click** the **OK** button to close it.

![Kutools for Excel Dialog Box](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/09/Kutools-for-Excel-Dialog-Box.png)<figcaption id="caption-attachment-14168">Kutools for Excel Dialog Box</figcaption>

- Now, you will see the result as shown in the below screenshot.

![Result](https://eadn-wc04-371788.nxedge.io/cdn/wp-content/uploads/2020/09/4-12.png)<figcaption id="caption-attachment-14181">Result</figcaption>

## Summary:

In this post, you can learn the steps to **Subscript All Numbers in Chemical Equations in Excel Office 365** using **Kutools**. Give your **feedback** in the comment section. Thanks for visiting **[Geek Excel.](https://geekexcel.com/)** Keep Learning!!
[CRUD] Operations in Laravel PHP Framework - Step by Step
Published: 2020-09-18 05:09:41

Today we learn CRUD operations in laravel. CRUD (Create, Read, Update, Delete) This is very necessary for any project. stands as a basic requirement for any Laravel project. new developers must first learn simple CRUD operations in laravel as they are fundamentals of any Laravel application.

[laravel CRUD](https://www.phpcodingstuff.com/blog/crud-operations-in-laravel-php-framework.html)
Custom VS Code Theme
Tags: vscode, customtheme, microsoft, visualstudio
Published: 2020-09-18 04:59:47

Recently I came across an article on Dev.to talking about how to create your own VS Code Extensions. This was somewhat news to me, in the back of my mind I understood that most extensions are created by a community but I never looked into the process.

This is where [Black Sand](https://marketplace.visualstudio.com/items?itemName=TimBogdanov.black-sand) was born. For over 40 hours of tinkering and playing around with the VS Code Theme JSON file.

![Alt Image](https://puu.sh/GtHgs/5a45a6cfd7.png)

Feel free to [Download](https://marketplace.visualstudio.com/items?itemName=TimBogdanov.black-sand) and [Contribute](https://github.com/timbogdanov/Black-Sand-VS-Code-Theme)!


## React JS
![Alt Image](https://puu.sh/GtH9h/f736906525.png)

## HTML
![Alt Image](https://puu.sh/GtHh9/d67c2dd655.png)

## CSS
![Alt Image](https://puu.sh/GtHcE/e6af187ebb.png)


[Vector Illustration](https://icons8.com/illustrations)
Where do I get an affordable (or free) RDBMS?
Tags: help, database
Published: 2020-09-18 04:52:51

I tried to use an ORM that allows both [the generous](https://dev.to/patarapolw/generous-sql-or-nosql-hosting-similar-to-mongodb-atlas-1g3h) MongoDB, and local SQLite, but failed (via mikro-orm).

Might be better if I use a real online RDBMS with Prisma or TypeORM, but pricing? free tier? per month? per year?
September 18th, 2020: What did you learn this week?
Tags: weeklylearn, discuss, weeklyretro
Published: 2020-09-18 04:43:28

It's that time of the week again. So wonderful devs, what did you learn this week? It could be programming tips, career advice etc.

<center>

![Two hockey players reading a play book](https://media.giphy.com/media/OqJdvB5VyUUqNoZdjO/giphy-downsized-large.gif)
</center>

Feel free to comment with what you learnt and/or reference your TIL post to give it some more exposure.

{%tag todayilearned %}
<!--
And remember, if something you learnt was a big win for you, then you know where to drop it as well.👇👇🏻👇🏼👇🏽👇🏾👇🏿

{% link https://dev.to/jess/what-was-your-win-this-past-week-4ac4 %}

![Victory!](https://media.giphy.com/media/K3RxMSrERT8iI/giphy.gif)
-->
Bob Ross blesses your Repo With Happy Little Accidents
Tags: actionshackathon, github
Published: 2020-09-18 04:25:12

[Instructions]: # (To submit to the GitHub Actions x DEV Hackathon, please fill out all sections.)


### My Workflow
[Note]: # (Make sure to include the name of your GitHub Action and share where it's being used!)

The action is named "happy-little-action". This workflow is for anyone who wants to feel the joy of painting in their repository. Bob Ross's gentle spirit will add a happy little accident (a text file containing some of his words of wisdom or a PNG of one of his paintings) to your repository after each commit or pull request.

![screenshot of repository with happy accident files added](https://dev-to-uploads.s3.amazonaws.com/i/45zrtxd8thf9uj3545wc.PNG)

![screenshot of painting file added](https://dev-to-uploads.s3.amazonaws.com/i/xsav5l7gotn3xujjusq1.PNG)

![screenshot of text file added](https://dev-to-uploads.s3.amazonaws.com/i/m83ucgfawjk82dq9k4jz.PNG)

### Submission Category: 
Wacky Wildcards

[Note]: # (Maintainer Must-Haves, DIY Deployments, Interesting IoT, Phone Friendly, or Wacky Wildcards)


### Yaml File or Link to Code

{% github https://github.com/rdlucas2/happy-little-action %}

[*****Example Yaml Workflow File*****](https://github.com/rdlucas2/reimagined-octo-umbrella/blob/master/.github/workflows/happyaccident.yml)

[Note]: # (Our markdown editor supports pretty embeds. Try this syntax: `{% github link_to_your_repo %}` to share a GitHub repository)

### Additional Resources / Info
This is the last of my entries to the actionsHackathon submissions! I found some of the resources from existing github repositories, that saved me a lot of time not having to gather the quotes and images. I learned a little using octokit for the first time which was nice too. Thanks for sticking around and happy coding!

Link to where I found the [Quotes](https://github.com/mndvns/bobross-api/blob/master/quotes.js)

Link to where I found the [Paintings](https://github.com/jwilber/Bob_Ross_Paintings/tree/master/data/paintings) 

My other actionsHackathon submissions:

[Let me google that issue for you](https://dev.to/rdlucas2/let-me-google-that-issue-for-you-3jl4)

[Register Azure IoT Edge Device on Existing Hub](https://dev.to/rdlucas2/register-azure-iot-edge-device-on-existing-hub-22ne)

[Tell Alexa to Trigger Your Deployment](https://dev.to/rdlucas2/tell-alexa-to-trigger-your-deployment-2im2)

[Alexa Notifies You When Someone Stars Your Repository](https://dev.to/rdlucas2/alexa-notifies-you-when-someone-stars-your-repository-3nf4)

[Note]: # (Be sure to link to any open source projects that are using your workflow!)

[Note]: # (Be sure to include the DEV usernames of your collaborators, if any. )

[Reminder]: # (Submissions are due on September 17th (11:59 PM PDT) and winners will be announced on September 23!)
Install Nodemon and how to deal with potential issues
Tags: code, whatimlearning, express, node
Published: 2020-10-22 17:59:44

---
title: Install Nodemon and how to deal with potential issues
published: true
date: 2020-09-18 04:12:38 UTC
tags: Code,WhatImlearning,express,node
canonical_url: https://gabbysadventure.com/how-to-install-nodemon-and-deal-with-potential-issues/#utm_source=rss&utm_medium=rss&utm_campaign=how-to-install-nodemon-and-deal-with-potential-issues
---

Nodemon will monitor any changes in your code and automatically restart your server. This removes the need to type in `node server.js` to start, restart webpage to see changes, `control+c` to stop, and repeat after every single little change. You can [read more about it here](https://nodemon.io).

In a perfect world, this first step should work for you and be done. You can stop reading. In your terminal, it doesn’t need to be in a project folder, type this to download it to your computer.

```bash
npm install -g nodemon
```

## Potential Issues

If that doesn’t work for you, then try this.

```bash
sudo npm install -g nodemon
```

You will need to enter a password so make sure you have admin privileges on your computer. If it’s your computer and not a job or school’s, then this shouldn’t be a problem.

_Note: Your password won’t show up when you type it._

After installing Nodemon, if you try to run it and get a long error list, you can get rid of it by entering:

```bash
npm i pstree.remy@1.1.0 -D
```

The documentation for this issue can be found [here on GitHub](https://github.com/remy/nodemon/issues/1459).

You should be good to go now!

## Conclusion

Once you have it downloaded, you can go to your folder in the terminal and instead of typing `node server.js`, you can type `nodemon server.js`. It is now monitoring for changes. Every time you hit save, nodemon will automatically restart the server and you just need to refresh the browser to see your updates.

Hopefully this has helped someone to become 1 step closer to becoming a better developer.