teleren/devto huggingface dataset:
Linux
Tags: linux
Published: 2020-12-26 14:09:16

My older brother had Linux on his laptop. I remember when I was about 14, I snuck into his room, booted up his pc and tried to go on the internet to watch anime, but everything was side-ways. I paused for a minute, trying to navigate this layout. I eventually got to animefreak.tv but this memory stuck with me. This was my first experience with linux.

Now 10 years later, as a Web Dev Student, I want to embark on the journey on learning more about Linux. Why is it so popular? Why do people like it? Let´s find out!

**Basics: What is Linux?**

Linux is an operating system, just like Windows or Apple's mac OS. Operating systems are collection of software that manage the different devices and applications in your computer. These bits of software take care of processes like shutting down your computer, booting it up, and giving your programs an interface to interact with devices like your keyboard and mouse.

**Why do people like it?**

Linux is free and extremely flexible. You can personalize it to your hearts content. You can put together a version of Linux that works for your device and is optimized for your needs. Linux is used in a lot of different types of computers. like smart refrigerators, other IoT devices, internet routers, Android smartphones, supercomputers and more.

**Command Line Basics**

Let's learn some basic command line or terminal commands that will allow you to start familiarizing yourself with your system. There is a program between you and the terminal called the shell. A shell is a program that interprets text commands and sends them to your operating system to execute. The most common shell program is called Bash, which comes included in most Linux installations. 

**pwd** prints the directory you're currently in (print working directory)

**cd** changes the directory to your specified argument. If you provide no arguments it will by default take you to your user's directory, which you can refer to in paths with ~. . and .. represent your current and parent directories respectively and are also valid arguments.

**mv** moves a file or directory to your specified directory.

**mkdir** makes new directories where the names are your arguments. You can also make directories inside directories that don't exist yet with the -p flag.
Image Preview Before Upload In VueJS Project
Tags: vue, javascript, nuxt, vuetify
Published: 2020-12-26 14:08:57

Hi Everyone, Hope you are doing well and staying safe,

Today I will be sharing with you the small snippet of code that can help you to preview the image the user before it gets uploaded

Create a Directory and File. 

mixins/ImagePreviewMixin.vue

```javascript
<script>
export default {
  data() {
    return {
      imagePreviewURL: null,
    }
  },
  methods: {
    onFileChange(payload) {
      //const file = payload.target.files[0]; // use it in case of normal HTML input
      const file = payload; // in case vuetify file input
      if (file) {
        this.imagePreviewURL = URL.createObjectURL(file);
        URL.revokeObjectURL(file); // free memory
      } else {
        this.imagePreviewURL =  null
      }
    }
  },
}
</script>

```

We have created the Mixin and we can import that mixin into component

for example

components/UpdateUserAvatar.vue

```javascript
<script>
import ImagePreviewMixin from "@/mixins/ImagePreviewMixin";

export default {
  
  mixins: [ImagePreviewMixin],
}
</script>

<template><div>
Using Vuetify
<v-file-input
                    v-model="avatarImage"
                   
                    label="Image"
                    required
                    @change="onFileChange"
                  ></v-file-input>

/* IN case of Normal HTML Input
<input
                    v-model="avatarImage"
                   type="file"
                    label="Image"
                    required
                    @change="onFileChange"
                  ></v-file-input>
*/

<img
                    v-if="imagePreviewURL"
                    :src="imagePreviewURL"
                    alt=""
                    style="max-width: 100%;width: 250px; object-fit: cover"
                  />
</div></template>
```

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/mc8cxl3k419aca4md9hd.jpg)
Advent of code - Day 25
Tags: javascript, typescript, adventofcode
Published: 2020-12-26 14:04:33

Are you participating in the [Advent of code](http://adventofcode.com) this year?

If you don't know what the advent of code is, it's a website where you'll find a daily challenge (every day it gets harder). It's a really fun event, you should participate!

I try to solve the exercises using either JavaScript or TypeScript and will share my solutions daily (with one day delay so no one can cheat!). I only share the solution for the second part.

______________

And it's the last day of the event! For this one, Advent of Code was merciful. It only takes a few minutes to complete with a simple loop.

All in all this year challenges were great. A few were really complex and interesting, I really encourage you to try it out! But I'm honestly happy that it's over so I can relax and enjoy some time of. Completing all the challenges the day of the release takes time and commitment, I'm really proud I managed to keep up with the game!

Here is my solution for day #25:
```ts
function transform(subjectNumber: number, value: number) {
  return (value * subjectNumber) % 20201227
}

function getLoopSize(id: number) {
  let current = 7
  let iterations = 1
  while (current !== id) {
    current = transform(7, current)
    iterations++
  }
  return iterations
}

const card = getLoopSize(10943862)
console.log({ card })
const door = getLoopSize(12721030)
console.log({ door })

let resultFromDoor = 12721030
for (let i = 0; i < card - 1; i++) {
  resultFromDoor = transform(12721030, resultFromDoor)
}

console.log(resultFromDoor)

let resultFromCard = 10943862
for (let i = 0; i < door - 1; i++) {
  resultFromCard = transform(10943862, resultFromCard)
}

console.log(resultFromCard)
```

Feel free to share your solution in the comments!

________________________

Photo by [Markus Spiske](https://unsplash.com/@markusspiske?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText) on [Unsplash](https://unsplash.com/?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText)
Page Table Entry | Operating System - M05 P12
Tags: linux, devops, beginners, tutorial
Published: 2020-12-26 13:52:43

**This is a multipart blog article series, and in this series I am going to explain you the concepts of operating system. This article series is divided into multiple modules and this is the fifth module which consists of 26 articles.**

_In this article we will see that what is present inside a page table. We will discuss about all the different fields present in page table briefly._

### Page table entry
- In the page table in one row there are many things/details that are placed/ situated.
- We use page table because by the help of page table **MMU** _(Memory management unit)_ maps the logical address into physical address.

<!-- Image will come here -->

![Untitled Diagram.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1608990626057/qqrVSdTU8.png)

1. **Frame No.:** 
    - At this place frame number is written.
    - One or multiple frames can reside in a frame, so when we want to map frame, fame number is used.
2. **Valid/invalid:**
    - Suppose we are finding a page so we go to frame number, this section tell us that whether the page is actually present or not at the frame number. If not than `0` will be written there.
    - It can happen we are using the concept of virtual memory.
3. **Protection:**
    - _(rwx)_ r-> read, w-> write, x-> execute.
    - This section will tell us that the file is protected or not and what type of permission is given to the user who is trying to access the file.
4. **Reference:**
    - We generally do swap-in swap-out of pages from main-memory. So here, we have to tell that whether in past does this page came in the memory or not.
    - When the page is coming first time in the memory than at this place `0` will be written.
5. **Cashing:**
    - It contains a value of enable and disable which means that if we want to enable or disable cashing.
    - When a data is being called multiple times, than we will place that in cash due to which less time will be required to execute that process.
    - But this is not valid at every place such as while doing transactions. 
6. **Dirty/modify:**
    - By the help of dirty we can check that whether the page is modified or not. So by it we can easily and effetely update the hard disk when data is changed.

_So this was all about page table classification. Hope you liked it and learned something new from it._

If you have any doubt, question, quires related to this article or just want to share something with me, than please feel free to contact me. 

### 📱 Contact Me

[Twitter](https://twitter.com/r_mishra10)
[LinkedIn](https://www.linkedin.com/in/rahul-mishra-66210b185)
[Telegram](https://t.me/rahul_mishra10)
[Instagram](https://www.instagram.com/rahul_mishra10/?hl=en)

### 📧 Write a mail
<rahulmishra102000@gmail.com>

#### 🚀 Other links

[GitHub](https://github.com/rahulMishra05)
[HackerRank](https://www.hackerrank.com/rahulmishra10201)
My First JavaScript Challenge: #JavaScriptmas.
Tags: javascript, javascriptmas, scrimba
Published: 2020-12-26 13:51:44

Hi All! 
This is my first JavaScript challenge and I would like to share my experience.
Each morning I woke up wondering what the daily challenge would be.

It is funny now, not at the time, to remember how sometimes in the beginning I thought that the challenge would be easy to resolve and then realize that I had underestimated it.
This gave me the chance to learn to approach problems from different perspectives and to be more patient.

This challenge gave me the opportunity to be more constant with my studies as I had to connect to [Scrimba](https://scrimba.com/) on a daily basis and I always felt motivated to continue studing after completing the daily challenge.

Now that the challenge is over, I have a void that I will try to fill with [Scrimba's weekly Challenge](https://weeklychallenge.scrimba.com/). :)

##See my Javascriptmas Solutions:
* [Day 1. Candies](https://scrimba.com/scrim/co87344bdabf5d2ef4ec3d014)
* [Day 2. Deposit Profit](https://scrimba.com/scrim/coba94ae78767f7be817b4341)
* [Day 3. Chunky Monkey](https://scrimba.com/scrim/co87741bab50cde1b71b72a39)
* [Day 4. Century From Year](https://scrimba.com/scrim/co1b04ec2bb13643195dff40c)
* [Day 5. Reverse A String](https://scrimba.com/scrim/co5a442b7ab6eaf5b62586fc3)
* [Day 6. Sort By Length](https://scrimba.com/scrim/co61b46eb95946935a6fee6a8)
* [Day 7. Count Vowel Consonant](https://scrimba.com/scrim/co7d940caafe0b13f35014d4e)
* [Day 8. The Rolling Dice. Note 1](https://scrimba.com/scrim/co1c840f08d208fc38e9e134d)
* [Day 8. The Rolling Dice. Note 2](https://scrimba.com/scrim/codba438d98efcfeb004a0df0)
* [Day 8. The Rolling Dice. Note 3](https://scrimba.com/scrim/co1f34f18b707f901c33717fb)
* [Day 9. Sum Odd Fibonacci Numbers](https://scrimba.com/scrim/coee6458a8dfc8b342c98c2a5)
* [Day 10. Adjacent Elements Product](https://scrimba.com/scrim/co8d24459860e6130bb502c33)
* [Day 11. Avoid Obstacles](https://scrimba.com/scrim/coeb541fdacd0dbd061769393)
* [Day 12. Valid Time](https://scrimba.com/scrim/co9cc4b49bb4434ce7aa82751)
* [Day 13. Extract Each Kth](https://scrimba.com/scrim/cob9248fbbedb485601f94052)
* [Day 14. Array Maximal Adjacent Difference](https://scrimba.com/scrim/co8c24d468faf0b27fcaab6ed)
* [Day 15. Carousel](https://scrimba.com/scrim/co4ee44c484979d2352dc68eb)
* [Day 16. Insert Dashes](https://scrimba.com/scrim/co0ba4b9e9d615a7cc6b73c0b)
* [Day 17. Different Symbols Naive](https://scrimba.com/scrim/coe364f1f920d540d865889e0)
* [Day 18. Array Previous Less](https://scrimba.com/scrim/cob13482b86fbcb44cb00d172)
* [Day 19. Alphabet Subsequence](https://scrimba.com/scrim/cof4047aa9a520a91e24fa7d4)
* [Day 20. Domain Type](https://scrimba.com/scrim/cod8044df9774097eff2e4028)
* [Day 21. Sum Of Two](https://scrimba.com/scrim/co89247eaa962bfd924dd7ee9)
* [Day 22. Extract Matrix Column](https://scrimba.com/scrim/co66149b5b4a5c8c51faa44b3)
* [Day 23. Social Media Input](https://scrimba.com/scrim/cof4f4ded894e8cb85b99e26f)
* [Day 24. Test your agility](https://scrimba.com/scrim/coef84038bc9fade7c1fae01e)
My code review checklist.
Published: 2020-12-26 13:34:30

Code reviews are a critical and legitimate activity that needs time and focus.

I was thinking recently about the reviews that I was doing and created a checklist for me to adjust before submitting the comments to the pull requests. 

## Review:

- Check out the code and run the new tests manually, try to check if the code is handling edge cases.
- Ensure the code is covering all requirements.
- Checkout code coverage results and ensure the important parts of the code are tested.

## Comments:
- When demanding changes, explain them clearly. Offer suggestions or ask questions, instead of giving a direct todo or even worse just sharing a sample code.
- Don't focus too much on the coding styles or something like making the code one-liner.
- Avoid LGTM comments if possible, if everything is right, write thanks for the work.

## Reply to comments:

- Always be kind to the developer but serious with the code.
- Avoid confusing statements.
- Do not criticize or explain the architectural decision changes as a long comment, instead request a pair review and do the discussion in a verbal way, after the discussion request or try to write the decisions as a comment to make them visible to the team.
2020: My Year In Review
Tags: 2020, yearinreview
Published: 2020-12-26 13:07:02

---
title: 2020: My Year In Review
published: true
description: 2020: My Year In Review
tags: 2020, YearInReview
//cover_image: https://direct_url_to_image.jpg
---
![2020 in Review](https://dev-to-uploads.s3.amazonaws.com/i/ubwu21p4jv3f8cc29267.jpg)

See you next year!
Daily Developer Jokes - Saturday, Dec 26, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-12-26 13:00:21

---
title: "Daily Developer Jokes - Saturday, Dec 26, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Saturday%2C%20Dec%2026%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e1259b6d7a73.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ Did you hear about the programmer that was scared of IDEs?

___A:___ They retreated back into their shell
 -->
FootballStats
Tags: dohackathon
Published: 2020-12-26 12:35:38

## What I built
A React app that consumes a [third party API](https://www.football-data.org/) to provide the League Standings, Top Scorers and Upcoming Matches for top 5 football leagues.

### Category Submission: 
Program for People 


### App Link
[footballStats](https://footballstats.tk)


### Screenshots
![Bundesliga Match day 14 2020-2021](https://dev-to-uploads.s3.amazonaws.com/i/son018887tp4p9asodhd.png)
![Premier League Standings, match day 15](https://dev-to-uploads.s3.amazonaws.com/i/hwo9kexq3p218z8itqd7.png)

### Description
- A Single Page React app.
- Consumes a [third party API](https://www.football-data.org/).
- Uses [service-worker](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API) for caching and push notifications.
- Is installable as a [PWA](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps).
 

### Link to Source Code
[GitHub Repo](https://github.com/rahuldahal/football-stats)

### Permissive License
![MIT](https://img.shields.io/github/license/rahuldahal/football-stats)


## Background
- Always wanted to create an app related to *football*.
- Built to **strengthen** my portfolio.
- Learned how to think in terms of **components**.
- Learned about **service-workers** and **PWA** in general.
- Learned the **ReactJS** workflow and tools.

### How I built it 
- I actually had already built a similar app, without any library/framework.
- Rebuilt that app with **ReactJS** from *scratch*.
- Picked up knowledge relating to offline-first and PWAs.
- Used [Netlify](https://netlify.com) to build and host the site.


### Additional Resources/Info
- [Vanilla JS version of the app](https://vanilla.footballstats.tk)
- [Personal Portfolio](https://rahuldahal.com.np)
- [GitHub Profile](https://github.com/rahuldahal)
Do you listen to music while coding?
Tags: discuss, productivity, watercooler, webdev
Published: 2020-12-26 12:31:58

If you are a music lover then there's no doubt, you listen to music very often while doing many different things. Laundry with Music! Cooking with Music! Workout with Music! 

**But do you listen to music while coding as well?**

Coding requires a lot of focus & if you are constantly distracted by the beats of music then you will certainly end up with a never-ending list of errors or low-quality code. However, this is not true all the times! Some developers say, with music, coding becomes more fun and they can code undistracted with more focus.

# Discuss
---

**Do you think that music helps you focus while coding?** 🤔🎧

**Share your thoughts and opinions in the discussions/comments.**
How Tweakpane can help you
Tags: games, beginners, javascript, programming
Published: 2020-12-26 13:05:36

---
title: How Tweakpane can help you
published: true
date: 2020-12-26 12:26:02 UTC
tags: games,beginners,javascript,programming
canonical_url: https://medium.com/backenders-club/how-tweakpane-can-help-you-3899a3a65956
---

Have you ever wondered how to fine-tune your parameters and monitor their value changes in real-time?

![](https://cdn-images-1.medium.com/max/500/1*9Pee-HNJn5k8VZ1mr8vArg.png)

Assuming you’re building a game or a great animation using any of these game engines listed [here](https://blog.logrocket.com/top-6-javascript-and-html5-game-engines/) or any of these 3D or 2D JavaScript rendering engines [here](https://blog.logrocket.com/top-4-3d-rendering-engines-available-in-js/), and you need a way to monitor your parameter value changes in real-time instead of saving and reloading your pages, that is where Tweakpane comes to play.

In this article, we are going to learn how Tweakpane can help you in fine-tuning your parameters and how you can also monitor value changes in real-time.

### What is Tweakpane?

Tweakpane is a compact pane library for fine-tuning parameters and monitoring value changes in real-time. Tweakpane is greatly inspired by popular [dat.GUI](https://github.com/dataarts/dat.gui) library.

Tweakpane is just a pane added to your web page during development that can be used to switch or change the value of your code parameters and monitor how the new values affect your code.

Tweakpane has many interesting features that make it stand out from the rest, from having clean and intuitive interfaces to easy to use, user-friendly documentation to having responsive mobile support to the panes.

### Getting Started with Tweakpane

Tweakpane can be included in your project in different ways as follows:

via CDN:

```
<script src=" **https://cdn.jsdelivr.net/npm/tweakpane@1.5.4/dist/tweakpane.min.js**"></script>
```

via NPM:

```
npm install --save tweakpane

const Tweakpane = require('tweakpane');
```

After adding tweakpane to your project, using it becomes very easy just by creating an instance of the _Tweakpane_ object.

```
const myPane = new Tweakpane();
```

Lastly, create a parameter object and pass it to the Tweakpane _myPane_ to do its magic.

```
// Parameter object

const PARAMS = {

rotationRate: 0.5,

anotherParam: 'test'

};


// Pass the object and its key to pane

myPane.addInput( **PARAMS** , **'** rotationRate **'** );

// Second Param

myPane.addInput( **PARAMS** , **'** anotherParam **'** );
```

I created a _PARAMS_ object and pass in all the parameters used in my application and called the _addInput_ method of the _Tweakpane_ object to add the individual param to it.

### Monitoring the changes.

You can see a preview of the project here below:

![](https://cdn-images-1.medium.com/max/937/1*AVB5Grjdbb4o6kQdn0opCA.gif)

You can get the code [here.](https://codepen.io/pen/?editors=1010)

### Conclusion

In this article, we have learned about Tweakpane in detail, how to get started, and how to adjust the value of your app in the browser.

Keep Coding :)

* * *
Golang basic: looping
Tags: go, tutorial
Published: 2020-12-26 10:39:52

You wake up and look at the clock and woo it's late to go to work. its always happen to you and make it as daily activity. 
it will repeat the same thing but you can change that until something happen, stop and never happen again.

Is a simple concept of looping doing something until you decide to stop you want to stop until a condition is happen. 

## Write simple code loop
Golang has only have a loop it is ``for`` loop lets we code
``` golang
package main

import "fmt"

func main() {
    for i := 0; i < 10; i++ {
        fmt.Printf("Loop in number %d\n", i)
    }
}
```
We can write loop from 0 ``(i := 0)``, and make a condition ``i<10``, if the condition is not ``true`` looping will be stop. Increase the variable i ``i++``  so the the loop will stop.

## Loop iteration data type
Now the condition is what happen if we want to get value of slice? we can create like below.
``` golang
package main

import "fmt"

func main() {
    fruits := []string{"banana","watermelon","apple","coconut"}

    for i := 0; i < len(fruits); i++ {
        fmt.Printf("Fruit index %d is %s\n", i, fruits[i])
    }
}
```
We create loop ``i`` until ``i`` have value less than 4. and we get fruit at index of ``i``, but it is not a best practice, we know that we can use ``range`` instead.
``` golang
package main

import "fmt"

func main() {
    fruits := []string{"banana","watermelon","apple","coconut"}

    for i, item := range fruits {
        fmt.Printf("Fruit index %d is %s\n", i, item)
    }
}
```
## Nested loop
Imagine we want to create coordinate that have latitude and longitude. We can create is nested as below.
``` golang
package main

import "fmt"

func main() {
    for i := 0; i < 10; i++ {
        for j := 0; j < 20; j++ {
            fmt.Printf("%d%d ",i,j)
        }
        fmt.Println()
    }
}
```
## Infinity loop
How if we don't know when we should stop the loop. we can use infinity loop, but the question is how to stop infinity loop? actually loop it will stop manually using key ``break`` like below.
``` golang
package main

import "fmt"

func main() {
    for true {
        fmt.Printf("Infinity loop")
        break
    }
}
```
## Conclusion 
Now we know about loop so you can write "I will not do that again" 100 times without write it until 100 manually.