teleren/devto huggingface dataset:
HOW TO INSTALL AND CONFIGURE MONGODB ON WINDOWS 10
Published: 2020-12-17 09:10:04

#1.INTRODUCTION
In this tutorial, we are going to show you how to install MongoDB on Windows 10 operating system .Lets start by briefly understanding what MongoDB is all about.
##History of MongoDB
MongoDB was created by Eliot and Dwight (founders of DoubleClick) in 2007, when they faced scalability issues while working with relational database. The organization that developed MongoDB was originally known as 10gen.
In Feb 2009, they changed their business model and released MongoDB as an open source Project. The organization changed its name in 2013 and now known as MongoDB Inc.
##What is MongodDB?
 MongoDB is a NoSQL database. There are different types of NoSQL databases, so to be specific :
MongoDB is an open source, document oriented database that stores data in the form of documents (key and value pairs). 
###What is a document?
If you came from a relational database background then you can think of them as rows in RDBMS.
#2.INSTALLATION
   ###STEP1
  Go to MongoDB official download Page following this [link](https://www.mongodb.com/download-center#community) select your operating system as windows and click download as shown in the screenshot below. 
![mongodb download page](https://dev-to-uploads.s3.amazonaws.com/i/w513znh4wtkxw4vzs1l1.png)
A .msi file like this _mongodb-windows-x86_64-4.4.2-signed_ will be downloaded in your system. Double click on the file to run the installer. 
 ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/e25bj6kcknitbqcxkjon.png)
###Step 2:
 Click Next when the MongoDB installation window pops up.
 ![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/eytmdhkv4f0tw0551mh7.png)
##Step 3: Accept the MongoDB user Agreement and click Next.
That’s it.Wait for it to install Click Finish once the MongoDB installation is complete.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/yk0u7i0pvfjnf6vssmek.png)
#3.Configuration
###Step1
Go to the server path of _mongoDb_ in Program Files and copy the  bin folder path as shown below on the screenshot
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/bvagefsy9xiy3gr6cspp.png)
###Step 2
Now we need to add the path we copy to the system environment variable path so we can access mongoDB from our windows terminal directly and carry out operations.lets do this as show on screenshots below
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/yk0u7i0pvfjnf6vssmek.png)
###Lets click on Environment Variables and Click on Path Variables
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/wb2va03qb9asofwjsbcw.png)
click on new 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/16fxpmz1esaps379w45i.png)
Now lets paste the path to the bin folder we copied earlier to the new variable path we created 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/bfz5262wbp5ckbcd9071.png)
Now to check if its working we are going to run our command prompt as an administrator and run the command _mongo --version_ and if you see as shown on the screenshot below then its working.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/45b08ebfbssd29sulofa.png)
Thanks for reading see you next time.
CSS Flexbox: justify-content
Tags: css, beginners, codenewbie, todayilearned
Published: 2020-12-17 09:06:13

Hello Fellow Codenewbies 👋

We've learned in the [previous post](https://dev.to/adiatiayu/a-dip-into-css-flexbox-22e6) that applying `display: flex` to a flex container by default will turn flex items into columns. 

And when the total width of flex items is bigger than the container, they will stretch to fit the horizontal axis of the flex container.

There could be a case where we have extra space when *the flex container's width is bigger* than the total width of the flex items as below:

{% codepen https://codepen.io/adiati/pen/poEyYyx %}

---
# Spacing Out The Columns With Flexbox

How to give space to the columns so the layout would fall nicely into places?
There is a property that controls the space on the *main axis* (horizontal position) of a flex container.
That property is [justify-content](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content).
<br>
📝 **Note**: 
We always put flex properties in the same place where we assign `display: flex`.

## The Values of `justify-content`

### space-between
 What it does is it takes the extra space, divides it, and put them ***between*** the columns.
⭐ This value is commonly used to space out columns.

![space-between.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1607338967596/oo2A2QI0m.jpeg)

### space-around
It does the same as `space-between`, but the difference is that it puts the extra space ***around*** a column.


![space-around.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1607340419257/SXuDeCcAu.jpeg)
*I draw partitions so you can see the spaces on the left and the right of each column.*

### space-evenly
Visually `space-evenly` makes the layout look balance because it divides and puts the extra space ***evenly***.

![space-evenly.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1607340555406/eoHlGnjU8.jpeg)
<br>

#### Now, what if we want to position all of our columns on one side and not worrying about the space?
<br>

### flex-start
This is the **default** value of `justify-content`.
It makes the columns positioned to the ***left*** (start) of the flex container.

![flex-start.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1607342011796/j-0WUo58E.jpeg)

### center
As the name stated, it is positioned the columns to the ***center*** of the flex container.

![center.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1607342158607/E_WC0XdPr.jpeg)

### flex-end
It is positioned the columns to the ***right*** (end) of the flex container.

![flex-end.jpg](https://cdn.hashnode.com/res/hashnode/image/upload/v1607342204248/4MP4xWVkV.jpeg)

## Conclusion
- `justify-content` property works with *main axis* (horizontal position) and is used to space out columns in a flex container.
- When we care about spacing for the layout, we can use one of these values:
  - space-between
  - space-around
  - space-evenly
- When we are not worrying about spacing and want to position the columns on one side, we can use one of these values:
  - flex-start (***default***)
  - center
  - flex-end
Adding the DO deploy button
Tags: dohackathon, gamedev
Published: 2020-12-17 09:03:30

series : ["Bacteria Wars Server"]

In order for other devs to test out our socket based server for our multiplayer game we have added a button to deploy it on Digital Ocean in one click.

We have followed the documentation from here: https://www.digitalocean.com/docs/app-platform/how-to/add-deploy-do-button/
VueJS : You talk, get your colors.
Tags: vue, css, saas, javascript
Published: 2020-12-17 08:47:33

On [color.abstraktion.io](https://color.abstraktion.io/?utm_source=dev.to) we launched a beta service to get a 6 colors palette from a word. You can activate your microphone and speak, you’ll instantly get an inspiration image from Unsplash and get an automatic palette from it.

By clicking on the colors you copy the hex code. You can also copy the entire palette in one click.

You also can change randomly the pictures with the same keyword or generate randomly a keyword and see the result. And of course you can upload or drop a picture that stays only into your browser.

This small application should be useful for fashion designers, stylists and webdesigners.
Introducing Gawaiso
Tags: android, windows, ios, linux
Published: 2020-12-17 08:06:02

Perkenalkan website [Gawaiso](https://gawaiso.com) sebagai pelopor tutorial teknologi dan otak-atik. Mulai dari HP sampai ke PC atau laptop.

Semua artikel yang tertulis di sana ditulis berdasarkan pengalaman pribadi. Bukan sekadar rewrite yang belum tentu dicoba sendiri.

Dengan demikian, dijamin artikel di Gawaiso valid dan bekerja. Maka dari itu saya sebagai pengembang sekaligus SEO spesialis, sangat merekomendasikan website tersebut untuk diakses.

Tampilan UI/UX-nya mungkin sederhana. Kami memfokuskan layanan pada kenyamanan pembaca dalam memahami isi artikel. Itulah sebabnya kami menyewa penulis profesional yang sangat teliti dalam membuat sebuah artikel.

Tertarik, silakan dikunjungi sendiri, ya!
IF code is commented properly THEN readability is good and ELSE is a useful construct.
Tags: codequality
Published: 2020-12-17 07:58:32

Here's my opinion on the numerous attempts to improve code readability by dropping useful language constructs such as ELSE. 

Readability IS a sign of code quality - for sure. And it boosts the value of software for quite obvious reasons. 

HOWEVER, that is NOT achieved effectively enough by dropping useful elements of the coding language. You can't assert "never use a knive!" simply because MISUSE of knives is dangerous and can be BLOODY.

INSTEAD, consider focussing on MORE and proper COMMENTING (surely you can comment your code even better than in the example below):

// Process the passed argument, ... the result of the ... calculation ... , ... if it IS useful
if myVariable != nil {
//DoSomeUsefulStuff(myVariable)
}

Now judge by yourself how well the else part reads if commented (do provide logical context of the preceeding IF logic)

// Drop out of the function / procedure if the passed argument, ... the result of the ... calculation ... , ... is NOT useful
} else {
return “”
}

My personal bottom line on code readability: do COMMENT amply;
What is the difference between a float and a double?
Tags: c, programming
Published: 2020-12-17 07:56:10

For representing floating-point numbers, we use float, double and long double.

#Float:
Float is a 32 bit IEEE 754 single-precision floating-point Numbers in which 1 bit is used for the sign, 8 bits for the exponent, and 32* for the value. The float data type has 7 decimal digits of precision.

##Example:
```
float a = 1.f / 81;

float b = 0;

for (int i = 0; i < 729; ++ i)

 b += a;

printf("%.7g\n", b);
```
###Output:

`
9.000023
`

---
title:What is the difference between a float and a double?
tags: C, PROGRAMMING
canonical_url: https://kodlogs.com/blog/706/what-is-the-difference-between-a-float-and-a-double
---

##Double:
Double is a 64 bit IEEE 754 double-precision floating-point numbers in which 1 bit is used to represent the sign, 11 bits for the exponent, and 52* bits for the value. The double data type has 15 decimal digits of precision.

Example:
```
double a = 1.0 / 81;

double b = 0;

for (int i = 0; i < 729; ++ i)

b += a;

printf("%.15g\n", b);
```
###Output: 
`
8.99999999999996
`
**Note:**
The maximum value of float is about 3e38 and double is about 1.7e308. So, using the float can hit “infinity” much more easily than double for something simple like computing the factorial of 60.
403 Errors, Server too busy? Here's a solution.
Published: 2020-12-17 07:11:35

Our backend didn't have an endpoint to save an array of persons.  Forkjoin didn't work either as it fired off post requests too rapidly. 

We tried an interval first without the awaiter:

```typescript
let sub =
  interval(2000).subscribe(async (k) => 
  let person = this.persons[k];
  if (person) {
    await this.savePerson(persons);
  }else{ 
     sub.unsubscribe(); 
  }
```
That didn't work because all of the posts were fired at the same time as if they were waiting for the post-angular-rendering cycle. We know from past experience that http requests don't happen until the end.  After putting in the await coupled with this code we were in luck.

```typescript 
async savePerson(person) {
 return new Promise((resolve, reject) => {
   this.rs.postPerson(person).subscribe(
   (result) => {
     resolve(result);
   },
   (error) => {
      reject("");
   });
  }
 }
```

Now we have full control over how fast our posts are fired off.
List of illustration resources.
Published: 2020-12-17 07:52:02

I have created a list of websites which offer `free + paid ` illustration.

It contain name and link of total `60websites` from where you can easily download free + paid illustrations.

You can even filter the list based on different features like illustration type, illustration price, can be used in commercial or not, attribution required or not.

You can get the list from here: https://gumroad.com/l/illustrationslist


Thanks
Bad request your browser sent a request that this server could not understand.
Tags: webdev, computerscience
Published: 2020-12-17 07:51:47

In this article, we are going to discuss what are the meanings of bad request error? why this error occurs, and what are the major reasons for this error?

#What is a 400 bad request error?
A 400 bad request error occurs when the server cannot understand a request that has been made for it. It is called a 400 error because of the HTTP status code that the webserver uses to describe that kind of error.

##Problem:
When a user attempt to access a website, sometimes he can receive an error a “Bad Request” error message where the website content should have uploaded. This error often includes the number “400” and can include some additional text like “Your browser sent a request that this server could not understand. Size of a request header field exceeds server limit”..

---
title:Bad request your browser sent a request that this server could not understand.
tags: internet, website
canonical_url: https://kodlogs.com/blog/1972/request-your-browser-sent-request-server-could-understand
---

###Solution:
First, check the website URL that you entered to make sure that it is correct. If the web address appears to be entered correctly, then the issue can be resolved by clearing the browser cache and cookies. To perform these steps, click on the appropriate link for the web browser you are using.

I hope this will help to solve your problem.
This is a Offline Html,Css,JavaScript library for beginners
Tags: html, css, javascript, library
Published: 2020-12-17 07:33:56

hey there,

if you are reading this Post that means you are in the search of a offline library 

then you are at the correct place

check out my Github Project 
to Download it

here is the link
https://github.com/ameyadeogirkar/My-Library.git
Shell 101: Keeping Dotfiles in Source Control
Tags: bash, zsh, shell
Published: 2020-12-17 07:10:27

---
title: Shell 101: Keeping Dotfiles in Source Control
published: true
description: Make your shell customizations both seamless and permanent.
tags: bash, zsh, shell
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/kmoc77xnugtph80h28w9.png
---

I want shell customizations made in my dotfiles to be both seamless and permanent.

So before we start customizing our shell, let's take five minutes and put our dotfiles in a git repostiroy so we can reproduce our environment and remove friction to future updates.

{% youtube 6Rprx1gY9Ps %}

First we're going to create a new git repo in whatever directory we keep our code in. (For me, it's in `~/code`)

```bash
~/ $ cd ~/code
~/code $ mkdir dotfiles
~/code $ cd dotfiles
~/code/dotfiles $ git init
```

Then we're going to make an install script to make installs automated in the future.

We're going to keep our profile in a `zshrc` file in source control and use the `ln` command to make a symbolic link to it at `~/.zshrc` (the default place zsh will look for a profile).

We're also going to delete an existing `~/.zshrc` if it exists.

(If you have anything existing in your `~/.zshrc` make sure you back it up now.)

In .`/install.sh` we write:
```bash
echo "Linking Files... 🚀"

[[ -s "$HOME/.zshrc" ]] && rm ~/.zshrc

ln ./zshrc ~/.zshrc

echo "Done 🌈"
```

To make it executable, we `chmod 755 ./install.sh`

Now we're going to have to actually create a `zshrc`. Let's just write something basic for now to make sure our script works.

```bash
alias l="ls -al"
```

Save this and run `./install.sh` and bam, we have a `.zshrc`. However, you might notice our current shell doesn't actually have our changes. We need to open a new shell (our run `source ~/.zshrc`) to see our new `l` command. This is a lot of friction to make future changes, so lets write two new functions in our `zshrc.` to make updates seamless next time.

```bash
function reprofile() {
  source ~/.zshrc
  echo "Dotfiles reloaded 🌈"
}

function editzsh() {
  # replace vi with your editor of choice
  vi ~/.zshrc
  reprofile
}
```

(You can replace `vi` with your editor of choice, but `editzsh` really shines if you use a terminal based editor, since `reprofile` will automatically run and resource your profile after you exit your terminal based editor.)

That's it for our starter template! If you don't want to type that manually you can fork [all the code we just wrote](https://github.com/ignu/dotfiles-example/tree/blank-slate) or peak at my [existing dotfiles](https://github.com/ignu/dotfiles) for some ideas and to see where this series is heading.
Test Driven Development (TDD) th.
Tags: tdd, programming
Published: 2020-12-17 06:57:52

#TDD คือ 
การสร้าง software ใน scope สั้นๆ โดยเราจะเขียน automate test เอาไว้ให้มัน fail ก่อนเพื่อจะกำหนดการทำงานของโปรแกรมในระดับ function แล้วเขียน code เพื่อให้ผ่าน test (เขียนให้ผ่านก่อน) แล้วเรามา refactor ให้มันดีขึ้นอีกที


![tdd](http://newyorkschooltalk.org/wp-content/uploads/2020/02/1_ieVWcSsJmeBbZFo6a_dL5g.png)
######http://newyorkschooltalk.org/wp-content/uploads/2020/02/1_ieVWcSsJmeBbZFo6a_dL5g.png


#Step
1. เขียน test (เพื่อให้เห็น scope ของโปรแกรมของเรา)
2. run ให้ fail
3. เขียน code เขียนให้ผ่านก่อน
4. เทสที่เคย fail จะ pass จากการเขียน code
5. Refactor แก้ไข ให้ดีขึ้น 

##ข้อดี
* มั่นใจของเก่าไม่พัง 
* debug ง่าย 
* requirement ไม่หาย 
* เราจะสามารถมั่นใจได้ว่าโปรแกรมทำงานได้ตรงตามที่เราเขียนจริงๆ

##ข้อเสีย
* นานเพราะต้องศึกษา 
* เสียเวลาเขียนเทสวุ่นเว้อ 
* ใช้ประสบการณ์สูง
* ประเมิณเวลายาก เพราะต้องรวมเวลาเขียน test

#สรุป
มันน้อยใช่ไหมละที่เขียนมา ใช่น้อยมากเลยแต่จริงๆ มองภาพรวมอาจจะง่ายแต่การแตก task สิ่งที่โปรแกรมเราต้องทำให้ละเอียดพอที่จะเขียน test แต่แรกนั้นต้องใช้เวลาในการฝึก การคิด test case ที่ครอบคลุมมากพอก็ไม่ใช่เรื่องง่าย การเขียน code ที่จะทำให้เราสามารถ mock data เพื่อ test ก็ต้องอาศัยแนวคิด จนกระทั่ง step สุดท้าย refactor อาจจะต้องอาศัยความรู้เรื่อง clean code หรือประสบการณ์ ที่มากพอถึงจะสามารถทำออกมาได้ดีได้

*อาจจะต้องใช้ ความทุ่มเท ใส่ใจ และ passion เพื่อจะเป็นมืออาชีพ*
Writing Your First REST API
Tags: node, javascript, beginners, express
Published: 2020-12-17 06:50:16

**REST API**

so this is the second part to my previous post 'Understanding REST api',in this part we'll make a small REST - API in node JS. so without further ado let's start making your first ever API

**TOOLS**

1. install node js (https://nodejs.org)
2. install vs code (editor)
3. install POSTMAN (for testing routes)

**Steps**


- create a folder
- initialize the folder with 
```
npm init -y
``` 
- open the folder in vscode
- type *ctrl+shift+`* in your keyboard to open integrated terminal
- we'll be using expressjs for writing api
- so in terminal type ```npm install express uuid```
- uuid will help us to create a RFC random id
- in ```package.json``` go to scripts and replace tests with 
```
"scripts":{
    "start":"node app.js"
}
```

**LET'S start**

create a file called ```app.js``` in your root folder 
inside ```app.js``` write the following code

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

all of our routes are stores in folder called ```routes/routes.js```
inside ```routes.js``` write the following code

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

**how to check whether request working or not?**
open the postman , if you want a get request ,select GET from a dropdown , and type endpoint in url section

you can checkout the code at : https://github.com/WhoAdarshPandya/rest_for_beginners

in upcoming blogs , we'll cover how to deploy a complete rest api on heroku :)
How to generate Cosmos DB sample data
Tags: cosmosdb, sample, azure
Published: 2020-12-17 06:45:32

Do you need sample data for Cosmos DB? The easiest way (which I found so far) is to use import tool and sample data in json format.

# Prerequisites

- Cosmos DB account
- [Data migration tool pre-build binary](https://aka.ms/csdmtool) or download [Source code in GitHub](https://github.com/azure/azure-documentdb-datamigrationtool) and compile by yourself
- [Azure Cosmos DB Sample data](https://github.com/Azure-Samples/azure-cosmos-db-sample-data)

# Setup Cosmos DB

First thing first. You need Cosmos DB account, database and collection.

I created volcanodb and volcanocollection.

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

# Use migration tool to import sample data

This time, I use GUI tool. If you prefer CUI, run dt.exe instead.

1\. Download pre-build binary or source code and build.

2\. Open dtui.exe.

3\. Click [Add files] and select VolcanoData.json in GUI.

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

4\. Go to Cosmos DB page in Azure Portal and confirm connection string.

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

5\. Add "Database=volcanodb" at the end of connection string and past it to migration tool. Click Verify.

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

6\. Enter collection name and complete the wizard.

Once you complete all steps, sample data should be uploaded to your Cosmos DB collection.

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

# Reference
[Tutorial: Use Data migration tool to migrate your data to Azure Cosmos DB](https://docs.microsoft.com/en-us/azure/cosmos-db/import-data)
[Azure Cosmos DB Sample Data](https://github.com/Azure-Samples/azure-cosmos-db-sample-data)
Day 17 of JavaScriptmas - Different Symbol Naive
Tags: javascript, scrimba, 24daysofjavascriptmas
Published: 2020-12-17 06:36:00

Day 17 is to collect the number of unique characters in a word/sentence.

For instance, a word `cabca` will have 3 different unique characters `a`,`b`, and `c` which going to return `3`.

There are 2 methods to calculate unique characters using JavaScript
###**1st - Comparing Empty array with existing Array**
```javascript
function differentSymbolsNaive(str) {
    let uniqLetters = [];
    let strArr = str.split('');
    strArr.map(letter => { 
        if (!uniqLetters.includes(letter)) {
            uniqLetters.push(letter)
        }
    });
    
    return uniqLetters.length;
}
```
###**2nd - Use spread operator with Set**
```javascript
function differentSymbolsNaive(str) {
    let uniqLetters = [...new Set(str)];
    
    return uniqLetters.length;
} 
```
Personally, the 2nd approach is much easier and less code. 
But the 1st one is more explicit and much easier to understand for beginner.

Even the 2nd approach can be shorten 
###**2nd - Use spread operator with Set -- Shorten**
```javascript
function differentSymbolsNaive(str) {    
    return [...new Set(str)].length;
} 
```
Or
###**Single line of code with Arrow Function**
```javascript
const differentSymbolsNaive = str => [...new Set(str)].length;
```