teleren/devto huggingface dataset:
How to replace home directory with "~" on PowerShell
Published: 2021-12-13 08:12:50

PowerShell displays the current full path by default. It's long, so I'd like to replace it with `~` like Bash.

## Prepare a profile
You can customize your PowerShell with `$profile`. It doesn't exist by default, so you need to run `touch $profile`.

## Customize
To customize the prompt, use `function prompt`. Here is a built-in one.

```powershell
function prompt {
    $(if (Test-Path variable:/PSDebugContext) { '[DBG]: ' }
      else { '' }) + 'PS ' + $(Get-Location) +
        $(if ($NestedPromptLevel -ge 1) { '>>' }) + '> '
}
```
Source: [about Prompts - PowerShell | Microsoft Docs](https://docs.microsoft.com/en-us/powershell/module/microsoft.powershell.core/about/about_prompts?view=powershell-7.2#built-in-prompt)

It seems using `$(Get-Location)` to get the current path, but we can't use it as a `string` (even if we use `$pwd`). So let's use `Convert-Path` instead.

```powershell
function prompt {
    $currentDir = (Convert-Path .)
    $(if (Test-Path variable:/PSDebugContext) { '[DBG]: ' }
      else { '' }) + 'PS ' + $currentDir +
        $(if ($NestedPromptLevel -ge 1) { '>>' }) + '> '
}
```
Now we can use `$currentDir` as a `string`. All that is left is checking if it includes `$home` and replacing it.

```powershell
function prompt {
    $currentDir = (Convert-Path .)
    if ($currentDir.Contains($HOME)) {
        $currentDir = $currentDir.Replace($HOME, "~")
    }
    $(if (Test-Path variable:/PSDebugContext) { '[DBG]: ' }
      else { '' }) + 'PS ' + $currentDir +
        $(if ($NestedPromptLevel -ge 1) { '>>' }) + '> '
}
```

## Afterword
This time we made just a little customize for PowerShell, but we can do more things with a profile. I'm happy if this article will be helpful for you.

Here is my profile for your reference.

[github.com/akimon658/pwsh-profile](https://github.com/Akimon658/pwsh-profile)
Advent of PBT 2021 - Day 13
Tags: challenge, testing, webdev, javascript
Published: 2021-12-13 07:54:28

---
title: Advent of PBT 2021 - Day 13
published: true
description: Advent of Property Based Testing - Day 13
tags: challenge,testing,webdev,javascript
//cover_image: https://direct_url_to_image.jpg
---

> _Advent of PBT 2021 — Learn how to use property based testing and [fast-check](https://github.com/dubzzz/fast-check) through examples_

Our algorithm today is: **nonogramSolver**.
It comes with the following documentation and prototype:
```ts
/**
 * Solver of nonograms.
 *
 * Nonogram is a game in which the user is asked to colorize a grid
 * based on hints. A cell in the grid will be either filled or not.
 *
 * For instance, the grid below:
 *
 *        12
 *      3211
 *
 * 1 2  ????
 * 1 1  ????
 *   3  ????
 * 1 1  ????
 *
 * Will result in:
 *
 *        12
 *      3211
 *
 * 1 2  x.xx
 * 1 1  x..x
 *   3  xxx.
 * 1 1  .x.x
 *
 * To define this grid you'll have to pass:
 * - rows:    [[1,2],[1,1],[3],[1,1]]
 * - columns: [[3],[2],[1,1],[2,1]]
 *
 * @param rows - For each row, the set of hints concerning the
 *               number of filled cells
 * @param columns - For each column, the set of hints concerning
 *                  the number of filled cells
 */
declare function nonogramSolver(
  rows: number[][],
  columns: number[][]
): string;
```

We already wrote some examples based tests for it:
```ts
it("should be able to solve our nonogram", () => {
  // Arrange
  const rows = [[1, 2], [1, 1], [3], [1, 1]];
  const columns = [[3], [2], [1, 1], [2, 1]];
  let expectedSolution = "";
  expectedSolution += "x.xx\n";
  expectedSolution += "x..x\n";
  expectedSolution += "xxx.\n";
  expectedSolution += ".x.x";

  // Act
  const solution = nonogramSolver(rows, columns);

  // Assert
  expect(solution).toEqual(expectedSolution);
});

it("should be able to solve nonogram with non unique solution", () => {
  // Arrange
  const rows = [[1], [1]];
  const columns = [[1], [1]];
  let expectedSolutionA = "";
  expectedSolutionA += ".x\n";
  expectedSolutionA += "x.";
  let expectedSolutionB = "";
  expectedSolutionB += "x.\n";
  expectedSolutionB += ".x";

  // Act
  const solution = nonogramSolver(rows, columns);

  // Assert
  const isA = solution === expectedSolutionA;
  const isB = solution === expectedSolutionB;
  expect(isA || isB).toBe(true);
});
```

How would you cover it with Property Based Tests?

In order to ease your task we provide you with an already setup CodeSandbox, with examples based tests already written and a possible implementation of the algorithm: https://codesandbox.io/s/advent-of-pbt-day-13-r03cn?file=/src/index.spec.ts&previewwindow=tests

You wanna see the solution? Here is the set of properties I came with to cover today's algorithm: https://dev.to/dubzzz/advent-of-pbt-2021-day-13-solution-3bhn

---

[Back to "Advent of PBT 2021"](https://dev.to/dubzzz/advent-of-pbt-2021-13ee) to see topics covered during the other days and their solutions.

More about this serie on [@ndubien](https://twitter.com/ndubien) or with the hashtag [#AdventOfPBT](https://twitter.com/search?q=%23AdventOfPBT).
My first blog
Tags: blogging
Published: 2021-12-13 07:49:39

개발을 진행하면서 거의 매일 troubleshooting을 하게 된다. 하지만 글로 남기지 않으면 동일한 일이 발생했을때 다시 시간을 들여서 문제 해결을 해야한다. 블로깅을 통해 지식을 축적해 보려고 한다.
Premium multi layout Jekyll theme
Tags: jekyll, html, bootstrap, seo
Published: 2021-12-13 07:44:11

- Premium theme using Jekyll version 4.1.2 & Bootstrap 5
- Multipurpose (multiple homepage layouts)
- Fully ready for production within minutes
- Responsive, SEO Friendly, and Mobile optimized
- Step by step documentation

USE: ZEESPIREHOLIDAYS code to get 35$ discount

[Checkout our demos](https://shop.zeespire.com/)

Support: office@zeespire.com

Details:

- Three homepage designs which you can choose from
- Easily create and use your own Bootstrap designs
- Includes multiple blog posts and frontpage as sample content
- Customizable through config files and properties:
- show/hide authors
- show/hide dates
- show/hide social integrations
- show/hide watermark
- show/hide selected posts on the front page
- change footer color
- Has Authors, Posts, Categories features
- Supports multiple image sizes for fast loading
- Lightbox and Image galleries support
- Code snippets highlight
- Git helper scripts (.bat) for easy GIT interaction
- Jekyll helper scripts (.bat) to easily build or start HTTP server locally
- 100% Responsive
- Many SEO features; Open Graph protocol; schema.org using Microdata; meta tags
- No dependency on external resources
- Track your visitors with Google Tag Manager or Google Analytics integration
- YouTube and other video website support for embedded videos
- Pinterest integration
- Links and icons to other social platforms like YouTube, Facebook, Instagram, Medium, TikTok, Pinterest (hidden if not needed)
- Search feature
- Clean code
- Favicons for all types of devices
- .htaccess redirects with HTTPS support
- Minimized HTML CSS and JS code on build for super speed
- Sitemap with latest modification date
- RSS feed
- Great documentation and support in max. 48 hours
- Easy to upgrade Jekyll and Bootstrap version
- Easy to deploy, customize and extend
HTML tags | embed
Tags: html, tags, embed
Published: 2021-12-13 07:33:28

It is used to **embed external content** at the specified point in the document. This content is provided by an external application or other source of interactive content such as a browser plug-in.

Keep in mind that most modern browsers have deprecated and removed support for browser plug-ins, so relying upon `<embed>` **is generally not wise** if you want your site to be operable on the average user's browser.

* To **embed a picture**, it is better to use the `<img>` tag.
* To **embed HTML**, it is better to use the `<iframe>` tag.
* To **embed video or audio**, it is better to use the `<video>` and `<audio>` tags.

It can have some **implicit ARIA roles**: `application`, `document`, `img`, `none` or `presentation`.

## Attributes

### height
The displayed height of the resource, in CSS pixels (absolute values only. NO percentages).

### src
The URL of the resource being embedded.

### type
The [MIME type](https://developer.mozilla.org/en-US/docs/Glossary/MIME_type) to use to select the plug-in to instantiate.

### width
The displayed width of the resource, in CSS pixels (absolute values only. NO percentages).

## Styling
You can use the `object-position` property to adjust the positioning of the embedded object within the element's frame, and the `object-fit` property to control how the object's size is adjusted to fit within the frame.

## Accessibility
Use the `title` attribute on an embed element to **label its content** so that people navigating with assistive technology such as a screen reader **can understand what it contains**. The title's value should concisely describe the embedded content. **Without a title, they may not be able to determine what its embedded content is**. This context shift can be confusing and time-consuming, especially if the embed element contains interactive content like video or audio.

- Type: *-*
- Self-closing: *Yes*
- Semantic value: *No*

[Definition and example](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/embed) | [Support](https://caniuse.com/mdn-html_elements_embed)
Strategy Pattern | Design Patterns in Java
Tags: java, programming, beginners, codenewbie
Published: 2021-12-13 07:33:17

Behavioral design pattern: Watch a Java implementation of the Strategy Pattern which allows us to change the behavior of an algorithm at runtime. In this example there are different payment methods - strategies - for a certain amount. The context processes the payment differently depending on the payment method. A client would at runtime be able to select between the payment methods. The implementation in Main would thereby be more dynamic in a real usecase.

{% youtube GJs2Dxzvugs %}
TO DO LIST WITH ANGULAR
Published: 2021-12-13 07:31:10

At this point, we are ready to start creating our to-do list application using Angular. The finished application will display a list of to-do items and includes editing, deleting, and adding features. In this article you will get to know your application structure, and work up to displaying a basic list of to-do items.
check this link
[to do list](https://github.com/mohasaket/TodoList/tree/master/src/app)
Advanced TypeScript With Code Challenges: Type Guards
Tags: typescript, javascript, programming
Published: 2021-12-13 07:29:27

![Big elephant stating Typescript, small elephant stating Javascript](https://miro.medium.com/max/2000/1*jUBpz0DE_5DSUvDOk_3ZJg.png)

Type guards allow us to guarantee types during runtime. Learn the concept of Type Guards and apply them to practical code exercises in this article.


{% medium https://medium.com/@mariusbongarts11/advanced-typescript-with-code-challenges-type-guards-a5b24bb6d46b %}
How to create a Dice Rolling App using ReactJS
Published: 2021-12-13 07:12:05

There are two components Die and RollDice. The Die component is responsible to show one individual Dice. It is a stateless component. It uses the font-awesome library to show the standard dots on the upper face of the dice. RollDice component contains all the logic to generates random numbers to show on the upper face of the dice, roll each dice upon click on the roll button. There are two states involve in the RollDice component named ‘die1’ and ‘die2’. Each one has initialized with the value one i.e. each die shows one(one dot) when the application first starts. 

Now, we set the click event handler to the roll dice button and when anyone clicks on the button we change the state of both die1 and die2 to some random number using setState from one to six (we use a number as a word since font-awesome library deals with word number to show the exact number of dots). We also make sure when the dice is rolling user can’t click on the button again. For this purpose we use a state ‘rolling’ initially set to false and when the dice are rolling set rolling to true and start a timer of one second. After one second again set rolling state to false’. Disable the button when a rolling state is set to true.
This is a rough overview of the application. go to this [link](https://github.com/mohasaket/DICE-ROLLER)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9dekxvitrwo6zab2yete.jpg)
Introspection (and Mirrors?)
Published: 2021-12-13 06:52:50

##Smart Mirror
A project I've been thinking about making for a little while now is a smart mirror. Most people have mirrors in their bedroom and bathrooms and most people start and end their day going into the bathroom and the bedroom. I would like to build and code a smart mirror that could be utilized as a day planner, alarm clock, speaker system, and capable of all sorts of everyday tasks. 

The most important thing I like about the smart mirror idea is that it would be used as a tool rather than an entertainment device. People look at enough screens throughout the day, if this mirror could be used as a routine tool rather than a time waster, I'd feel like I did my job.

It's definitely not a device everybody needs but it could be a device that could improve the productivity of someone's day.

I originally thought of this idea as a gift for my sister and I still plan for it to be, but I do think if I'd actually build it and write the code behind it, others would want one too.

##Money? Who needs it... Time? It's just a construct
If I were to live life without money or time being a concern I'd like to live it seeing and experiencing everything amazing this world has to offer while helping as many people I can along the way. We live in such a remarkable time where it really feels like anything is possible. 

It only takes one great idea and a whole lot of drive to create something amazing. Both are tough to come by but I believe my drive stems from the wanting of making myself the best possible version I can. I then  hope to use my skills and passion to motivate and ultimately better the lives of those around me.

I don't know how yet, but I'd hope one day I can either build something or have the next idea to change people's lives for the better. Looking around it seems there's so many superficial things in our lives that we put importance over the real things that make us amazing humans. When it comes down to the question, "If money was no concern, time no concern; what would you do with your life and the skills you've assembled if you could dedicate it to one thing?", I'd answer with, utilizing everything I've learned from others and through myself to dedicate myself towards the well-being of others. Whether that will be on a tech project, social service, or anything else, I want my life to make an impact on this world.
Why should a Django developer use Django CMS?
Published: 2021-12-13 06:01:49

A [Django developer](https://eiliana.com/blogitemdetails/django-for-quick-web-application-development) can give more fire to their Django-Admin Interface for their client’s website by certainly adding the Django CMS package in their Django Web Development project . Django CMS have decent UI and features for admins and Django developers to publish the data on their site developed by the Django Web Development  process . 

In addition to that, Wagtail is highly recommended for a Django developer as it is easy to install and start. Also it has a great design, and it focuses on user experience, both the frontend and admin side.  If you are an experienced Django developer with the capacity to deliver high quality deliverables within deadline, then you can get more Django Web Development projects from quality clients on Eiliana. Eiliana also provides freelancers the option to stay anonymous on the platform.
Getting Started with the Blazor Breadcrumb Component
Tags: blazor, dotnet, csharp, webdev
Published: 2021-12-13 05:53:05

Learn how to get started with the Syncfusion [Breadcrumb component ](https://www.syncfusion.com/blazor-components/blazor-breadcrumb)in a Blazor WebAssembly application. You will also learn how to configure a few of its basic features, like adding items, icons, and custom templates, and about Breadcrumb navigation. 

Download an example from GitHub: https://github.com/SyncfusionExamples... 

Refer to the following documentation to learn about the Blazor Breadcrumb component: https://blazor.syncfusion.com/documen... 

Check out this online example of the Blazor Breadcrumb component: https://blazor.syncfusion.com/demos/b... 
 

{% youtube yWqATPayFS0 %}
Bottom Icon-Based Navigation Menu
Tags: codepen
Published: 2021-12-13 05:03:17

<p>Take from my YouTube video:
<a href="https://youtu.be/uHL6aeWUEQQ" target="_blank">https://youtu.be/uHL6aeWUEQQ</a></p>

<p>In this video tutorial I'll be showing you how to create a bottom, icon-based navigation bar using HTML and CSS. This style of navigation is very popular on mobile apps or websites.</p>

{% codepen https://codepen.io/dcode-software/pen/wvagWEP %}
SPO600 Project Stage 2
Published: 2021-12-13 04:58:34

## Introduction

The open source package that I will be discuss in this blog is VLC. According to the [official GitHub](https://github.com/videolan/vlc), VLC is a media player and multimedia engine that has been ported to different computing platforms. VLC can play various multimedia files, discs streams, allows playback from devices, and ids able to convert to or stream in various formats. 

There are 557 contributors in this project and the last commit to the project is on April 14, 2021. According to the [official website](https://www.videolan.org/vlc/stats/downloads.html), the total download number is 6,566,829 across all versions and OS.


## SIMD

In the file [vlc_cpu.h](https://github.com/videolan/vlc/blob/75bca603749d8bfb7048a84ea811cbdb19447596/include/vlc_cpu.h) under the `include` folder, we can see the CPU compatibilities of Neon and SVE for aarch64 system are specified in this file where Neon and SVE are different naming of SIMD.

There is a file named [merge_arm64.S](https://github.com/videolan/vlc/blob/e3f38be0ccab13d46041de208bcceb917278f289/modules/video_filter/deinterlace/merge_arm64.S), we know that `arm64` is other name for `aarch64` and this file is there to add build system support / CPU detection for aarch64 SIMD system.
Conditional Debugging - Faster debugging for complicated cases
Tags: javascript, devtools, debugging
Published: 2021-12-13 04:50:24

## Introduction  
My main goal with this small post is to just point out that if you're someone who doesn't use conditional breakpoints, when:  
* you're investigating a bug
* know a case (some id or some value) you want to verify  
* are continually hitting the continue or step next button 

**NOTE** For the TLDR of this post in a short gif, [skip to conditional debugging](#conditional-debugging)

Well, you should (be using conditional breakpoints). Its a pretty simple feature which most (if not all) debug tools support. I have no idea how I skipped past this, probably because I never realized I could do this in the first place.
## Caveat
At the time of writing, I have been using this for python debugging using pycharm, c++ debugging using visual studio and javascript debugging in chrome devtools, and it seems to be atrociously slow in devtools at my work atleast, even for an array with a few 100 entries, not a complicated process at all, but a bug I imagine. Either way, it's worth testing out yourself

## Process
### Setup  
I'll take chrome dev tools as an example here, I have created a very simple project, with an html file that has a `button` with a function `printEvenTillN`. This as you might image *prints all even numbers till N*.
I have another js file, what this has is the function itself.
I have used the Live Server extension to launch a server so I can debug this in chrome devtools.
### Conditional Debugging
The Case I am presenting is that for our simple function `printEvenTillN` I want to see if **32** is amongst the numbers it prints. I am choosing a specific number because it translates well to complicated debugging cases where we want to see if say a particular element with some known unique id exists.

![Conditional Debugging Demo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6nxwgz65eqe64pacfeyq.gif)

## Conclusion
I hope you get some value out of it. If you did not know about this already I encourage you to try it. Whilst console logs and looping through each debug instance is well, easy, and we are sometimes lazy, this makes the process so much easier.
Como eliminar una rama local y remota con git.
Tags: git, github, tutorial, programming
Published: 2021-12-13 04:46:41


En este artículo veremos cómo eliminar eficazmente una rama local y remota con #git.

## - Eliminar rama local:

Para eliminar una rama local ejecuta el siguiente comando,
`git branch -D <branch-name>`, remplaza la `<branch-name>` por el nombre de la rama que desees eliminar.

> _**Nota:** Si intenta eliminar una rama que contengan cambios sin mergear le saltara el siguiente error: `error: The branch 'branch_name' is not fully merged. If you are sure you want to delete it, run 'git branch -D nombre_de_la_rama'.`_ Tenga en cuenta este error, para saber que cambios realizados tiene en su(s) rama(s) que aun no están mergeados, ejecute el siguiente comando `git branch --no-merged`, esto le mostrara todos los cambios no mergeados en su propia rama. Si esta seguro de eliminar la rama, entonces necesitara forzar la eliminación de la rama con el comando `-D`.

Recuerde que si fuerza la eliminación, todos los cambios no mergeados se eliminaran por completo.

## - Eliminar rama remota:

Si ya elimino su rama local eso no quiere decir que esto haya afectado a su rama remota, si desea reflejar estos cambios en remoto, ejecute el siguiente comando, `git push origin --delete <branch-name>`, recuerde modificar el nombre de su rama que desea eliminar.

Y listo, su rama ya fue eliminado, para estar seguro de esto, ejecute el siguiente comando `git branch`, esto le mostrara una lista completa de sus ramas "locales". Si no encuentra la rama que eliminó, entonces todo salió bien, continúe codificando sin más preocupación. 🎉