teleren/devto huggingface dataset:
Why is it so hard to build or use a rich text editor yet amazing editors like vscode or atom are built with web technologies?
Tags: help
Published: 2019-04-13 07:55:44

---
title: Why is it so hard to build or use a rich text editor yet amazing editors like vscode or atom are built with web technologies?
published: true
tags: help
---

![Rich Text Editor](https://thepracticaldev.s3.amazonaws.com/i/v33wgubhrbn6gbx3wul6.gif)


Hi, 

I have tried to build a rich text editor in a React web app, and the common libraries used like slate.js or draft.js make it seem like it's actually very tricky to build or even use a rich text editor that ticks all the boxes.

Yet code editors like vscode and atom give users amazing text editing possibilities such as multi-cursors and other countless refinements, and they are built on top of web technologies. 

Can anyone explain how that can be? I'm probably missing a few steps in my understanding. 

Thanks!
Why I choose to devalue StackOverFlow Surveys
Tags: discuss, advice, rant, beginners
Published: 2019-04-13 05:50:06

---
title: Why I choose to devalue StackOverFlow Surveys
published: true
description: Why I ignore StackOverFlow Surveys and Preaching on Developer forums
tags: #discuss #advice #rant #beginners
---

Almost every developer forum that I visit these days is talking about the stackoverflow developer surveys. But I choose to ignore it. Why? There are many reasons for that. 

So let's address few of them. 


**Reality is different than Wishful Thinking**

You can take a look at the bad advice given on sites like stackoverflow, quora, hashnode and even on dev.to. You will find preaching such as shown in image below. 

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


Noticed how this person who answered didn't mentioned a single framework of golang which is like React, Angular etc to save customers time and money. Yet this person thinks in 6 months Node will be dead and Go lang is the future. 

Replace this Node hate with Anti C++ commentary in order to praise Rust. 

Lot of developers spite hate against PHP. Call Python dead over Ruby (because they learned it instead of python). Call Node dead over Go lang. 

Why give such bad advice to newbies in programming field? 

Do try to understand the fact that clients and the big companies don't want to pay for wishful thinking. They look at the frameworks and the right tools to get job done and they use it. That's why your favorite Ruby, Rust, Golang is yet to be so common in industry, and spitting hate against PHP, Python and Node is not going to make them love Rust, Ruby and Golang. 

If you happen to spend time in some developer forums and chat these days, it's usually a session of brainwashing of some sort. Especially when the people at top like John skeet, Jeff etc on Stackoverflow have some brainwashing to do on you. Look I come to your site for getting answers to my questions, not learn about socialism revolution of new age. 

Lot of wrong things are being portrayed through such surveys and taken as potential industry standard. So here's the everything in short. 

1. SO surveys don't define industry. 
2. SO surveys does not mean X language should be dead. 
3. SO surveys shows opinion of people who stay there ruminating the same old opinion echo chamber. 
4. Opinion of popular SO member does not mean I have to accept it as industry standard. 

Feel free to disagree with me. I just wanted to vent out. Lot of wrong career advice is being given by fanboys of the language while keeping the reality out. I hope this changes in future.
Part 1: Installing ROSS Can Be Hard, Let's Make it Easy
Tags: ross, robotics
Published: 2019-04-13 03:28:32

This is a post to keep track of setting up ROS on Ubuntu 18.04LTS because the first tries made me sigh more than I wanted to.

<h1>ROS Melodic Morenia (EOL May, 2023)</h1>
[ROS' Installation Guide for Ubuntu](https://wiki.ros.org/melodic/Installation/Ubuntu)

<strong>***I'm assuming you have a fresh, unmodified Ubuntu 18.04LTS install!***</strong>


<h1>Repository Initializations</h1>

1. <code>sudo apt update && sudo apt upgrade</code>
2. Allow Ubuntu repositories "restricted," "universe," and "multiverse."
 ![Software & Updates Settings] (https://thepracticaldev.s3.amazonaws.com/i/9nd9tjyhv2iq0s6j6xj2.png)
3. In the same window select "Other software" tab. Select Add, paste from below: <code>deb http://mirror.umd.edu/packages.ros.org/ros/ubuntu bionic main</code>
<em>This repo is hosted at the University of Maryland. The link given in ROS's guide is broken. If you want to use a different one, click below.</em>
[ROS Mirrors](https://wiki.ros.org/ROS/Installation/UbuntuMirrors)
4. Apply/Close window. There's a good chance an error is thrown saying there's no public-key available.
5. There's a good chance a missing public key error is thrown. Open Terminal and run the command below:<p> 
<code>sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 5523BAEEB01FA116</code>

It's 12:37 AM, I’m going to 🛌 😴 💤 
Let the 🤖 🌚 💀 😂
[C++ CODE] Make Array Consecutive 2
Tags: thetealpickle, beginners, coding, algorithms
Published: 2019-04-13 01:05:57

---
title: [C++ CODE] Make Array Consecutive 2
published: true
description: coding challenge
tags: #thetealpickle #beginners #coding #algorithms
cover_image: https://thepracticaldev.s3.amazonaws.com/i/apjspxf02f69k90ntcbf.png
---

THE TEAL PICKLE CODING CHALLENGE!! Different sized statues which need some ordering (C++). 


<img src="https://thepracticaldev.s3.amazonaws.com/i/011rwpds1oz35hvj4tfl.png" />

TRY IT 👀 , check out my solution, share!!  
<img src="https://thepracticaldev.s3.amazonaws.com/i/vedrwjp7d9yded1of92u.png" />
Simple WordPress Widget for your Dev.to Posts
Tags: wordpress, showdev
Published: 2019-04-13 00:51:10

---
title: Simple WordPress Widget for your Dev.to Posts
published: true
description: showcase your dev.to posts on your WordPress website with a widget
tags: wordpress, showdev
---

I was bored and saw some posts of the users making use of the dev.to api so I threw together my own little project, a widget for your posts.

It shows the latest 30 posts by using the following API call: https://dev.to/api/articles?username=ben

A view of the widget admin, super simple: https://imgur.com/a/r3bg67G

Live view (showing Ben Halpen's posts) - The widget comes with no styling so uses the default styling from your theme.

http:// wpthemes4u. co. uk/plugins/ (remove spaces)

You can download the widget from https://www.dropbox.com/s/ohkdmbk9arrzxoe/devto-widget.zip?dl=0, I will get it on Github when I get chance.

The API has a lot of data I can use to make the widget more interesting, what would you like to see? things I have considered are:

 - user card (with profile image, name, description & twitter url)
 - limit posts to a user defined number in the widget settings

Let me know any ideas to improve the widget or other ideas for WordPress integrations for Dev.to
Getting Started with Django
Tags: python, django, tutorial, beginners
Published: 2019-04-13 00:41:33

---
title: Getting Started with Django
published: true
description: Django is an immensely popular and powerful web framework for Python. Use Django to build a fully featured site using existing libraries and tools.
tags: python, django, tutorial, beginners
canonical_url: https://kite.com/blog/python/django/
---

![getting started with Django] (https://thepracticaldev.s3.amazonaws.com/i/g4vkz1bdgzh00iibk2t0.jpg)

## What is Django?
Written in Python, Django is the self-proclaimed web framework for perfectionists with deadlines – and I have to agree. Django provides so much power out of the box and is built on Python – which has its own repository of libraries, PyPI – that you can lean on. It’s easy to understand why Django is the top Python web framework today and is among the top six of all programming frameworks.

## The Django Framework
Django is a "batteries included" framework. There's a built-in tool to help you with anything you might want to accomplish. Need user authentication? Django has you covered. Need to validate data from user input? You got it. Need to store data in the database after cleaning it? Yep, can do. It even has built-in features that keep you from unintentionally leaving your project open to security holes – like cross-site forgery protection built into every request. Everything is there and ready for you to work with.

Despite all that power and popularity – or possibly because of it – Django has a high learning curve. Thankfully, the documentation about Django’s capabilities is excellent, and this tutorial tutorial will get you over that curve and into Django.


Read more [here] (https://kite.com/blog/python/django)!
Django Environment Variables
Tags: django, python, environment
Published: 2019-09-26 16:56:33

---
title: Django Environment Variables
published: true
tags: django, python, environment
canonical_url: https://tech.serhatteker.com/post/2019-04/django-environment-variables/
---

If you look at modern code deployment practices, like in [the 12 factor
app][twelve-factor], environment variables are very important for keeping secret information, or specific information set for a server. All while not having long settings in a settings file —files, or every single server and host. It helps keep things simple and clean in your code along with the following quoted from the 12factorapp site:

>* Resource handles to the database, Memcached, and other backing services
>* Credentials to external services such as Amazon S3 or Twitter
>* Per-deploy values such as the canonical hostname for the deploy

## What Are Environment Variables?

Environment variables are a key:value pairs that can affect how a program runs.
They need to be set at some point before a process is run so the process can read them in and act accordingly. A lot of times in production environments your database name and passwords are set as environment variables so that information does not end up in a code repository somewhere. Unfortunately it do es even publicly sometimes.

By relying on an environment variable your code doesn't care what your settings are because you can set them some other point. Actually working with environment variables is really simple. All you need to start is importing native os module:
`import os`.

```python
import os

name = os.environ.get('USER')

```

OK but where to put and find these variables in your os? There are a
lot of ways but below 2 I think have best implementations:

### 1 - Virtual Environment
One of the best ways is to get them from virtual environment. When you activate your virtual env `source .venv/bin/activate`, "activate" script runs. You can add below script to the end of this activate file:

```sh
export $(grep -v '^#' ./.env | xargs)
```

Where `./` is your project "root directory". So if you have more than one `env` files you can add them too as below:


```sh
export $(grep -v '^#' ./.env | xargs)
export $(grep -v '^#' ./.envs/.env.dev | xargs)
```

I usually use this method but this requires an `Unix-like OS` (MacOS & Linux etc).

### 2 - Django-Environ Module Library
[django-environ module][django-env] allows you to use [Twelve-factor
methodology][twelve-factor] to configure your Django application with
environment variables.

In your project `settings.py`

```python
import environ

env = environ.Env()

# reading .env file
env.read_env(env.str('./', '.env'))

# https://docs.djangoproject.com/en/dev/ref/settings/#secret-key
SECRET_KEY = env('DJANGO_SECRET_KEY')
```

In addtion to all of these above you can export your `env vars` via `.bashrc` or `.bash_profile` or even `.profile` but this would be a bad practice: using project wide restrictions over system wide. 



[twelve-factor]: https://12factor.net/
[django-env]: https://github.com/joke2k/django-environ
How To Test Your API Using cURL & Postman
Tags: postman, curl, testing
Published: 2019-04-24 00:04:21

---
title: How To Test Your API Using cURL & Postman
published: true
tags: ['postman', 'curl', 'testing']
canonical_url: https://stephencharlesweiss.com/blog/2019-04-13/testing-api-with-curl-and-postman/
---

The other day, I found myself making some changes to a network request for our application.

By navigating to a specific page, I knew I’d trigger the call, so that’s what I was doing. At some point, I needed some help and one of the more senior engineers made a comment that I could just copy the `cURL` into Postman.

I didn’t know what that meant, so I did some digging. Here are the why and how to use Postman for your API testing.

# Why Use Postman

Moving the process to Postman, I get several benefits. The two biggest for me are:

1. I speed up my testing cycle - since I don’t have to load the entire page, but can focus on _just_ my one call, each test can be done much more quickly
2. Inspecting the response is easier - I don’t have to navigate through the network tab in Dev Tools each time to find the call I’m interested in, but can use Postman’s UI which is much more suited to the process

# How To Use Postman

1. Navigate to the web page that you know will trigger the network call
2. Open the Dev Tools (The Mac keyboard shortcut for Chrome is `⌘` + `⌥` + `i`)
3. Go to the Network tab
4. Find the request that you’re interested in replicating, and right click on it. The `cURL` can be found in Copy> Copy as cURL [![network tab](https://stephencharlesweiss.com/static/4637479418d69b7048a9e51840d7a7c0/fb8a0/network-tab.png)](/static/4637479418d69b7048a9e51840d7a7c0/66e9d/network-tab.png)
5. Open up Postman
6. Use Postman’s Import functionality and paste the copied request into the Raw text section, File > Import > Raw Text. (The keyboard shortcut is `⌘` + `o`) [![raw text](https://stephencharlesweiss.com/static/42556503aeaf6ff35fa292a4a6b4c93b/fb8a0/raw-text.png)](/static/42556503aeaf6ff35fa292a4a6b4c93b/207cb/raw-text.png) Note, by copying the `cURL`, you will also bring in all of your headers - including any authorization that may be necessary. [![headers](https://stephencharlesweiss.com/static/4fc68ebf9168fc13a48bd6027398bab9/fb8a0/headers.png)](/static/4fc68ebf9168fc13a48bd6027398bab9/5693b/headers.png)
MinitestLog Project Now Public
Tags: testing, ruby
Published: 2019-04-12 23:44:29

---
title: MinitestLog Project Now Public
published: true
description: 
tags: testing, ruby
---
I have made public my GitHub project [minitest_log](https://github.com/BurdetteLamar/minitest_log#minitestlog).

It provides structured logging for Ruby testers who are using <code>Minitest</code>.

Coming soon:  The gem.
Information Retrieval Search Engine
Tags: csharp, ir, searchengine
Published: 2019-04-09 19:06:36

---
title: Information Retrieval Search Engine
published: true
description: Pilot Information Retrieval Search Engine using the MED test collection
tags: #csharp #ir #searchEngine
---
Hello, I would like to share with you a project I made earlier using C#, it is a information retrieval search engine that uses the MED test collection as a test documents / terms.

This is a link to the [github repository](https://github.com/mhdbouk/ir)

### Phase 1: Stoplist
Adjectives, adverbs, and connectives are less
useful because they work mainly as complements. These irrelevant terms (stopwords) are placed under a file called Stoplist (`"assets/StopList.txt"`).

- Removal of the words found in a stoplist
- Removal of punctuations and symbols
- Generate text documents without stopwords `.stp`

### Phase 2: Stemming
The remaining terms are stemmed using Porter's algorithm, it brings down distinct words to their common grammatical root - Remove suffix. Stemming will reduces further the number of unique terms.
- Removal of suffixes
- Generate text documents without suffixes `.sfx`
- Using porter algorithm (https://github.com/nemec/porter2-stemmer)

### Phase 3: Weighting, Generating of Inverted File
Generate 2 CSV files that display all terms found in all documents (after phase 1 & 2) using boolean inverted file and TFIDF inverted file.

### Phase 4: Query processing and Reporting
User has the option to add a query or to run the MED queries collection into the system. System then will generate new document for the result with the COS values for each term in document, the recall and precesion for each document + new csv file will be generated contains the average precision per unique recall values.


Thank you all, and please do provide feedback 👀 🐱‍👤
Azure Secure DevOps Kit
Tags: azure, security
Published: 2019-04-12 23:37:07

---
title: Azure Secure DevOps Kit
published: True
description: Azure Secure DevOps KIt
tags: #Azure, #Security
---
 ![Azure Secure DevOps Kit](https://dw71fyauz7yz9.cloudfront.net/video-upload__cf560ac5a1c625f7dd96efce21c072d1/thumbs-video-upload__cf560ac5a1c625f7dd96efce21c072d1-00001.png)
Let’s Build: With Tailwind CSS – Tweet
Tags: css, javascript, tutorial, webdesign
Published: 2019-04-27 16:31:07

---
title: Let’s Build: With Tailwind CSS – Tweet
published: true
tags: css, javascript, tutorial, web design
canonical_url: https://web-crunch.com/lets-build-tailwind-css-tweet/
cover_image: https://thepracticaldev.s3.amazonaws.com/i/vt7favk0dtktirx8an9p.jpg
---

Kicking off my new Tailwind CSS Let’s Build series I decided to start with a component and what better component than a Tweet on Twitter.

Follow along in the build to see how I’ll use a combination of Tailwind CSS, Twitters UI icons, and some trial and error to create a very similar experience that you see on [twitter.com](https://twitter.com).

I’ll leverage [CodePen](https://codepen.io) and the [next.tailwindcss.com](https://next.tailwindcss.com) version of Tailwind CSS. I’ll eventually install and configure Tailwind CSS locally instead of always leveraging a CDN but for quick prototypes and builds such as this one it makes a lot of sense to use.


{% youtube VINHQLZN6YQ %}

<p class="codepen" data-height="265" data-theme-id="0" data-default-tab="html,result" data-user="webcrunchblog" data-slug-hash="xedQVv" style="height: 265px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid black; margin: 1em 0; padding: 1em;" data-pen-title="Let's Build: With Tailwind CSS - Tweet">
  <span>See the Pen <a href="https://codepen.io/webcrunchblog/pen/xedQVv/">
  Let's Build: With Tailwind CSS - Tweet</a> by Andy Leverenz (<a href="https://codepen.io/webcrunchblog">@webcrunchblog</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>

### New to Tailwind?

Check out [my first video](https://dev.to/justalever/how-to-install-tailwind-css-v10-3g-temp-slug-9471708) on how to install the utility-first framework locally using Webpack

The post [Let’s Build: With Tailwind CSS – Tweet](https://web-crunch.com/lets-build-tailwind-css-tweet/) appeared first on [Web-Crunch](https://web-crunch.com).
How is VUE Cli UI made?
Tags: help
Published: 2019-04-12 22:13:33

---
title: How is VUE Cli UI made?
published: true
tags: help
---
I've came across the Vue Cli GUI and it's amazing!
But I'm wondering how something like that is made?
What language is used? How are they able to add files and folders to my computer through web app thats running on a local server?
Google Code Jam 2019 Qualification
Tags: challenge, competition, perl, codejam
Published: 2019-04-12 22:04:28

---
title: Google Code Jam 2019 Qualification
published: true
description: Getting the needed 30 points
tags: challenge, competition, perl, codejam
---

![jam](https://thepracticaldev.s3.amazonaws.com/i/y027sv6qdmuyichpvl4f.jpg)

This year's Google Code Jam Qualification round limit was 30 points. Solving just the two simpler tasks yielded enough to get you through.

I used Perl to solve the problems, as it's the language I can write the fastest.

You can find the problems in the [Archive](https://codingcompetitions.withgoogle.com/codejam/archive/2019).

First task
--


The first task sounded easy: the input is a sequence of numbers each containing the digit 4. For each number N, output two numbers A and B such that N = A + B and neither A nor B contains the digit 4.

I used the [tr](http://p3rl.org/tr) operator (similar to the `tr` utility you might know from *nix) to replace all 4's by 3's. That was my A. To get the B, I just subtracted A from the original N.

```perl
#! /usr/bin/perl
use warnings;
use strict;
use feature qw{ say };

chomp( my $cases = <> );
for my $case (1 .. $cases) {
    chomp( my $n = <> );
    (my $i = $n) =~ tr/4/3/;
    my $j = $n - $i;
    say "Case #$case: $i $j";
}
```

This gave me the first 16 points. To get one more, it was needed to handle much larger numbers. It's possible by using the [Math::BigInt](http://p3rl.org/Math::BigInt) core module, but I rather rushed to the next task.

```perl
use Math::BigInt;

...
my $j = 'Math::BigInt'->new($n) - 'Math::BigInt'->new($i);
```

Second task
--

You were given a path in a square where each step goes either to the south or to the east. You need to find a different path that starts and ends in the same places (which are the nortwest and southeast corners), but never reuses the given path.

The input path is encoded as a string like `SSEEESSE`. Surprisingly, the transliteration operator can again provide a short and straightforward solution. It corresponds to the path that's line symmetric with the input where the axis connects the start and end points.

```perl
#! /usr/bin/perl
use warnings;
use strict;
use feature qw{ say };

chomp( my $cases = <> );
for my $case (1 .. $cases) {
    <>;
    chomp( my $lydia_path = <> );
    (my $path = $lydia_path) =~ tr/SE/ES/;
    say "Case #$case: $path";
}
```

This gave me 14 points, so my advancement was secured.

I also solved the third task, but the solution was ugly and didn't work for the larger inputs and extra points. It gave me 10 more points.

See you in the Round 1!