teleren/devto huggingface dataset:
Creating Azure for Students Account
Tags: cloud, azure, computerscience, beginners
Published: 2021-11-25 17:42:13

Azure for Students offers a license with $100 in Azure credits that can be used for the first 12 months along with some free services without the need to provide a credit card when subscribing. 

Below, it is shown step by step how to activate an Azure for Students subscription.

##Step 1: Access the Azure for Students page.##

Link: https://aka.ms/azureforstudents.

![Azure for Students offer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bb32pt7592o44f7g1lf8.png)

##Step 2: Identify yourself.##

You then need to sign in or sign up with a Microsoft account. For this step you can use an institutional email or a personal email.

![Microsoft Sigin](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/acj5g8mxgq25vqoy5hg4.png)

***Note:*** In case an institutional account has several purposes, you must select: `Personal account` and always use this means to access to Azure.

##Step 3: Academic verification.##

As a first point, we will need to verify our authenticity with a verification code that will be sent by text message. Then we must perform the academic verification, in this case with an email (.edu) as you can see below:

![Academic verification image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hpio8tobz2rtrlmpo7hf.png)

##Step 2: Identify yourself.##

After this process you will be redirected to the azure portal home page:

![Azure portal](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h2nuydoq5ckdl0ys3pv9.png)

With this you are ready to start using Azure. To see the credit that remains available you can access the Microsoft Azure Sponsorships portal: [https://www.microsoftazuresponsorships.com/](https://www.microsoftazuresponsorships.com/).

###**Thanks for reading** ###

Thank you very much for reading, I hope you found this article interesting and useful in the future. If you have any questions, it will be a pleasure to be able to collaborate and together exchange knowledge with each other.

See you on [Twitter](https://twitter.com/esDanielGomez)! :)
I built my first Fullstack app: 5 lessons I learned
Tags: javascript, webdev, beginners, productivity
Published: 2021-11-25 17:37:19

I built my blog with MERN (MongoDB, Express, React.js, and Node.js) stack.  It's for my portfolio. I didn't build any full-stack project before. In the process of building this project, I've learned a lot. 

In this post, I'll share 5 lessons I learned while building this project. 

Note: I'm just a beginner. These tips are just my experiences.

## lesson 1: Plan Before starting.

When starting a project be it a full-stack or just frontend make sure to plan. Because that will save you a ton of time. List out all the features your application will have. 

In my case creating a new post, editing, deleting posts, commenting on posts, etc. Also, the user logs in and registers.  


## lesson 2: Take a course

Take a similar course as your project if possible.

If you are starting out, try to find a similar project course on Udemy or YouTube. It doesn't have to be 100% the same as your project. If your project is CRUD find a CRUD course. That will help you save a lot of hours of frustration. 

## lesson 3: Ask for help

Ask for help. When you are stuck, don't know what to do. Reach out to people. Ask for help. There are a lot of discord servers, programmers hanging around. Also, you can Dm people on Twitter programmer are happy to help you

## lesson 4: Don't rush

Don't try to code the whole project at once, cause that won't happen. Someday an error will pop up that will take hours to solve. 
Break the project into smaller chunks and tackle one chunk at a  time. 

Try to use tools like Notion or Trello. Those are great tools to track a project.

## lesson 5: Google It

When you got an error, just google it. Don't hesitate. googling will help you save a lot of time. 

I remember one error that cost me my whole day. I was trying to figure it out on my own. Then I googled it fixed it in a few minutes. 

## lesson 6: Take a break

Take a break. While coding it's a lot hard to leave an error without fixing it. But it's unproductive. 

I remember one day couldn't fix an error. Then I stayed till 2 am. Then I left and got some sleep. The next morning like magic I fixed that bug. Do you know what that bug was? 

**I put == instead of = when assigning a variable**. 😂

## Conclusion

That's it for today. If you want to read articles like this make sure to follow me on Twitter  @coderamrin

Thanks for reading.
Keeping your Tailwind CSS "DRY"
Tags: css, programming, tailwindcss, webdev
Published: 2021-11-25 17:28:29

Hi folks, today I would like to share a tip on how to keep your TailwindCSS DRY ("Don't Repeat Yourself").  One way we can do this is by extracting component classes to be used across our repeating elements.  (Another way is by creating template partials or javascript components, but that's a whole other post in and of itself).  For now, we will focus on the former.

First step is to have a style.css file in the src folder at the root of your project. Inside style.css, we will have the following code:

```
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  
}
```

Inside the curly braces is where we'll write our new utility components.  In this instance we'll be making a button as an example.

We'll call it simply "btn". We are going to use @layer components directive to tell Tailwind what layer those styles belong to, and to instruct Tailwind to consider those styles for purging the components layer.  

We are going to use standard tailwind utility classes to define the style of our button.

```
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .btn {
    @apply w-48 px-4 py-2 text-lg font-medium tracking-wider text-white transition ease-in-out bg-teal-500 shadow-md rounded-3xl hover:bg-teal-400 hover:scale-105;
  }
}
```
Import the style.css file at the top level of our app, and we can use our new "btn" utility for all the buttons in our project, with the following JSX:

```
<button className="btn">Click Me</button> 
```
or HTML:
```
<button class="btn">Click Me</button>
```

This makes for much cleaner looking code, and helps to maintain a good level of uniformity throughout our project.

I hope you enjoyed reading this article, and that it helps you to simplify the process of extracting component classes and keeping your code nice and DRY.

Thanks for reading, happy coding!
Is Ubuntu Compatible With the Hardware?
Tags: ubuntu
Published: 2021-12-03 17:30:10

---
title: Is Ubuntu Compatible With the Hardware?
published: true
date: 2021-11-25 17:00:11 UTC
tags: Ubuntu
canonical_url: https://stackallflow.com/ubuntu/is-ubuntu-compatible-with-the-hardware/
---

<header>
<p><span style="font-size: 1.2em; color: initial;">compatibility</span><span style="font-size: 1.2em; color: initial;">hardware</span><span style="font-size: 1.2em; color: initial;">system-installation</span></p>
</header>

<aside role="status">
<div>
<div>
<div></div>
</div>
<div><span style="font-size: revert; color: initial;">I am a bit financially strapped and received a Gateway GT5056 tower. The tower has an AMD dual core 64-bit processor in it. Will Ubuntu 12.04 run on this machine? I will not have any other application other than LibreOffice installed.</span></div>
</div>
</aside>

#### Accepted Answer

You can confirm if it’ll work or not by downloading the [Live CD](https://help.ubuntu.com/community/LiveCD) ISO and booting with the Live CD. This will not install ubuntu on your machine, but will let you run it for the session. This way you can verify if all your hardware is supported.

You can try [Lubuntu](http://www.lubuntu.org), which is a lightweight version of Ubuntu with a very fast and light window manager.

The post [Is Ubuntu Compatible With the Hardware?](https://stackallflow.com/ubuntu/is-ubuntu-compatible-with-the-hardware/) appeared first on [Stack All Flow](https://stackallflow.com).
Can’t Boot Without Flash Drive Plugged in Ubuntu?
Tags: ubuntu
Published: 2021-12-01 16:33:38

---
title: Can’t Boot Without Flash Drive Plugged in Ubuntu?
published: true
date: 2021-11-25 16:59:40 UTC
tags: Ubuntu
canonical_url: https://stackallflow.com/ubuntu/cant-boot-without-flash-drive-plugged-in-ubuntu/
---

<header>
<p><span style="font-size: 1.2em; color: initial;">boot</span><span style="font-size: 1.2em; color: initial;">usb</span></p>
</header>

I had Ubuntu 12.04 Beta installed on my computer. When 12.04 was finally released, I made a bootable USB Flash Drive using Startup Disk Creator.

Then I decided to check if this drive works properly and to reinstall the system on my desktop. I must add, my desktop behaves a bit strange when it comes to bootable USB’s, it recognizes them as HDD.

In BIOS I changed priority of boot so USB Flash Drive (recognized as HDD) was first. Successfully booted, I installed Ubuntu. Everything worked fine, but…

Now I cannot boot from my real HDD. Every time I want to boot, I put the USB Flash Drive into my computer, boot, safely remove it and everything works.

What do I need to do to repair boot?

#### Accepted Answer

It looks like Grub got installed to the USB drive. Boot with the USB drive, open a terminal window by pressing <kbd>Ctrl</kbd>–<kbd>Alt</kbd>–<kbd>T</kbd> then run

```
sudo grub-install /dev/sdX

```

Where sdX is the drive you wish to boot from. That command will install GRUB to the MBR of the desired hard drive (sda,sdb,sdc,sdd), which should make it bootable. The commands `sudo fdisk -l` or `lsblk` should help you identify which drive you want.

The post [Can’t Boot Without Flash Drive Plugged in Ubuntu?](https://stackallflow.com/ubuntu/cant-boot-without-flash-drive-plugged-in-ubuntu/) appeared first on [Stack All Flow](https://stackallflow.com).
How to Restore a System After Accidentally Removing All Kernels in Ubuntu?
Tags: ubuntu
Published: 2021-12-01 16:31:03

---
title: How to Restore a System After Accidentally Removing All Kernels in Ubuntu?
published: true
date: 2021-11-25 16:56:32 UTC
tags: Ubuntu
canonical_url: https://stackallflow.com/ubuntu/how-to-restore-a-system-after-accidentally-removing-all-kernels-in-ubuntu/
---

<header>
<p><span style="font-size: 1.2em; color: initial;">kernel</span></p>
</header>

I was trying to delete old kernels, but I must have deleted all of the kernels on my Ubuntu 11.04 laptop. Is there any way to fix this via USB boot or mounting hard drive on another system?

#### Accepted Answer

Boot into a live CD (or live USB), mount some systems, chroot into it and install the kernel. After a successful installation of the kernel, unmount the filesystems.

1. Open Terminal
2. Mount the Ubuntu partition: `sudo mount /dev/sdXY /mnt`
3. Mount some special partitions:
```
sudo mount --bind /dev /mnt/dev
sudo mount --bind /proc /mnt/proc
sudo mount --bind /sys /mnt/sys

```
4. (optional) When you are connected to a network, use the DNS servers from your Live environment (otherwise host names can possibly not be resolved):
```
cp /etc/resolv.conf /mnt/etc/resolv.conf

```
5. Chroot into the `/mnt`: `sudo chroot /mnt`
6. Install the Linux kernel: `apt-get install linux-image-generic` (no sudo required as you are root after a chroot)
7. After a successful installation of the kernel, get out the chroot and unmount some filesystems:
```
exit
sudo umount /mnt/sys
sudo umount /mnt/proc
sudo umount /mnt/dev
sudo umount /mnt

```
8. Reboot and remove CD or USB: `sudo reboot`

The post [How to Restore a System After Accidentally Removing All Kernels in Ubuntu?](https://stackallflow.com/ubuntu/how-to-restore-a-system-after-accidentally-removing-all-kernels-in-ubuntu/) appeared first on [Stack All Flow](https://stackallflow.com).
Day 19 of #100daysofcode: Yesterday's Work
Tags: 100daysofcode, react, python, beginners
Published: 2021-11-25 16:53:15

Time got away from me yesterday and I forgot to update everyone! Here's what I worked on yesterday.

## Yesterday
* Worked on some Leetcode problems
  * Notably, I worked on rotating a 2D image. My solution worked, but I was especially impressed with how efficient some of the highly upvoted solutions were. 
* Worked through some of the FreeCodeCamp Regex tutorials
* A lot of work on my assignment
  * Started work on a Navbar in the assignment. Currently running into a little bit of trouble with it, mostly on the routing side. There's a bit of a design decision that I'm working through with it right now.

I have made the decision to not make this challenge about my school assignments, but I wanted to let you know what I'm working on at least a little bit! This assignment is due in just around a week, so not much more of these sparse posts!

## Upcoming
* **Finals and final project sprints**: Not too much more!
* Iron out details regarding the Study Aid app (I really need to name this thing) -- May work on this this weekend
  * Flask vs Django
  * Should I change how I deploy? Should Docker get in the picture?
  * Are there any other systems I should think about using as a part of this project?
* Learn more about Material UI, I will probably use Material UI a little bit in my (ongoing) school project. 
* Start the Study Aid app!
* Later in the challenge: AWS Deployment, AWS Certification, and Using Docker!?


### Resources
[JS Course - FreeCodeCamp](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/)
[Material UI](https://mui.com)
[Regex Tutorial - FreeCodeCamp](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures#regular-expressions)
How to Solve “Permission Denied” When Using Sudo With Redirection in Bash?
Tags: ubuntu
Published: 2021-12-01 16:27:51

---
title: How to Solve “Permission Denied” When Using Sudo With Redirection in Bash?
published: true
date: 2021-11-25 16:51:11 UTC
tags: Ubuntu
canonical_url: https://stackallflow.com/ubuntu/how-to-solve-permission-denied-when-using-sudo-with-redirection-in-bash/
---

<header>
<p><span style="font-size: 1.2em; color: initial;">bash</span><span style="font-size: 1.2em; color: initial;">command line</span><span style="font-size: 1.2em; color: initial;">sudo</span></p>
</header>

When using sudo to allow edits to files, I regularly get ‘permission denied’.

For example, my mouse is jittery and sluggish, so I want to disable polling:

```
sudo echo "options drm_kms_helper poll=N">/etc/modprobe.d/local.conf

```

I’m prompted for a password, and then get:

```
bash: /etc/modprobe.d/local.conf: Permission denied

```

So I tried to do a temporary change to disable polling by using:

```
sudo echo N> /sys/module/drm_kms_helper/parameters/poll

```

Yet again the system responded with:

```
bash: /sys/module/drm_kms_helper/parameters/poll: Permission denied

```

Any ideas?

#### Accepted Answer

Output redirection (via the `>` operator) is done by the shell, not by **echo**. You have to login as root

```
sudo -i

```

Then you can use redirection

```
echo N> /sys/module/drm_kms_helper/parameters/poll

```

Otherwise you can run bash string with sudo

```
sudo bash -c "echo N> /sys/module/drm_kms_helper/parameters/poll"

```

The post [How to Solve “Permission Denied” When Using Sudo With Redirection in Bash?](https://stackallflow.com/ubuntu/how-to-solve-permission-denied-when-using-sudo-with-redirection-in-bash/) appeared first on [Stack All Flow](https://stackallflow.com).
Blob Generator using JavaScript
Tags: javascript, beginners, webdev, css
Published: 2021-11-25 16:37:32

I created Blob Generator using HTML,CSS and JavaScript. So, let's see the code part.

HTML:-
```html

<body>
    <div class="wrapper">
        <div class="output">
            <div id="blob">
                
            </div>
        </div>
        <div id="hgt">
            <label for="blob-height">
                Height
            </label>
            <input type="number" id="blob-height" value="200">
        </div>
        <div id="wdth">
            <label for="blob-width">
                Width
            </label>
            <input type="number" id="blob-width" value="200">
        </div>
        <div class="sliders">
            <input type="range" value="30">
            <input type="range" value="80">
            <input type="range" value="60">
            <input type="range" value="40">
        </div>
        <input type="text" id="css-code" readonly>
        <button id="copy">Copy</button>
        
    </div>
    <script src="main.js"></script>
</body>
</html>  
```

CSS:-
CSS part is so simple.
```css
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    background-color: #008dff;
}
.wrapper{
    border: 1px solid black;
    background-color: #ffffff;
    width: 45%;
    min-width: 550px;
    padding: 30px;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    border-radius: 8px;

}
.output{
    background-color: #eef3f8;
    width: 100%;
    min-height: 250px;
    padding: 20px 0;
    overflow: hidden;
    border-radius: 5px;
    position: relative;
    display: grid;
    place-items: center;
}
#blob{
    height: 300px;
    width: 300px;
    background: linear-gradient(
        #44a2f0,
        #025eaa
    );
    box-shadow: 15px 20px 30px rgba(0, 0, 0, 0.15);

}
label{
    font-weight: 500;

}

input[type=number]{
    height: 40px;
    width: 80px;
    padding: 10px;
    margin-top: 5px;
    border: 1px solid #a0a0b0;
    border-radius: 3px;
}
input[type=number]:focus{
    background-color: #f1f5fa;
    border-color: #025eaa;
    color: #025eaa;
}
#hgt,#wdth{
    display: flex;
    justify-content: space-around;
}
.sliders{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}
input[type=text]{
    width: 82%;
    margin-top: 50px;
    padding: 10px;
    font-size: 12px;
    border: none;
    background-color: #f1eff9;
    border-radius: 3px;
}
#button{
    width: 12%;
    margin-left: 4%;
    padding: 10px 0;
    background-color: #0075ff;
    border: none;
    cursor: pointer;
    color: #ffffff;
    border-radius: 3px;
    font-size: 12px;
    
}
```

JavaScript:-
This is the most important part.
![JavaScript](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/33ci0bg5wxefv6dw2aiw.png)
Also check out [Box Shadow Generator](https://dev.to/devrohit0/create-box-shadow-generator-with-javascript-and-html-35ef)
Hope you loved it ♥ .
Different Ways to Create Arrays
Tags: javascript, webdev, beginners, arrays
Published: 2021-11-25 16:32:04

In JavaScript arrays are very important data structures one has to learn and good to be master at after learning the language basics, here in this article I would like to cover the ways to create them and arrays are common and comes handy to solve manythings

## Array literal Syntax

```javascript
 const arr_name  = [];   // array without a size
 const arra_name = [5];  // with size 5 elements
```
Literal syntax is the easy one to create, 
Its most often used by developers to create arrays
supports other array operations

## Array using constructor method

```javascript
 const arr_name = new Array();  // Array is the constructor
 const arr_name = new Array(5);  // Create array with 5 elements
```
Never use Math.random() to create passwords in JavaScript
Tags: webdev, javascript
Published: 2021-11-25 16:28:07

Recently, I've seen articles and tweets that show how to build random password generators with JavaScript. These projects are excellent to get some practice, sure. However, **the passwords they create are not secure.**

These password generators rely on the `Math.random()` method, which is not cryptographically secure. It means the pseudo-random number is not really that random, that the random numbers can be predicted and, therefore, **it is possible to guess the generated passwords.**

It's worth pointing out that JavaScript wasn't originally created to build "serious" applications. Its original purpose was to add just some interactivity and visual effects to web pages.

For that reason, when `Math.random()` was designed, nobody thought about making it cryptographically secure. it wasn't seen as necessary back then.

Nowadays, the language has evolved and you can now build complex projects with it, but it still has many traces of its past, and these must be kept for compatibility reasons. 

## How to create secure passwords
On the front end, **you can use the [`crypto.getRandomValues()`](https://developer.mozilla.org/en-US/docs/Web/API/Crypto/getRandomValues)** method to create random numbers that are secure enough. If you're using Node.js, the `crypto` module has the [`randomInt()`](https://nodejs.org/api/crypto.html#cryptorandomintmin-max-callback) method.

Here's a password generator for the front end, using `crypto.getRandomValues()`:

```javascript
function generatePassword(length = 16)
{
    let generatedPassword = "";

    const validChars = "0123456789" +
        "abcdefghijklmnopqrstuvwxyz" +
        "ABCDEFGHIJKLMNOPQRSTUVWXYZ" +
        ",.-{}+!\"#$%/()=?";

    for (let i = 0; i < length; i++) {
        let randomNumber = crypto.getRandomValues(new Uint32Array(1))[0];
        randomNumber = randomNumber / 0x100000000;
        randomNumber = Math.floor(randomNumber * validChars.length);

        generatedPassword += validChars[randomNumber];
    }

    return generatedPassword;
}
```

And this is another generator for Node.js:
```javascript
const util = require("util");
const crypto = require("crypto");

const randomInt = util.promisify(crypto.randomInt);

async function generatePassword(length = 16)
{
    let generatedPassword = "";

    const validChars = "0123456789" +
        "abcdefghijklmnopqrstuvwxyz" +
        "ABCDEFGHIJKLMNOPQRSTUVWXYZ" +
        ",.-{}+!\"#$%/()=?";

    for (let i = 0; i < length; i++) {
        generatedPassword += validChars[await randomInt(0, validChars.length)];
    }

    return generatedPassword;
}
```

---

Become a Better JavaScript Developer! My newsletter has easy, actionable steps to level up your JavaScript skills, right to your inbox. [Click here to subscribe](https://nicozerpa.com/newsletter)