teleren/devto huggingface dataset:
Best Tools For Building Your First MERN Application
Tags: webdev, javascript, programming, beginners
Published: 2023-02-17 14:08:57

In this article, I will share with you my list of the top tools to use when building your first web application using the MERN stack

## What is the MERN stack

The MERN stack refers to MongoDB, Express.js, React.js, and Node.js - four tools used to build full-fledged web applications.

The main benefit of this stack is that it uses only one programming language, JavaScript, throughout the entire development process. This simplifies development, as developers don't need to switch between multiple languages.

### Tool You Need for Your App

Having the right tools for all your apps can make a huge difference in their performance. With these tools, you can ensure that your apps are running smoothly and efficiently. These tools are:

- [npm](https://www.npmjs.com/) or [yarn](https://yarnpkg.com/) which are tools to use to install the different packages of your web application
- Node.js
- Some code editor like [Visual Studio Code](https://code.visualstudio.com/)

### Tools to Use for Frontend Stack

When building a frontend stack, there are a number of tools to choose from. These tools can help you create a smooth, efficient user experience.

- If you are building a single page application, you can use Create-react-app to generate your frontend code. If you are building a static website, you can try [Gatsby](https://www.gatsbyjs.com/)
- For state management, you can use [Redux](https://redux.js.org/)
- To perform unit testing and end to end testing on your code, you can use [Jest](https://jestjs.io/) and [cypress](https://www.cypress.io/)
- [Vercel](https://vercel.com/), [Netlify](https://www.netlify.com/) or some similar hosting platform to deploy your frontend code

### Tools to Use for Backend Stack

- [ExpressJS](https://expressjs.com/) to create your backend endpoints
- [Jest](https://jestjs.io/) to test your backend code
- An instance of [MongoDB](https://www.mongodb.com/) on your server
- [Mongoose](https://mongoosejs.com/) to connect to your MongoDB instance from your backend code
- Some hosting service like [Firebase](https://firebase.google.com/) or [Heroku](https://www.heroku.com/) to deploy your backend code

---

**_NOTE:_** If you found this helpful. Like and share. Thanks, Happy Learning!

### Let's connect 💜

You can follow me on [Twitter](https://twitter.com/MrDanishSaleem), [Instagram](https://www.instagram.com/mrdanishsaleem/), [LinkedIn](https://www.linkedin.com/in/mrdanishsaleem/) & [GitHub](https://github.com/mrdanishsaleem/)

### Support Me

If you like this post. Kindly support me by [Buying Me a Coffee](https://www.buymeacoffee.com/mrdanishsaleem)
Path conversion in git bash
Tags: bash, git, shell, windows
Published: 2023-02-17 13:49:47

Hello again, 

today i have a small advice for you if you work with the git bash on windows. 

To quickly convert paths from windows format to unix format you can use the **cygpath** tool: 

Unix to windows: 
```shell
$ cygpath -w /d/temp
D:\temp
```

Windows to unix: 
```shell
$ cygpath -u 'D:\temp'
/d/temp
```

Another nice tool that helps you with the conversion of an relative path is **realpath**. This is useful because it allows your scripts to accept relative paths and than figure out the absolute paths themselve. 

Example: 
```shell
$ ls 
test.txt
$ realpath -s ./test.txt
/d/realpathtest/test.txt
```

When you give an absolute path to realpath it will just print this path. So if you are working with file paths, this will make your scripts more flexible. 

```shell 
$ realpath -s /d/realpathtest/test.txt
/d/realpathtest/test.txt
````
Introduction to Python for Data Science
Published: 2023-02-17 13:30:57

Python is a widely used programming language that has become popular among data scientists due to its simple and concise syntax, robust libraries, and powerful tools for data analysis and visualization. In this article, I will provide an introduction to Python for data science, covering its key features, tools, and resources for beginners.

Python was created by Guido van Rossum in the late 1980s as a general-purpose programming language. Since then, it has grown to become one of the most widely used programming languages in the world. Its popularity in the data science community can be attributed to several key factors, including its readability, ease of use, and the wide range of libraries available for data analysis and visualization.

One of the most popular libraries for data science in Python is NumPy, which provides powerful tools for numerical computing and matrix operations. Pandas is another popular library that provides tools for data manipulation, transformation, and analysis. Matplotlib and Seaborn are popular libraries for data visualization, which enable users to create high-quality plots and charts for data exploration and presentation.

Python also has a number of tools for machine learning, including scikit-learn, which provides a range of machine learning algorithms for classification, regression, clustering, and more. TensorFlow and PyTorch are popular frameworks for deep learning, which enable users to build and train neural networks for image recognition, natural language processing, and other applications.

In addition to these libraries and tools, Python has a strong and supportive community of users and developers who contribute to its development and create resources for learners. There are numerous online courses, tutorials, and forums available for beginners to learn Python and data science, as well as books and conferences for more advanced users.

In conclusion, Python is a powerful and flexible programming language that has become a popular choice for data science due to its readability, ease of use, and the wide range of libraries and tools available. As data science continues to grow and evolve, Python is likely to remain a key player in this field.
This Week In Python
Tags: python, discuss, thisweekinpython
Published: 2023-02-17 13:03:16


**Fri, February 17, 2023**


This Week in Python is a concise reading list about what happened in the past week in the Python universe. 

**I have received some good suggestions for this week's content. Thank you.**

**Did I miss anything from the Python universe this week? What did you read or tried out?**


## Python Articles



- [The Heisenbug lurking in your async code](https://textual.textualize.io/blog/2023/02/11/the-heisenbug-lurking-in-your-async-code/)
- [Does Python still have a need for class without @dataclass?](https://blog.glyph.im/2023/02/data-classification.html)
- [Functional Python: Dial M for Monoid](https://www.tweag.io/blog/2023-01-19-fp2-dial-m-for-monoid/)
- [Use TOML for `.env` files?](https://snarky.ca/use-toml-for-env-files/)
- [Pandas Illustrated: The Definitive Visual Guide to Pandas](https://betterprogramming.pub/pandas-illustrated-the-definitive-visual-guide-to-pandas-c31fa921a43)



## Projects


- [pyCirclize](https://github.com/moshi4/pyCirclize) – Circular visualization in Python
- [trio](https://github.com/python-trio/trio) – a friendly Python library for async concurrency and I/O 
- [prettymaps](https://github.com/marceloprates/prettymaps) – A small set of Python functions to draw pretty maps from OpenStreetMap data
- [pynimate](https://github.com/julkaar9/pynimate) – Python package for statistical data animations
- [rtx](https://github.com/jdxcode/rtx) – Runtime Executor (asdf rust clone)

**Did I miss anything from the Python universe this week? What did you read or tried out?**
Windows 11 Insider Dev Build 25300.1000 把我的鍵盤滑鼠變不見了
Tags: windows
Published: 2023-02-17 12:59:55

更新：[25309]([25309](https://blogs.windows.com/windows-insider/2023/03/02/announcing-windows-11-insider-preview-build-25309/)) 已經解決這個問題。

在更新成 [ Windows 11 Insider Dev Build 25295.1000](https://www.elevenforum.com/t/windows-11-insider-dev-build-25295-1000-rs_prerelease-feb-9.12521/page-5#post-261141) 之後, 一開機馬上發現我的藍牙鍵盤滑鼠通通連不上, 透過筆電上原本的鍵盤操作一看不得了, 我的 USB 控制器是被打驚嘆號：

![](https://i.imgur.com/iawD0Le.png)

它說我的驅動程式無法認證通過：

![](https://i.imgur.com/DkgOjW3.png)

由於 USB 驅動程式起不來, 所以就算我要外接有線鍵盤也沒有用。更慘的是, 因為筆電上的藍牙是走 USB 介面, 所以藍牙也失效了。

根據網友的說明, 這應該是[驅動程式強制簽章 (driver signature enforcement)](https://www.elevenforum.com/t/windows-11-insider-dev-build-25295-1000-rs_prerelease-feb-9.12521/post-259785) 功能把 USB 驅動程式檔掉了, 權宜之計就是利用**進階啟動選項**停用驅動程式強制簽章, [這一篇文章](https://windowsreport.com/driver-signature-enforcement-windows-10/) 提供了幾種暫時或是永久停用驅動程式強制簽章的方法。

目前使用按住 <kbd>shift</kbd> 不放, 按開始功能表內電源鈕的**重新啟動**項目進入**移難排解/進階選項/啟動設定**, 再按**重新啟動**後選擇**停用驅動程式強制簽章**後開機就正常了。不過在上述過程中畫面不知道為什麼不會自動更新, 必須滑鼠滑過的區域才會更新, 點選選項時也是艱辛萬苦。

這個狀況並非所有電腦都會發生, 像是論壇上就有 Dell 電腦都沒事, 我的筆電是 Asus 的, 就會中招。你可能會覺得奇怪, 幹嘛一定要升級？其實是因為編號 [25290](https://blogs.windows.com/windows-insider/2023/02/09/announcing-windows-11-insider-preview-build-25295/) 的建置版本會讓 Windows Terminal 當掉, 還會讓我使用的 PickPic 截圖軟體突然失效, 而 [25300](https://blogs.windows.com/windows-insider/2023/02/15/announcing-windows-11-insier-preview-build-25300/) 微軟說修正了, 不得不先更新 25295, 才能更新到 25300。
Resolvendo problemas no HackerRank: Puxando o menor valor de um array
Tags: javascript, beginners, programming
Published: 2023-02-17 12:49:05

Olá, seja bem vindo a mais uma etapa do Resolvendo problemas no Hacker-Rank,nessa sessão iremos analisar a frequência de pássaros que passaram dentro de um array. Veremos agora!

**Migratory Birds -**

Dada uma matriz de avistamentos de pássaros em que cada elemento representa um id de tipo de pássaro, determine o id do tipo avistado com mais frequência. Se mais de 1 tipo foi detectado nessa quantidade máxima, retorne o menor de seus ids.

- Em resumo, existe um array `arr`que guarda o número de vezes que cada pássaro passou, e devemos pegar o menor valor do número de vezes.

Vejamos um exemplo:

```
6 // comprimento de arrays no arr
1 4 4 4 5 3 // matrix arr

4 // o num 4 repete mais vezes,como não existe nenhuma repetição maior que ele, e também nenhuma igual que fosse um número menor, o resultado é : 4.
```

Vejamos outro exemplo para compreender perfeitamente:

```
11 // comprimento de arrays no arr
1 2 3 4 5 4 3 2 1 3 4 // matrix arr

3// tanto o tipo 3,como 4 se repetem 3 vezes a mais que o restante, entretanto, a segunda regra diz que caso isso ocorra, o menor valor deve prevalecer.
```

Vamos então ao código de execução do desafio:

```
function migratoryBirds(arr) {
// O metodo reduce eh usado para acumular um objeto count que mapeia cada tipo de passaro para o numero de vezes que ele foi observado. Para cada elemento curr do array, a funcao atualiza o contador acc, que correspondente ao tipo de passaro curr
    
  const count = arr.reduce((acc, curr) => {
    acc[curr] = (acc[curr] || 0) + 1;
    return acc;
  }, {});

//Obejct.values -> retorna um array com os valores das propriedades do objeto count

  const maxBirds = Math.max(...Object.values(count));

// usa o metodo Object.keys para obter as chaves do objeto count, que sao os tipos de passaro. Em seguida, ela usa o metodo find para encontrar a chave (ou seja, o tipo de passaro) cujo valor no objeto count eh igual ao valor maximo encontrado anteriormente.

  return parseInt(Object.keys(count).find(key => count[key] === maxBirds));

}
```
O resultado será:

```
6
1 4 4 4 5 3

4
```

```
11
1 2 3 4 5 4 3 2 1 3 4

3
```

Com isso concluímos mais um episódio, e nos vemos na próxima!!!
Reminder: Contribute means opening issues and documentation too
Tags: career, beginners, opensource, discuss
Published: 2023-02-17 12:20:34

One of the things that I still need to achieve in my professional career is to contribute more to open source software. This being said, I don't beat myself up about it, as juggling a full-time job and personal responsibilities is simply a fact of life for me.

It's important to remember that contributing to the community isn't just about _fixing bugs in the core library_.
 
Opening an issue because something in the documentation is outdated, proposing an improvement to a paragraph in the documentation, or opening a detailed bug... all of these little things are also contributions.

In the last few months, I've opened issues (mostly related to documentation) at `@microsoft`, `@npm`, `@mdn`, `@reactjs`, and `@storybook`; I like to think that they are small, yet valuable, contributions to the community.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4wnaxhluf2qtw2j5fmeu.png)

What do you think 💚?
Git Rebase vs Git Merge
Tags: git, programming, tutorial, github
Published: 2023-02-17 12:18:21

Git Rebase and Git Merge are commands generally used to merge two branches. The difference here is the way they do this combination.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/43sfnxsa1wjdpcaqnioz.png)

When we typed “git Rebase”, all the changes of the feature branch will be added to the master branch one by one. Here, if we search for a historical history, we will see only one history. Because when we typed “git rebase”, a single history will be created because all branches are collected on a single path.

### Advantages of Git Rebase
- Converts complex history into a single format
- Simplifies DevOps work by reducing multiple comments to a single comment.

### Advantages of Git Merge
- Simple and clear
- Preserves the history in chronological order
- Protects branches

---

## Which Should We Use?

If you are working with a single or small team, it will be more advantageous to use git rebase. But if you’re working with a big team, use git merge.
Optimized Search Filter React Js | Filter, Debounce, Infinite Scrolling (Pagination) | All in one
Tags: webdev, react, tutorial, javascript
Published: 2023-02-17 12:13:21

Here's an in depth tutorial on how to build an optimized search filter that also includes debouncing and infinite scrolling for improved performance. You will learn quite a lot many important production/industry level advanced concepts through this one video.

link- https://www.youtube.com/watch?v=8TgMRJoUSMc

If you are interested in react, JavaScript or frontend development in general, Do checkout and subscribe [xplodivity](https://www.youtube.com/@xplodivity/videos) on youtube
Hello World!
Tags: webdev, tech, drone
Published: 2023-02-17 12:12:26

Hi, I'm Atharva Kolekar, under graduate student of FY B.Tech in CS. I am passionate about electronics, computers, and technology. Also, I am a Full stack web developer and designer with more than 4yrs of experience in designing good quality websites. Rest of all, I love travelling, creating IoT projects & many more!

Connect with me:
LinkedIn[](https://www.linkedin.com/in/atharva-kolekar/)
GitHub[](https://github.com/AtharvaKolekar)
What is Blazor?
Tags: csharp, dotnet, blazor, webassembly
Published: 2023-02-17 11:38:00

Blazor is a Framework to create client-side interactive Web-UIs with .NET.

**Pros:**
- Interactive UIs with C# instead of JavaScript
- .NET App-Logic for Server and Client
- Browser-Compatibility (incl. Mobile)

In this article I want to give you a quick overview of the Blazor technology of .NET.

## Contents
- [Razor-Markup](#razormarkup)
- [Blazor WebAssembly](#blazor-webassembly)
- [Blazor Server](#blazor-server)
- [Progressive Web Apps](#progressive-web-apps)

## Razor-Markup
Blazor apps are based on **Components** like pages, forms, etc. that can be **nested** and **re-used** in multiple places.

These components can be written in **Razor-Markup**, which is a combination of **HTML** and **C#-Code**.

```csharp
<div>
    <h1>@Title</h1>
    
    @ChildContent
    
    <button @onclick="OnYes">Yes!</button>
</div>

@code {
    
    [Parameter]
    public string Title { get; set; }

    [Parameter]
    public RenderFragment ChildContent { get; set; }

    private void OnYes()
    {
        Console.WriteLine("'Yes' button was clicked.");
    }
    
}
```

## Blazor WebAssembly
Blazor WebAssembly is a **Single-Page-App-Framework** to create client-side **interactive Web-UIs** with .NET.

- it uses **open web standards**
- allows the **execution of .NET code** in the **browser**
- the .NET code is executed in the **JavaScript-Sandbox** of the browser
- the sandbox protects against malicious actions on the client computer

### How it works
C# and Razor-Markup files are compiled into .NET assemblies. The assemblies and the .NET-Runtime are downloaded by the browser and the Blazor WebAssembly starts the .NET-Runtime and configures it to load the assemblies. After that DOM changes and API calls in the browser will be managed by the Blazor WebAssembly-Runtime from the JavaScript-Interop.

![Blazor WebAssembly](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6gimi4icwwba093mhspz.png)

> Image Source: Microsoft

## Blazor Server
Blazor decouples component rendering from UI updates, which brings support for hosting Razor components in an ASP.NET Core app on the server. UI updates are than triggered over a SignalR connection.

![Blazor Server](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4cgjtjgp878q94mh72kn.png)

> Image Source: Microsoft

## Progressive Web Apps
A **P**rogressive **W**eb **A**pp is a website that has the characteristics of a native app. It is a symbiosis of a responsive website and an actual app.

**Pros:**
- Findable as an application from search engines
- Installable without the hurdles of an app store
- Linkable. You can share its URL to install it
- Network independent
- Simultaneous use as a website (web app) and as a installed app is possible

### How it works
The web application runs in a headless browser, so to speak. This allows the PWA to use all features that available to a browser / web site.
Build this beautiful Custom Date Picker using Vanilla JavaScript
Tags: javascript, webdev, frontend, tutorial
Published: 2023-02-17 11:58:38

Here's an in depth tutorial on how to build a custom date picker, format dates, and add many different date picker functionalities using pure vanilla JavaScript.

link- https://www.youtube.com/watch?v=3CKk90bO9DY

If you are interested in react, JavaScript or frontend development in general, Do checkout and subscribe [xplodivity](https://www.youtube.com/@xplodivity/videos) on youtube
Coins bit Exchange Review
Published: 2023-02-17 11:36:35

Bitcoin Exchange: Bitcoinexchanges are online marketplaces where you can tradebitcoinfor traditional currencies,bitcoin exchanges may have received negative reviews
 Limited currency options :  Some exchanges may only offer a limited number of currencies for trading, which can be limiting for users who want to trade a wider range of assets.


Read more : [Coinsbit review](https://www.coinprudent.com/cryptocurrency-exchange/coinsbit-exchange-review/)
Build this INSANE Multi filter feature for your next project in React Js
Tags: react, webdev, javascript, reactnative
Published: 2023-02-17 11:33:00

Multi Filter is a popular feature used in Ecommerce, food ordering/delivery and many more websites. Learning how to build this feature can come useful in your future projects as well as during your interviews.

Here's an In-depth walkthrough of its implementation - 

{% embed https://www.youtube.com/watch?v=u1yr_HZivzk %}

If you are interested in react, JavaScript or frontend development in general, Do checkout and subscribe [xplodivity](https://www.youtube.com/@xplodivity/videos) on youtube
An Introduction on SQL for Data Analysis
Tags: sql, datascience, analyst, database
Published: 2023-02-17 11:14:15

SQL, or Structured Query Language, is an effective programming language that allows users to interact with and manipulate data contained in a database. It is a robust data analysis tool with a wide variety of features and flexibility. In this article, we will explain SQL, explain its fundamental concepts, discuss how it can be used to analyze data and conclude on how data analysts can be better in SQL language.

To begin, let us define a database; A database is an assortment of related data that is organized and stored in a structured manner. Tables, which are made up of rows and columns, are used to organize databases. The columns contain fields that hold data and the rows contain records that are individual data elements.
SQL statements are composed with the help of keyword phrases, also identified as commands. These commands enable users to do things like select data from a table, join tables, or generate fresh records into a table.

SQL can be used to analyze data by aggregating and summarizing it. Data aggregation generally requires the use of cSQL, a database-interaction language. It is used to create, update, delete, and query different value into a single value, such as calculating the average or sum of a group of values.

SQL is an excellent language for data analysis because it is designed to manipulate and query structured data. It is a compelling language that allows users to filter, sort, join, and aggregate data quickly and easily. SQL also allows a diverse range of data types to be analyzed, which include mathematical, written texts, and even timeline data. SQL is also extensively used and well-supported, making it simple to find help and resources if needed. Finally, SQL can be used to create detailed queries that can aid in the discovery of insights from huge datasets.

A data analyst can improve their SQL skills by practicing and developing their coding abilities. Better code requires paying attention to details like syntax, indentation, and the use of relevant variable names. It is also critical to understand the data structure and the various types of joins, operators, and functions that can be used. A software development environment, such as an Integrated Development Environment (IDE), can also assist a data analyst in becoming more efficient at writing SQL code. Finally, attending seminars, courses, or tutorials can help you learn more about SQL and improve our programming skills.
Angular Calendar | Mattlewise
Tags: angular, npm, vscode, webdev
Published: 2023-02-17 11:14:10

Need some assistance, I have been trying to integrate Angular Calendar into my project. I used https://mattlewis92.github.io/angular-calendar/docs/index.html , this documentation. 

After setting up everything I am unable to make it running and use this. 
My use case is that I have a json data file and I will be using that json file to fetch the data and use it accordingly in the month view of the calendar according to date. 

Need Help ! Thanks in advance.