teleren/devto huggingface dataset:
I Made a Working Calculator Using Javascript
Tags: beginners, javascript, calculator, webdev
Published: 2022-02-10 03:08:47

Today my classmates and I (at DigitalCrafts) were given the assignment to create a basic calculator in Javascript. Sounds simple enough, right? Well, my classmates and I were joking around about how we had just been introduced to what a DOM (Document Object Model) was earlier in the day and now we were creating a whole mini project in Javascript, manipulating the DOM based on what the user clicks. 

With that being said, learning Javascript is challenging and exciting! With the few days of exposure that I've had to it, I can see how powerful and complex it is. 

Something new that I learned today was the addEventListener() method. Here's a snippet of my code to show how I used the method to make part of  the calculator work (I'll explain a little below):

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

- `clear` is the variable that I created for my clear button in Javascript, which is an object.
- The event that I am waiting for is a `"click"`. To be more specific, a `"click"` on the object that the method is attached to  (in this case, the clear button).
- `() => {}` is another to write a function. It is the same as writing `function () {}`. Functions that do not have names are called _anonymous_ _functions_.
- Once the event happens (the `"click"` on `clear`), the anonymous function (`() => {}`) will run. In this case, I wanted to make the equation array and input value empty.
- The anonymous function in the method only runs once the event happens.

When I first saw this method, it seemed daunting, but the more I broke it down, the easier it was for me to understand. 

Overall, I am satisfied with the simple calculator that I built today, but I would love to revisit it when I have the time to make it more complex!

If you'd like to see the code for my calculator, [click here](https://github.com/ciaracloud/calculator) to visit my github repository!
7 tips on how to optimize your Frontend workflow efficiency
Published: 2022-02-10 02:48:52



What is a workflow?

A workflow is a collection of tools and processes that you use to get your work done. It might include a text editor, a code linter, a build tool, and a version control system.

Why optimize your workflow?

💅A well-optimized workflow can 

1.Save you time ⏰

2.Improve your productivity 📊

3.Make your code easier to read and maintain 🐕‍🦺

There are many different ways to optimize your workflow. Here are 7 tips that can help you get started.

**1. Use a text editor that supports syntax highlighting and autocompletion**.

A good text editor can make your life a lot easier. It should have syntax highlighting and autocompletion to make it easy to read and write code.

**2. Use a code linter to help you write clean code**.

A code linter can help you write code that is error-free and consistent. It can also help you learn the rules of your language.

**3. Use a build tool to automate your development tasks**.

A build tool can automate common tasks, such as compiling your code, minifying your code, and running tests. This can save you time and improve your productivity.

**4. Use a version control system to track your changes and collaborate with others.**

A version control system can help you track your changes, collaborate with others, and roll back changes if necessary.

**5. Use a package manager to manage your dependencies**.

A package manager can help you install and manage your dependencies. This can make it easier to keep your code up-to-date.

**6. Use a code formatter to format your code automatically.**

A code formatter can help you keep your code organized and consistent. It can also make your code easier to read and maintain.

**7. Use a code scanner to scan your code for potential security vulnerabilities.**

A code scanner can help you find and fix potential security vulnerabilities in your code. This can help keep your code safe and secure.

Thank you for reading! I hope you found this blog useful. If you're interested in following my GitHub profile, please click the "follow" button below. I'll be sure to keep you updated on my latest projects [follow](GitHub.com/yakumwamba)
Wordpress Website Development Services Offer By Ray Software Solution
Tags: webdevelopmentcompany, wordpresswebsitedevelopment, websitedevelopment, digitalmarketing
Published: 2022-02-10 02:40:55

**In need of a powerful website?**

At [Ray Software Solution](https://www.raysoftwaresolution.com/), we have working with WordPress for years and have experience in WordPress web designing, custom WordPress development, and search engine marketing. The [WordPress CMS](https://www.raysoftwaresolution.com/wordpress-development-services/) is a great solution for content based or ecommerce website, allowing the users to easily manage content. Our team of experts put together a development plan, platform suggestion, and an overall project budget and timeline with better [services](https://www.raysoftwaresolution.com/services/). We work with an aim to build the website the right way and design it blending our experience and client’s requirements beautifully. 

We have a team of specialists who can help you create amazing custom WordPress website for your business, along with implementing responsive design and [SEO](https://www.raysoftwaresolution.com/seo-digital-marketing-services/)to ensure that you reap the benefits of your new website.
#009: Como definir um template para um índice
Tags: elasticsearch, template, mapping, aliases
Published: 2022-02-10 01:59:21

No artigo anterior [#008: Como definir o mapeamento no Elasticsearch](https://dev.to/brunoflegler/008-como-definir-o-mapeamento-no-elasticsearch-13c0) definimos um mapping diretamente no índice, porém podemos criar um template e criar o índice a partir dele. Essa estratégia é útil quando criamos índices temporais.


```json
PUT /_template/customers
{
  "index_patterns": [
    "customers_*"
  ],
  "aliases": {
    "customers": {}
  },
  "mappings": {
    "properties": {
      "id": {
        "type": "text"
      },
      "age": {
        "type": "integer"
      },
      "email": {
        "type": "text"
      },
      "name": {
        "type": "text"
      },
      "createdAt": {
        "type": "date"
      }
    }
  }
}
```

O campo `index_patterns` será usado para corresponder aos nomes dos índices durante a criação. Exemplo: `customers_2022_02`, `customers_2022_03`, uma vez que o nome do índice corresponde ao pattern `customers_*` o índice é criado com o mapping definido no template.

```json
PUT /customers_2022_02
```

```json
GET /customers_2022_02/_mapping
{
  "customers_2022_02" : {
    "mappings" : {
      "properties" : {
        "age" : {
          "type" : "integer"
        },
        "createdAt" : {
          "type" : "date"
        },
        "email" : {
          "type" : "text"
        },
        "id" : {
          "type" : "text"
        },
        "name" : {
          "type" : "text"
        }
      }
    }
  }
}

```

O campo `aliases` também é bem útil quando queremos buscar em todos índices criados a partir do template. Exemplo: `customers_2022_02`, `customers_2022_03`, podemos pesquisar em ambos índices utilizando apenas o nome `customers`.

```json
GET /customers/_search
{
  "query": {
    "match_all": {}
  }
}
```

Sua vez de praticar, te vejo em breve.
I built a landing page with ReactJS.
Tags: react, css, javascript, beginners
Published: 2022-02-10 01:57:39

Hello wonderful people. I designed this responsive landing page on Figma then built it with ReactJs. You can find the code on [github](https://github.com/peteregbujie/foodbank-landing-page). Feedback is welcome.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gb1zxrmyknzx75cz37au.png)
How to pass data in flutter on Stateless Widget?
Published: 2022-02-10 01:52:27

I'm trying to do an assignment, and have run into difficulty with passing data into Stateless Widgets. I have the following classes:

```
 class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Page1(),
    );
  }
}




class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: ElevatedButton(
        onPressed: () {
          Navigator.push(
              context, MaterialPageRoute(builder: (context) => Page2(messageData: messageData)));
        },
        child: Text('Request Chat'),
      )),
    );
  }
}




class Page2 extends StatelessWidget {
  //Navigation
  static Route route(MessageData data) => MaterialPageRoute(
        builder: (context) => Page2(
          messageData: data,
        ),
      );

  const Page2({Key? key, required this.messageData}) : super(key: key);

  final MessageData messageData;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        iconTheme: Theme.of(context).iconTheme,
        centerTitle: false,
),
),
},


@immutable
class MessageData {
  const MessageData(
      {required this.senderName,
      required this.message,
      required this.messageDate,
      required this.dateMessage,
      required this.profilePicture});

  final String senderName;
  final String message;
  final DateTime messageDate;
  final String dateMessage;
  final String profilePicture;
}

```
There is my messageData above that I need to pass.

Basically, I want to be able to Navigate to Page2() but I keep getting an error at Navigator.push() . Error details: `Type' can't be assigned to the parameter type 'MessageData'.`

And when there are no arguments on Page2() the error message: `The named parameter 'messageData' is required, but there's no corresponding argument.`
No-code/Low-code Platforms
Tags: discuss, softwaredevelopment, management
Published: 2022-02-10 01:47:16

When it comes to developing applications, there are two primary schools of thought: those who believe in coding everything from scratch and those who think that using a platform with pre-built features and functions is the way to go. In this blog post, we're going to take a look at no-code and low-code platforms – what they are, how they work, and why you might want to consider using them.

In general terms, no-code platforms look to:
- Empower citizen developers to take products to market
-Remove the barriers that have traditionally kept people from creating software
- Democratize software development and help bridge the gap between the business and IT worlds

Low-code tools aim to:
- Empower developers to build custom applications without needing traditional coding skills
- Accelerate the process of application development by eliminating the need for cumbersome and time-consuming hand-coding
- Enable businesses to quickly create and deploy custom applications that meet their specific needs
- Reduce the cost and complexity of application development

They both recognize that the faster you can get a product or service to market, you are likely to be more successful. This has never been more important in today's digital age, and as new technologies emerge, businesses must adapt to remain competitive. 

Low-code and no-code platforms are fast, easy to use, and cost-effective. But you might want to consider how flexible they will be for your team of engineers before choosing one. For example, while one no-code solution may seem like it would be faster and easier to implement, this doesn't consider that different engineers prefer using different toolsets or languages. 

A low-code approach gives your team more flexibility by working more seamlessly with the generated output. This can lead to greater productivity and less frustration in the long run. What do you think? Have you used either type of toolset before?

---

Photo by <a href="https://unsplash.com/@ryland_dean?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Ryland Dean</a> on <a href="https://unsplash.com/s/photos/code?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
What is Robotic Process Automation?
Tags: rpa, automate
Published: 2022-02-10 01:39:33

Read our in-depth guide and find out everything you need to know about [RPA](https://flobotics.io/what-is-robotic-process-automation/). You can also get a free [RPA consultation](https://flobotics.io/) to know how can you benefit from implementing RPA in your company.
So you have a lot of markers...
Tags: maps, googlemaps, markers, performance
Published: 2022-02-10 01:27:19

I often run into questions about how do I render XX,XXX markers on a map in a web application, specifically a `google.maps.Map()` instance. The answer usually depends on the particular application requirements, but there are only a few good options.

# Options

1. [Cluster the markers](#clustering)
2. Use WebGL
3. Write a custom OverlayView
4. Render the markers server side

## Clustering <a name="clustering"></a>

Typically, I suggest starting with #1, clustering the markers. Two libraries to be aware of are [@googlemaps/markerclusterer](https://www.npmjs.com/package/@googlemaps/markerclusterer) and [supercluster](https://www.npmjs.com/package/supercluster), a high performance kd-tree cluster implementation.

![Marker clustering using @googlemaps/markerclusterer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/10qvvpqz37du9gsn3pow.png)

> **Note**: @googlemaps/markerclusterer using supercluster internally.

For React users, check out [use-supercluster](https://www.npmjs.com/package/use-supercluster).
postman clone
Tags: javascript, webdev, tutorial, programming
Published: 2022-02-10 01:19:17

# postman-clone
### clone postman using reactjs and bootstrap and only json data transformations [postman clone repository](https://github.com/alguerocode/postman-clone)

- before we starting, support me by adding a star to the [volder repository](https://github.com/devSupporters/volder)

<p align="center">
  <img src="https://user-images.githubusercontent.com/75932477/124395936-005d4c00-dd18-11eb-9fbb-9c5458cdf22e.png">
</p>

## library used

- React
- Bootstrap
- nodejs(for test)

### Clone the project

```bash
  git clone https://github.com/alguerocode/postman-clone.git
```

### Go to the project directory

```bash
  cd postman-clone
```

### Install dependencies

```bash
  npm install 
```

### Start the server

```bash
  npm run start
```
ZenDesk Customer Help Application 
Published: 2022-02-10 00:54:25

The need here is for there to be a platform upon which Clients can contact Customer Support directly regarding their ticket purchases. In order to achieve this, there must be a client-facing UI which offers message board-like functionality for the Customer Support to respond to Client comments and complaints.

The solution this ZenDesk Course offers is a [Customer Help Application](https://training.zendesk.com/elearning-the-zendesk-apps-developer) on the ZenDesk Application Framework (ZAF) which uses HTML, CSS, Ruby and async JavaScript. 

In order to build this application, one must first confirm that one has the latest version of Ruby installed on their machine `ruby -v`, `gem install rake` for database management, install ZAT `gem install zendesk_app_tools` and initialize a new application on the ZenDesk framework using the command `zat new`.

There are three crucial elements: the `manifest.json` file is located in the `root` directory and includes administrator information and validations. The `assets` directory includes the logo files and the `iframe.html` which is the Document Object Model. The third crucial element is the `translations` folder located in the `root` directory. 

The first step is to create an instance of the ZAF Client Object `ZAFClient.init()` by assigning it to the variable `client`

``var client = ZAFClient.init();``

The following steps include adding `event listeners`, `fetch`ing information about tickets from external APIs, building the `user interface` using CSS, and packaging, validating and uploading the application to the ZenDesk Marketplace.
The Best Podcasts For Devs
Tags: podcast, javascript, jr
Published: 2022-02-10 00:40:10

Hey there, lately I am introducing myself into the podcast world, it is incredible how much resources for programmers there are, for every level and can find big wolfs of the industry giving their time to make a podcast, I was listening "From Junior To Senior" Podcast on Spotify, huge recommended.

This is my first Post and wonder not the last one, I am new on this website, just wanted to share this knowledge and of course was exciting to post, please if you have recommendations to where find great podcasts for devs comment below

Tnx !!!
Tmux New Session
Tags: tmux, zsh, bash
Published: 2022-02-28 10:48:24

---
title: Tmux New Session
published: true
date: 2022-02-10 00:00:00 UTC
tags: tmux, zsh, bash
canonical_url: https://tech.serhatteker.com/post/2022-02/tmux-new-session/
---

## Entrée

I keep forgetting how to create a new tmux session.

Is it this one?

```bash
$ tmux new
sessions should be nested with care, unset $TMUX to force
```

No.

Is it this one?

```bash
$ tmux new-session
sessions should be nested with care, unset $TMUX to force
```

No.

```bash
$ tmux new-session -d
# from tmux cli, prefix/ctrl+b
# :new -d
```

No error? Good. Check session with prefix + s (`ctrl + b + s`). Ok it seems this works.

However this gives a strange session name like **29**. What is it? I though **the ultimate answer to the universe** was **42**.


## Solution


Here is the complete command to create a new tmux session:

```bash
$ tmux new-session -d -s "new" -c ~/path/to/some/dir -n "main"
```

This command will create a session named *new*, with a window named *main* in `~/path/to/some/dir` as working directory.

It would probably better to run it from *function* with some *args* for more customization;

```bash
# .zshrc/.bashrc


# Crate and attach a new session with args
# defaults: session named "new" in ${HOME} as working dir with window named "main"
#
# Usage:
# $ tnew
# $ tnew remote ~/path/to/dir
# $ tnew remote ~/path/to/dir scripts
tnew() {
    local session_name="${1:-new}"
    local session_dir=${2:-~/}
    local session_window_name="${3:-main}"

    tmux new-session \
        -d \
        -s ${session_name} \
        -c ${session_dir} \
        -n ${session_window_name}
}
```

As described in function's doc you can use this function as below:

```bash
$ tnew
$ tnew remote ~/path/to/dir
$ tnew remote ~/path/to/dir scripts
```

Now I can peacefully forget (again) *creating new tmux session*, all I need to
remember: **tnew**.


All done!
How to convert the first letter of a string literal type into an uppercase format or capitalize in TypeScript?
Tags: typescript
Published: 2022-02-10 00:00:00

---
  title: How to convert the first letter of a string literal type into an uppercase format or capitalize in TypeScript?
  published: true
  tags: TypeScript
  date: Thu Feb 10 2022 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/convert-first-letter-string-literal-type-uppercase-format-or-capitalize-typescript
  cover_image: https://melvingeorge.me/_next/static/images/main-2b9ddf8085698509c5315541ff9684e9.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/convert-first-letter-string-literal-type-uppercase-format-or-capitalize-typescript)
  
To convert the first letter of string literal type into an uppercase format or capitalize, you can use the built-in `Capitalize` type that comes with TypeScript.

### TL;DR

```ts
// string literal type
type Greeting = "hello";

// convert first letter of
// string literal type
// into uppercase format or capitalize
type GreetingCapitalized = Capitalize<Greeting>; // Hello
```

For example, let's say we have a string literal type like this,

```ts
// string literal type
type Greeting = "hello";
```

Now to capitalize the string literal type let's use the `Capitalize` built-in type and pass the `Greeting` type into it using the angled bracket (`<>`) syntax.

It can be done like this,

```ts
// string literal type
type Greeting = "hello";

// convert first letter of
// string literal type
// into uppercase format or capitalize
type GreetingCapitalized = Capitalize<Greeting>; // Hello
```

Now if you hover over the `GreetingCapitalized` type you can see that the `hello` string literal type is now capitalized. Yay 🥳.

See the above code live in [codesandbox](https://codesandbox.io/s/convert-first-letter-string-literal-type-uppercase-format-or-capitalize-typescript-3j3r1r?file=/src/index.ts).

That's all 😃!

### Feel free to share if you found this useful 😃.

---
How to be a Digital Nomad
Tags: remotework, wfh
Published: 2022-02-10 21:03:43

---
title: How to be a Digital Nomad
published: true
date: 2022-02-10 00:00:00 UTC
tags: remotework,wfh
canonical_url: https://jhall.io/archive/2022/02/10/how-to-be-a-digital-nomad/
---

Love the nomad lifestyle but not sure how to pull it off? You’re in luck! In this episode, the panelists discuss their personal experiences working (and sometimes living) remote. They cover how to generate leads and book clients consistently, why the “multiplier effect” is HUGE for making your new ideas lucrative, and the ONE reason you don’t need revolutionary ideas to find success.

## In This Episode

1. What the panelists all learned from being digital nomads (and if it’s right for you)
2. How the panelists generated leads and booked clients while traveling abroad (and the apps they used to keep their income steady)
3. Why the “multiplier effect” is the KEY to making your new idea lucrative
4. The reason you DON’T need revolutionary ideas to find success (and the strategy to keep readers coming back for more)

[![](https://jhall.io/images/aido-600px_hu064dd3473c23b0dee6f42abfef90a45c_156562_400x0_resize_q85_box.jpg)](https://adventuresindevopspodcast.com/how-to-be-a-digital-nomad-devops-103)

* * *
_If you enjoyed this message, [subscribe](https://jhall.io/daily) to <u>The Daily Commit</u> to get future messages to your inbox._
Simple Samba Share Setup
Tags: linux, todayilearned
Published: 2022-02-09 22:51:39

---
canonical_url: https://waylonwalker.com/til/simple-samba/
published: true
tags:
- linux
- til
series: til
title: Simple Samba Share Setup
---

Samba is an implementation of the smb protocol that allows me to setup network shares on my linux machine that I can open on a variety of devices.

I think the homelab is starting to intrigue me enought to dive into the path of experimenting with different things that I might want setup in my own home. One key piece of this is network storage.  As I looked into nas, I realized that it takes a dedicated machine, or one virtualized at a lower level than I have capability for right now.


## Humble Beginnings

To get goind I am going to make a directory `/srv/samba/public` open to anyone on my network.  I am not going to worry too much about it, I just want something up and running so that I can learn.

Install samba, open the firewall, and edit the `smb.conf`
```
sudo apt install samba samba-common-bin sudo ufw allow samba sudo nvim /etc/samba/smb.conf
```

I added this to the end of my `smb.conf`

```
[public]

comment = public share, no need to enter username and password path = /srv/samba/public/ browseable = yes writable = yes guest ok = yes
```

Then I made the `/srv/samba/public` directory and made it writable by anyone.

```
sudo mkdir -p /srv/samba/public sudo setfacl -R -m "u:nobody:rwx" /srv/samba/public/
```

## Windows, yes windows

I have a windows desktop in my office, primarily for my wife to run premiere pro, and my son to play Minecraft.  I walked over to it, opened the file explorer, and ernt to `\\<my-local-ip>`.  It asked for the username and password, I typed in the username and password of the linux device I have the share running on, and I was in.  Right there I could see the Public folder.  I opened it and made a files successfully.

## What's in your homelab?

I am just starting to scratch the surface of homelab, and will likely set up some more permanent things eventually.  What are some things I should look at?