teleren/devto huggingface dataset:
Reddit Marketing: Scale Your Business Using Reddit - eGoodMedia
Published: 2021-05-11 10:08:08

Some of the users on Reddit stick to one subreddit and focus on building their reputation by offering them useful and quality content. But when you are using Reddit then you get access to a huge community and you can take advantage of it through cross-posting. 
 
Every market has different subs on Reddit so if your market has four or five different subs then you can apply your post to all. This way your post will be reaching the maximum audience and more people will be seeing it across different subs. Reddit asks you not to perform any spam related activities but allows you to share the post on different subs. Instead of sharing it on all sub pick 4 to 5 popular subs and get started with them.

<a href="https://www.egoodmedia.com/reddit-marketing-scale-your-business-using-reddit-in-2020/">Read more</a>

Read more Articles:-
<a href="https://www.egoodmedia.com/7-holiday-hashtag-creation-strategies-for-social-marketing/">7 Holiday Hashtag Creation Strategies For Social Marketing</a>
<a href="https://www.egoodmedia.com/how-to-improve-users-dwell-time-on-your-web-pages/">How To Improve User’s Dwell Time On Your Web Pages?</a>

Contact Details:-
1-6046704333
422 Richards St Unit 170, Vancouver, BC V6B 2Z4, Canada

<a href="https://www.egoodmedia.com/">Website Design Seattle Company</a>

Visit Reference Profile Websites:-

https://bit.ly/2QbsaMK
https://bit.ly/33ywxVi
https://bit.ly/3vXPQ6p
<a href="https://www.egoodmedia.com/google-image-search-to-drive-organic-traffic-on-your-website-in-2020/">Google image search drive traffic</a>
https://bit.ly/3vWHdZY
https://bit.ly/2SH2cl7
https://bit.ly/2R0uRkJ
https://bit.ly/3eDvo57
<a href="https://www.egoodmedia.com/how-social-media-engagement-has-changed-during-covid19/">Social media engagement during covid-19</a>
https://bit.ly/3hhebQH
https://bit.ly/3vXZplI
https://bit.ly/3uGOSvg
https://bit.ly/3hig9QS
https://bit.ly/3be8XkI
https://bit.ly/3tCiW9U
https://bit.ly/33EMZTD
<a href="https://www.egoodmedia.com/reddit-marketing-scale-your-business-using-reddit-in-2020/">reddit marketing</a>
https://bit.ly/3xTViJp
https://bit.ly/3ez3kzT
https://bit.ly/3uI95AV
https://bit.ly/3vO4xJe
https://bit.ly/3etbb1G
https://bit.ly/3xPcdwy
https://bit.ly/3tpo9lr
https://bit.ly/3f16ECE
https://bit.ly/3y2kygA
Dev tool: A Markdown editor for developers 🔥
Tags: webdev, javascript, productivity
Published: 2021-05-11 10:28:40

---
title: Dev tool: A Markdown editor for developers 🔥
published: true
description: Are you using a markdown tool to take note?
tags: webdev, javascript, productivity
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4rs4uda5tjidpmsaa6kh.png
---


As developer you probably spend most of your time to learn and test things. Grab and test small pieces of code, read and write documentation, both for you or your teammates and eventually coding. 😋

Since years, I made a choice to use Markdown as primary format to taking notes and this for 2 reasons:
- The markdown is **portable**, non vendor lock-in
- It's **perfect for writing code** and documentation (code highlight, html conversion...)

I also decided last year to bring my contribution to the community by providing [Znote](https://znote.io). *(self-promotion here)* an electron cross-platform note-taking app offering a dedicated experience for developers.

> Disclaimer: Even if the app is already available on all app stores and mobiles, Znote is still young with lot of improvements to do.

Furthermore, if as a software creator it's common to add new features, **I'm really excited to share this particular one with you which completely changed my daily work**.


# The Lab 🧪 

The **Lab** is a feature allowing to run JavaScript code directly in the note-taking app. You can use the **Node fs API** as well as the pre-included libraries to **explore and visualize your data**. ✨

Below are some examples:

Run plain Javascript
![Demo JS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yz0cb50dh8cpsbro6qe5.gif)

Read & Write file thanks to the Node FS API (it's an Electron App)
![Demo Node FS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p38v3905q5yxjg1w8jv4.gif)

Explore Data with [DanfoJs](https://danfo.jsdata.org/)
![Demo data exploration](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u2gk1092rj04frt017vw.gif)

Graph with [https://plotly.com/javascript/](Plotly)
![Demo Graph](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dxl556ciqo5ssmjw5fy4.gif)

And generate diagrams with [Mermaid](https://mermaid-js.github.io/mermaid/#/)
![Demo Mermaid](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cqrzf90msk49l1m5suk2.gif)

---

**Are you interested in helping me?**

Like I said above, even if the app is ready to use, my backlog is still enormous 📚. 
I plan to integrate more libraries and build-in plugins to add shortcut functions. I will send tutorials, probably via my newsletter (link on the landing Lab page). Do you already have any suggestions for me? I will be happy to read them here or on my Github: [landing page](https://znote.io).

__Hope you will enjoy using my app and it will make your job a little more fun.__
How to Choose your First Programming language
Tags: programming, python, machinelearning, java
Published: 2021-05-11 10:27:19


![how to choose your first programming lanugage](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q4riztn8dtjo61t38qif.png)
 Read more on my website 😃
https://buggyprogrammer.com/first-programming-language/
Social Media Virtual Assistant
Tags: socialmediavirtualassistant, virtualassistant
Published: 2021-05-11 10:22:55

A [Social Media Virtual Assistant](https://www.virtualtechninja.com/social-media-virtual-assistant.php) is a remote employee who promotes your company with social media-related tasks. They work out of the office. Virtual Tech Ninja is one of these companies. Which makes your business grow through social platforms.
ReactJS: How to customize styles of Material UI AutoComplete Dropdown
Published: 2021-05-11 10:19:23

In this post I'll explain, how you can change background of Material UI dropdown. However this way you can add any other css for dropdown as well.

`Autocomplete` component of Material UI has a `prop` named `PaperComponent`. You can change background of `dropdown` using this `prop`. 

Here I am passing a `Paper` component inside `PaperComponent` prop and setting its `background` to `yellow` using `style` prop. 
My list will now be rendered inside it, and dropdown's color will be `yellow` 

```js
      <Autocomplete
        id="combo-box-demo"
        options={mitarbeiter}
        onChange={() => {}}
        getOptionLabel={(option) => option.title}
        fullWidth
        PaperComponent={({ children }) => (
          <Paper style={{ background: "yellow" }}>{children}</Paper>
        )}
        style={{ width: 350 }}
        renderInput={(params) => (
          <TextField
            {...params}
            label="Mitarbeiter"
            variant="outlined"
            style={{ backgroundColor: "pink !important" }}
          />
        )}
        required
      />
```

I am passing `{children}` inside to make sure that list of options gets rendered there. 

Here is a working example @ codesandbox https://codesandbox.io/s/wizardly-frost-9cj0v?file=/src/App.js

if you need to set additional `styles` you can add to style prop of `<Paper>` component.
Fix Docker not launching MacOS
Tags: docker
Published: 2021-05-11 10:11:20

Docker is great but on Mac it sometimes fails to launch, perhaps because it is not closed properly before shutdown. In these scenarios docker is normally not yet in normal force quit window as it is not properly launched. Instead go to the Activity Monitor and force quit from there. To do this double click on the activity and press quit:
![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kfvxhw1tl6fnu8d7ijrk.png)
 

Then relaunch and all should be okay.
Devs go to stackoverflow, where do non-devs go?
Tags: discuss, javascript
Published: 2021-05-11 10:06:48

We all know the process: Google, stackoverflow, copy&paste --> Time saved!
Recently I had to do a non-dev task that involved googling a lot, so I made a [script to create the search-links in the browser console](https://bit.ly/googleFindInSites). That got me thinking that it might be useful for more people: So it's under permissive open source. Opening the console requires a bit of technical knowledge, so I also put together [a little video of copying and running it](https://youtu.be/nW6GGYhr0fA).

So, **how** to use it is clear. **Who** would use it though?

Just listing it on github and youtube does _NOT_ put it in front of people. ["Built it and they will come"](https://samuelmullen.com/articles/startup-fallacies-if-you-build-it-they-will-come/) doesn't work for startups and it seems - neither for little stuff. 

But **where** do you put your little scripts, so that they help someone?

_Disclaimer_: The links above will get me click-analytics, which I intend to share once I've learned something from the numbers.
Here are the full, non-tracked links: [Script](https://github.com/shnydercom/codesnippets/blob/master/googleFindInSites.js), [Youtube-video](https://www.youtube.com/watch?v=nW6GGYhr0fA)
Angular 6 ElasticSearch – Quick Start – How to add Elasticsearch.js
Tags: angular6, elasticsearch
Published: 2021-05-11 09:18:48

https://grokonez.com/frontend/angular/angular-6/angular-6-elasticsearch-example-quick-start-how-to-add-elasticsearch-js

Angular 6 ElasticSearch – Quick Start – How to add Elasticsearch.js

In this tutorial, we're gonna look at how to add ElasticSearch to an Angular 6 Project.

Related Posts:
- <a href="https://grokonez.com/uncategorized/angular-6-elasticsearch-example-add-document-to-index">Angular 6 ElasticSearch example – Add Document to Index</a>
- <a href="https://grokonez.com/elasticsearch/angular-6-elasticsearch-example-get-all-documents-in-index">Angular 6 ElasticSearch example – Get All Documents in Index</a>
- <a href="https://grokonez.com/elasticsearch/angular-6-elasticsearch-example-documents-pagination-with-scroll">Angular 6 ElasticSearch example – Documents Pagination with Scroll</a>
- <a href="https://grokonez.com/elasticsearch/angular-6-elasticsearch-example-simple-full-text-search">Angular 6 ElasticSearch example – simple Full Text Search</a>

** <a href="https://grokonez.com/elasticsearch">Elasticsearch Tutorials</a> **

<!--more-->
<h2>Install ElasticSearch</h2>
Go to <a href="https://www.elastic.co/guide/en/elasticsearch/reference/current/_installation.html" rel="nofollow" target="_blank">ElasticSearch guide - Getting Started » Installation</a> and follow step by step to install ElasticSearch.

Test local install of ElasticSearch
- by command line:
<code>curl -XGET localhost:9200</code>
- or enter <code>http://localhost:9200/</code> url on your Browser.

The result should be like this:
<pre><code class="language-javascript" >
{
   "name":"first_node_test",
   "cluster_name":"elasticsearch",
   "cluster_uuid":"E8eoz-uWT0Gxi-ygUIB10Q",
   "version":{
      "number":"6.3.2",
      "build_flavor":"unknown",
      "build_type":"unknown",
      "build_hash":"053779d",
      "build_date":"2018-07-20T05:20:23.451332Z",
      "build_snapshot":false,
      "lucene_version":"7.3.1",
      "minimum_wire_compatibility_version":"5.6.0",
      "minimum_index_compatibility_version":"5.0.0"
   },
   "tagline":"You Know, for Search"
}</code></pre> 
<h2>Add ElasticSearch to Angular 6 Project</h2>
<h3>1. Install the type definition</h3>
Run command:
<code>npm install --save-dev @types/elasticsearch</code>

You will see an <strong>elasticsearch</strong> directory in <strong>node_modules</strong> folder:

<img src="https://grokonez.com/wp-content/uploads/2018/08/angular-6-elasticsearch-example-quick-start-node-modules.png" alt="angular-6-elasticsearch-example-quick-start-node-modules" width="259" height="396" class="alignnone size-full wp-image-14143" />

More at:

https://grokonez.com/frontend/angular/angular-6/angular-6-elasticsearch-example-quick-start-how-to-add-elasticsearch-js

Angular 6 ElasticSearch – Quick Start – How to add Elasticsearch.js
Responsive Background Images Mixin with SCSS
Published: 2021-05-11 09:49:20

So responsive images are **BRILLIANT** with Bootstraps handy html class

```
.img-fluid
```


I also use [EWWW](https://ewww.io/) for optimizing my images on Wordpress and converting images to WEBP. 

However I wanted my background images to use have the same proportions whilst working responsively.

I used the below mixin and it has changed my life. Give it try.

```scss
@mixin responsive-bg-image($image-width, $image-height) {
  background-size: cover;
  height: 0;
  padding-bottom: percentage($image-height / $image-width);
  display: block;
  position: relative;
}
```
The future of ecommerce is with Jamstack: Next.js, Contentful and Shopify
Published: 2021-05-11 09:47:28

We’re trying something new in the Contentful DevRel team. Myself and Shy Ruparel are joining forces for four weeks of live streams to explore, experiment and build with Next.js, Contentful and Shopify — with the goal of proving why Jamstack is the future of ecommerce. You’re all invited!

Follow [ContentfulDevs](https://twitch.tv/contentfuldevs) on Twitch and join us when we begin our journey May 18, 2021.

___

## Jamstack is no longer just JavaScript, APIs and Markup

Since its origin in the mid 2010s, Jamstack has evolved into a super-speedy, fully-scalable, secure ecosystem of “headless” tools for building web applications. Jamstack architecture promotes tools that separate frontend and backend functionalities to allow full-stack teams to move faster. It encourages serving static HTML to browsers that is pre-rendered at build time. Jamstack has empowered small teams and individuals to build and deploy full-stack applications without the overhead of traditional model-view-controller application architecture. 

Today, developers are using Jamstack and open-source software to bootstrap, build and deploy websites in _a matter of minutes_.

Since the world moved almost entirely to the web during the Covid-19 pandemic, businesses have entered a new era of digital transformation. This shift has particularly impacted small-to-medium-sized enterprises (SMEs) offering physical products and services. Due to the inability to trade in-person, businesses had to move to online offerings to preserve their income. However, traditional all-in-one monolith solutions for ecommerce can be very costly for SMEs. That’s where Jamstack can help.

## Scale online as you grow your business

Ecommerce doesn’t have to cost a lot when you’re starting out. With Jamstack, you’ll only need to invest in the ecommerce tools to provide stock inventory and checkout functionality. This can start from as little as $29 per month, depending on the vendor. With that taken care of, you can build, deploy and release a basic website for free using popular hosting platforms such as [Netlify](https://www.netlify.com/) and [Vercel](https://vercel.com/), and you can [sign up with Contentful](https://www.contentful.com/sign-up) for free to serve your landing page content and marketing materials to your website. As your business grows and you’re serving millions of customers every day, Jamstack will scale with you. 

But is it really that simple?

## Salma and Shy will prove it

{% youtube mhMDUXQmjRo %}

For four weeks, Salma and Shy from the Contentful DevRel team will join forces to test this theory. Their hypothesis is that the future of ecommerce is supported by Jamstack. Their goal? To build an ecommerce site from the ground up using only Jamstack tools. They’ll be using Next.js, Contentful and Shopify. And who knows, maybe they’ll end up building the next ecommerce empire — Jamstack will ensure their empire scales as they do.

Follow [ContentfulDevs](https://twitch.tv/contentfuldevs) on Twitch and join Salma and Shy on their journey. It kicks off May 18, 2021.
No, Dont go...
Tags: career, job
Published: 2021-05-11 09:38:26

2019 - No salary increase, "Its not in the budget"

2020 - No salary increase, "Sales are down this year"

2021:

Employee: Please find my resignation on your desk

Manager: What? Why?

Employee: Got a better opportunity and salary increase

Manager: How much more?

Employee: 50%

A few days later...

Manager: Don't leave, we can match it, we need you here?

Employee: Sorry, It’s too late.

#career #job
docker and java
Tags: java, docker, microservices, serverless
Published: 2021-05-10 19:06:13


First thing you need is a java -JRE,JDK installed on to your system with the docker installed with all the additional kernels like Hyper-V or the WSL2 installed on to the system.

First let's start by writing java programing language code.

```java
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello docker world!"); 
    }
}
```
To test that whether your program is working proper run and execute the program save the program as firstprogram.java

and use the command `javac firstprogram.java`

then you will find the output

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/602k6hi5uzsh4ksr9vgj.PNG)

So now in order to run the program through the docker container we need to have the JDK installed on to the Docker image thus we can go to the docker hub and get the current version of the JDK on to your Docker image.

https://hub.docker.com/_/openjdk/

This is the link that I have listed above.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2mtqfjlfi18jxe97ppob.gif)

you can also go to the github repository and also see the offical images that you might be able to use.

https://github.com/docker-library

Now lets start creating the docker file

Open Dockerfile and start the code

```dockerfile
#alpine will be the base os or the webserver that we will be working on
FROM alpine will be working on
WORKDIR /root/program1
COPY firstprogram.java /root/program1

#Install JDK
#to add the openjdk8 for the environment
RUN apk add openjdk8 
ENV JAVA_HOME /usr/lib/jvm/java-1.9-openjdk
ENV PATH $PATH:$JAVA_HOME/bin

#for running the java porogram
RUN javac firstprogram.java

ENTRYPOINT java firstprogram
```
then you can build by using the following command

`docker run -t javafirstprogram .`

then you can run the program by typing in the command 

`docker run javafirstprogram`

then you will find the same output.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9l81qn3vjzxcr0qbc5gp.PNG)

Thus, you have learnt to get the java program up and running.

Thank you
Laravel 8 Authentication
Tags: laravel, programming, php, tutorial
Published: 2021-05-11 09:36:17

As Laravel 8 has removed default auth Scaffolding, I will explain about adding auth scaffolding in Laravel 8.

we can add the `laravel/ui` package has bootstrap and Vue UI Component and auth scaffolding.

To know more about this package you can visit 
[Github Laravel UI](https://github.com/laravel/ui).

##Steps To Add in Laravel 8

###Step 1
Include the `laravel/ui` package into project,

```php
composer require laravel/ui
```

Once the `laravel/ui` package has been installed, you may install the frontend scaffolding using the `ui` Artisan command:

```php
// Generate basic scaffolding...
php artisan ui bootstrap
php artisan ui vue
php artisan ui react

// Generate login / registration scaffolding...
php artisan ui bootstrap --auth
php artisan ui vue --auth
php artisan ui react --auth
```

###Step 2
After including UI Components now we have to add CSS and JS Files, For that, we need to run the following commands.

```javascript
npm install
npm run dev
```

You can watch this video I have explained this.

<a href="http://www.youtube.com/watch?feature=player_embedded&v=GixbjPkMVtE" target="_blank">
</a>


{% youtube GixbjPkMVtE %}


Thank You for Reading

Reach Out To me.
[Twitter](https://twitter.com/shanisingh03)
[Instagram](https://www.instagram.com/shanisingh03/)
[TechToolIndia](https://youtube.com/techtoolindia)
React Bootstrap 5
Tags: react, bootstrap, javascript, css
Published: 2021-05-11 09:31:25

We just released  **[React Bootstrap 5](https://www.producthunt.com/posts/react-bootstrap-5)**  on Product Hunt.

Only a few days after the stable release of Bootstrap 5 - we can integrate it with React 17.

Features:

- RTL support
- Material Design 2.0 guidelines
- extensive docs & API
- 700+ UI components & templates
- MIT license - free for personal & commercial use

I hope you will enjoy it :)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6cbee6y5y3i92smfw5eg.jpg)

# NPM Installation

## Prerequisites

Before starting the project make sure to install Node LTS (12.x.x or higher). We are using yarn to start a project.

*If you want to use package from npm you have to have a project with React. We recommend creating an app with create-react-app from react for beginners.*

### Step 1: Create React App. 
We are using React 17+ version.

```
yarn create-react-app my-app or npx create-react-app my-app
``` 

### Step 2:  Navigate to App's directory

``` 
cd my-app
``` 

## React Bootstrap 5 installlation

### Step 1:  Setup MDB

``` 
yarn add mdb-react-ui-kit or npm i mdb-react-ui-kit
``` 

**CSS import**

Add the following line in your index.js file before the App.js file import:
``` 
import 'mdb-react-ui-kit/dist/css/mdb.min.css'
``` 

**Font Awesome**

Add the following line in public/index.html file inside head section:
``` 
<link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" />
``` 

**Roboto font**

Add the following line in public/index.html file inside head section:
``` 
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
``` 

Set font family in globally css file for example src/index.css inside src folder as in the example:
``` 
body { font-family: Roboto, Helvetica, Arial, sans-serif; }
``` 

### Step 2:  Launch Your App
``` 
yarn start or npm run start
```