teleren/devto huggingface dataset:
Telegram Bot - Parte 2: Live reload
Tags: tutorial, spanish, heroku, programming
Published: 2022-07-02 21:55:13

Listo el código de nuestro pequeño bot en ***Js***, vamos a agregarle una funcionalidad extra y a aprender a utilizar una herramienta súper útil a la hora de trabajar con Node.js: [**Nodemon**](https://nodemon.io/)


### ¿Qué es Nodemon? 
En palabras simples: Es una utilidad que nos sirve para permitir que los cambios que realicemos en nuestro proyecto se implementen en tiempo real. 

En palabras más técnicas -o precisas- y  [siguiendo la fuente de Digital Ocean](https://www.digitalocean.com/community/tutorials/workflow-nodemon-es#:~:text=nodemon%20es%20una%20utilidad%20de,instalar,%20preparar%20y%20configurar%20nodemon%20.): **nodemon** es una utilidad de interfaz de línea de comandos (CLI) que envuelve su aplicación Node, vigila el sistema de archivos y reinicia automáticamente el proceso.

&nbsp;
&nbsp;
&nbsp;

### Instalación
Globalmente: 
```
$ npm install nodemon -g
```

```
$ yarn global add nodemon
```

Localmente: 
```
$ npm install nodemon --save-dev
```

```
$ yarn add nodemon --dev
```

Si vas a instalarlo de manera local, recordá que no vas a poder utilizar el comando nodemon directamente desde línea de comandos.



&nbsp;

### Uso
Hasta aquí para levantar nuestra aplicación corríamos desde terminal el siguiente comando: 

```javascript
node bot.js
```

El problema con esto es que cada cambio que hagamos en nuestro código, sólo lo veremos después de terminar el proceso y volver a levantarlo. 
  
🚩 ¿Bastante tedioso no? 

Con Nodemon cambiamos el código de inicialización anterior por el siguiente: 
```javascript
nodemon bot.js
```

y en terminal deberíamos ver algo como esto: 

![nodemon](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c1g03w0nxhlpkl4p3nyc.png)

&nbsp;
&nbsp;
&nbsp;

¡Ahora si! 
Cada cambio que realizemos, deberíamos verlo en tiempo real. 👀

¿Cool no? 

<img width="100%" style="width:100%" src="https://media.giphy.com/media/PudZiAbQDUEik/giphy.gif">

&nbsp;
&nbsp;

En la próximo y última entrada de nuestro Telegram Bot vamos a subirlo a Heroku y dejarlo operativo en Telegram. 🤘🤘
How to iterate over an object in Javascript?
Tags: javascript, typescript, react, webdev
Published: 2022-07-02 21:49:56

It was during the initial days when I was learning Javascript, I always used to be struck at a point when Objects are involved which is iterating over them. It also used to be so confused whenever I encountered a problem where I had to create a `hashmap` using an empty Object.

This article will give you a clear picture about how you can and how you cannot iterate over Objects in Javascript.

You cannot iterate over Javascript objects using the regular methods like `map()`, `forEach()` or `for..of` loop.

Let there be an object:

```javascript
const object = {
    name: 'Rakshit',
    age: 23,
    gender: 'Male'
}
```

Using `map()`

```javascript
object.map(obj => {})
```

You will get an error saying `TypeError: object.map is not a function`

Using `forEach()`

```javascript
object.forEach(obj => {})
```

You will again arrive at an error saying `TypeError: object.forEach is not a function`

Using `for..of`

```javascript
for (const obj of objects) {}
```
This will give you `TypeError: object not iterable`


So, how exactly can you iterate an object in Javascript?

Here are some of the ways you can do that: 

One of the most simplest way is to use `for..in` loop

```javascript
for(const obj in object) {}
```

But, personally I love to iterate over an object using the `Object.entries()` method. This method generates an array of all the enumerable properties of the object passed into it as an argument.

Since, it returns an array you can use any of the methods you use to iterate over an array.

Using `map()`

```javascript
Object.entries(object).map(obj => console.log(obj))
```

Using `forEach()`

```javascript
Object.entries(object).forEach(obj => console.log(obj))
```

Using `for..of`

```javascript
for (const obj of Object.entries(object)) {
  console.log(obj)
}
```

That's it! Eureka! With this article I am sure you will never forget how to iterate over Objects in Javascript.

I hope the article helps.

Reach me out on [Github](https://github.com/rak-shit) and [LinkedIn](https://www.linkedin.com/in/mrakshit/).

Follow me on [Twitter](https://twitter.com/mRakshit_)

Have a nice day :)
Reduct Storage Python SDK v0.3.0 has been released
Tags: reductstorage, python, news
Published: 2022-07-02 21:45:25

Good news everyone!

Reduct Storage Python SDK [v0.3.0](https://github.com/reduct-storage/reduct-py/releases/tag/v0.3.0) has been released.

It supports the latest Reduct Storage HTTP API v0.6.0, but the most important change is data streaming. Let's see how it works with examples!

## Prerequisites

This post isn't a tutorial, and I suppose you know how to launch an instance of Reduct Storage and create a bucket there. If you don't know, then a few links that can help:

* [Getting Started](https://docs.reduct-storage.dev/)
* [Usage example of the Python SDK](https://reduct-py.readthedocs.io/en/latest/#example)

## Read Data By Chunks

In this release, we introduced a new method `Bucket.read_by` to read data by chunks with an asynchronous iterator:

```python
 with open("file.bin", "wb") as file:
     async for chunk in bucket.read_by("entry-1", chunk_size=1024):
         file.write(chunk)
```

It might be useful when you have a big record to download or need to read many records in the same time.

## Write Data By Chunks

To write data by chunks, can be a bit more tricky. First, you have to pass an asynchronous iterator to the `Bucket.write` method. Then you have to specify the size of the data which you're writing. The storage engine requires the `content-lenght` header, and the user should know the size of written data in advance.

```python
file_path = Path("./path/to/file")
async def sender():
    with open(file_path, "br") as file:
         while True:
             chunk = file.read(1024)
             if not chunk:
                 break
             yield chunk

content_length = file_path.stat().st_size
await bucket.write("entry-1", sender(), content_length=content_length)
```

If you've got interested, learn more about the storage engine [here](https://docs.reduct-storage.dev/how-does-it-work)


------------------
Cover Image Designed by roserodionova / Freepik
Testing a project contained in a monorepo
Tags: testing, javascript, node, beginners
Published: 2022-07-02 21:29:22

A 'monorepo' is the term used to describe the organization of multiple distinct projects with well-defined relationships into a single code repository[^1] rather than having each project be in its own dedicated repository.

Monorepos have been around for a while, but if you haven't worked with them before, figuring out how to test changes made in one of the projects contained within a monorepo in a local or deployed staging environment might not be the most intuitive.

For this guide, we're going to assume that we're dealing with Node projects and packages.

## Local environment

To test a project that lives within a monorepo in your local environment:
* Run `npm link` within the directory of the monorepo project that you want to test
* Run `npm link` within a project that has the monorepo project listed as a dependency that you will be using to test the changes made in the monorepo project
* Run the test project


If you're interested in learning more about how `npm link` works under the hood that leads to this working, there's a really great Medium article by Alexis Hevia that can be read [here](https://medium.com/@alexishevia/the-magic-behind-npm-link-d94dcb3a81af).

## Staging environment

If you're looking to test your changes in a deployed environment instead, you'll have to do something a little bit different.

When projects are in their own dedicated repository, it's usually possible to push the changes to a git branch and then reference that branch as the version of the project in the `package.json` file such as `<your organization or user>/<project repository>#<branch>` (rather than `^1.2.3`). 

Due to expectations on the structure of the backing repository needing to match a modules' published structure which doesn't exist in a monorepo project[^2], we instead will create a tarball of the modified project and store the tarball on a predictable path to be referenced as the version of the project in the `package.json` file.

To do this:
* Run `npm pack` within the directory of the monorepo project that you want to test
* Commit the tarball to a git branch that you're using for testing purposes
* Push the branch to github
* Update the version of the monorepo project to reference the tarball file - `"https://github.com/<username>/<repo>/raw/<branch>/[path]/<tarball>"` - within the project that has the monorepo project listed as a dependency that's being used to help test the changes
* Deploy the test project


Credit for the above workaround goes to Stephen Peck and the [gist](https://gist.github.com/stephen-peck/719ec5419c670677f94e97f7ea40ab56) he made.

## Conclusion

While requiring a little bit of work, testing a project contained within a monorepo is not too bad once you're made aware of the setup needed to allow npm to install the modified project correctly.

Hopefully this was helpful, happy testing!

[^1]: https://monorepo.tools/
[^2]: https://gist.github.com/stephen-peck/719ec5419c670677f94e97f7ea40ab56
Cloud Resume Challenge - AWS
Tags: aws, javascript, tutorial, fullstackdevelopment
Published: 2022-07-02 21:27:35

So one of my weekend projects was to take on the challenge **_The Cloud Resume Challenge - AWS_**. I was ready for this challenge and excited to begin. I found a HTML/CSS template I liked and was ready to roll. I also found and followed along with a great tutorial. 

Setting up the DNS re-routes and adding the https protocol via CloudFront was very interesting. I've never worked with DNS/CNAMES records during any of my Full-Stack Development trainings so reviewing this process was new.  However, after completing all the steps, I was unable to get both my css and images to load. See Network errors below. After much research and assistance from a fellow Meetup group member, I had to update my local css and image source files that were being served by AWS.  

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

For steps 7-9, I took an easier route that accomplished all the steps based on my understanding. While researching, I came across a counter and plugged in their JavaScript. This site appears to host the counter data on their servers database and will serve up the count via hits to their API. 

**7. Javascript**
Your resume webpage should include a visitor counter that displays how many people have accessed the site. You will need to write a bit of Javascript to make this happen. 

**8. Database**
The visitor counter will need to retrieve and update its count in a database somewhere. I suggest you use Amazon’s DynamoDB for this. (Use on-demand pricing for the database and you’ll pay essentially nothing, unless you store or retrieve much more data than this project requires.) 

**9. API**
Do not communicate directly with DynamoDB from your Javascript code. Instead, you will need to create an API that accepts requests from your web app and communicates with the database. I suggest using AWS’s API Gateway and Lambda services for this. 

My favorite part of the challenge was step 13, see below. Learning about the automation process of AWS CI/CD. I was able to add my Github repositories using GitHub Apps which then triggers and event and automatically apply updates and deploy to S3. The stack used was GITHUB + AWSCodePipeLine + AWSS3.

**13. Source Control**
You do not want to be updating either your back-end API or your front-end website by making calls from your laptop, though. You want them to update automatically whenever you make a change to the code. (This is called continuous integration and deployment, or CI/CD.) Create a GitHub repository for your backend code.

Check out my project Portfolio Resume -www.moniquebennettlowe.com

Share your thoughts :)
how to merge different commit in one commit
Tags: github, git, githunt
Published: 2022-07-02 20:57:00

**Steps to do:**

1. Get the log after which you want to merge all commit 

```
git log
```
2. Rebase that commit 

```
git rebase -i <commit id>
```
3. It will show all commit above the commit we pick to rebase  

4. Now, have to squash commit in one commit and for that pick one commit and other's are to squash in that commit(means merge all commit in that pick commit)

![git rebase](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u25l2wq4in9v9ymr9pph.png)
5. Git log can also view in oneline 

```
git log --oneline
```
6. Now on exit, it ask you to commit a message, do that and exit with :x
7. Done. Check your log now ✌️
How To use ES6 import & export in your project
Tags: webdev, javascript, beginners, tutorial
Published: 2022-07-02 20:52:35

#### Hello Everyone, I hope you're doing well 
<br/>


#### So After that being said, let's start our blog, so in this blog you'll learn how to use the ES6 features on your client or server project 

<br />

<br />


#### Frontend aka Client

You've an `index.html`  file and some `css` and `js` files, and for most cases you want to separate  your Javascript code into multiple files and just  import the necessary code into your main file let's say `script.js`. 


<br/>

The old way is to link those files in your html file and your main js file linked the last,
for exp you have these js files 

```
script.js
keys.js
utils.js
anotherFile.js
```


and let's say your `script.js` is the main one, the `anotherFile.js` is depending on the `utils.js` and the `utils.js` is depending on `keys.js` (depending word here means, that file is importing some data or needing some data from the other file)

<br/>

this is what it would look like on your html file (index.html) to make your code work


![scripts tag](https://drive.google.com/uc?id=15yJyTxFbW4NIk98FcWvzM-EIRj7RSwQH)




<br/>

You probably said what is the problem , right? 

so in our case here we have a few js files, imagine that you've a big project to work on and let's say 20 js files in your project 


![Panic gif](https://c.tenor.com/oSASxe-6GesAAAAC/spongebob-patrick.gif)


<br/>

I feel you LOL, 

so we need to find a Solution, Fortunately there is a solution

Using the ES6  imports & exports (You could use the old ES5 require, but here we'll use a more modern one)

<br/>

Just we need one script file to include in our html file and in that  javascript file we'll include all other features or codes from other files.

1st thing to do is making our file a module so we can use the ES6 features, and that it can be done with the `type`  attribute in script tag 

`<script type="module"  src="script.js"> </script>`

<br/>

and in your files you could export and import other function or anything like so 

![Export and import in ES6](https://drive.google.com/uc?id=1czBdL17umDuqpY4dFO-aFFJmhBwJbp_e)

<br/>

And that's it for the frontend


#### Backend aka Server


for the server is by the `package.json` file (created with the npm init), in that file add a type key and module as its value like this

![package.json file](https://drive.google.com/uc?id=18fQh1tBq531n2DUcCAepNlm6dTZt5acC)

<br />

Yeap That's very much it, you're all set up to use new ES6 feature and speed your development process

#Happy_coding
how to remove/change last pushed commit
Tags: github, git, githunt
Published: 2022-07-02 20:33:00

**Steps to remove/changes in last pushed commit**

1. Get the commit id on which you want to go

```
git log
```
2. Reset on that commit and this will unstage all the changes 

```
git reset <commit id>
```
3. Now do changes in unstaged files 
4. To push changes in branch, you have to force push this time
```
git push origin <branch name> -f
```
5. If you removed the commit, it also removed from server too.

That's how you can do changes even after doing commit
Thoughts of a junior software engineer on useEvent hook in react 18
Published: 2022-07-02 20:08:59

```A Hook to define an event handler with an always-stable function identity.```
The above line is from the description of the useEvent hook in the rfc released by React team - https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md

React team recently announced they are working on a new hook called useEvent, I am fascinated by the use case it solves in our application code -

1) to prevent unnecessary re-render of child components even though the function uses the latest values from the parent component. example - 

![simple code](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uhr928jb6zksvkvvhvw5.png)

in this code, on every user input change, the ChildComponent will re-render,this can easily be prevented with a useCallback with dependencies on text, but that would not be useful as in dependencies, we will use text, and it will still cause the child to re-render on every input change, here comes our saviour useEffect, so if we wrap the sendMessage function with this hook, the child won't re-render, and when called on click it will consume the latest state of text in the parent too, this is really useful as it removes the pain of finding the right dependencies to be added in the useCallback to improve optimisation, let's see what have we changed with useEvent -

![code with usehook](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p240x1941mbupekinc84.png) 


2) is not a replacement of useCallback hook 
The main difference I see between useEvent and useCallback is if the functions need to be called in child with the latest data at a later stage on change of event, we should use useEvent(whenever it is available in react offical release) otherwise when we want component's UI to be updated(or show calculated UI data) on change of a state in parent we should use useCallback.

The useEvent can solve the issue of revalidating too much of the useCallback but it doesn't solve every usecase and is discussed more on the [rfc](https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md#when-useevent-should-not-be-used) too.

But in the meanwhile, I wrote this article. In the current version of React, the useEvent hook is not available. So keep your eyes peeled for another update! Thank you for reading. I hope you like it. 👋🏼
Leetcode Solutions: Count Asterisks
Tags: logic, programming, leetcode, tutorial
Published: 2022-07-02 20:08:22

You are given a string s, where every two consecutive vertical bars '|' are grouped into a pair. In other words, the 1st and 2nd '|' make a pair, the 3rd and 4th '|' make a pair, and so forth.

Return the number of '*' in s, excluding the '*' between each pair of '|'.

Note that each '|' will belong to exactly one pair.

```py
class Solution(object):
    def countAsterisks(self, s):
        
        if not "*" in s:
            return 0
        
        stack = []
        count = 0
        
        for char in s:
            if char == "|":
                count += 1
            
            stack.append(char)
                
            if count == 2:
                while count:
                    el = stack.pop()
                    if el == "|":
                        count -= 1
                        
    
        return "".join(stack).count("*") 
    
    
    

```
Beginner to Advanced Challenge - project 3 (calculator app)
Tags: beginners, beginner2advanced, typescript, tutorial
Published: 2022-07-02 19:55:58

This is the third project in the beginner category in the `#beginner2advanced` challenge.

The link to the app requirement can be found [here](https://github.com/florinpop17/app-ideas/blob/master/Projects/1-Beginner/Calculator-App.md).

This project is an exact clone of this [repository](https://github.com/0xAndre/javascript-calc) just that I decided to rewrite it with Typescript. 

**NOTE**: This project is created using Typescript.

The end result of the application will look like this:

![calculator_app](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bavjq5uqnr4l4pcpfegg.gif) 

The link to the code can be found here: [https://github.com/zt4ff/app-ideas/tree/main/beginners/calculator-app](https://github.com/zt4ff/app-ideas/tree/main/beginners/calculator-app)

Please, drop a star on the repository so other people can find and join the challenge.

If you enjoy reading this article, you can support me by [buying me a coffee](https://www.buymeacoffee.com/kayode), please.
std::string C++20/23 Interface Novelties
Tags: cpp, programming
Published: 2022-07-02 16:27:14

Here's a small cheat sheet for 4 new member functions of std::string.

![cheat sheet showing new member functions of std::string introduced with C++20 and C++23: starts_with, ends_with, containts and resize_and_overwrite](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/icr1ou665mc5ud60c0ea.png)

[More Cheat Sheets](https://hackingcpp.com/cpp/cheat_sheets.html)


## Benefits

`resize_and_overwrite` avoids costly initialization of a string's memory buffer if you need to immediatly overwrite it with characters coming from e.g., a call to a C API.

```cpp
// BEFORE:
std::string s1;
s1.resize(1024);  // costly initialization
// write characters to string:
size_t sizeWritten = some_C_library(s1.data(), s1.size());

// AFTER:
std::string s2;
s2.resize_and_overwrite(1024, [](char* p, size_t n){
  size_t sizeWritten = some_C_library(p, n);
  return sizeWritten;
});

```


## Function Signatures and Overloads

```cpp
namespace std {
template <typename CharT, typename Traits, typename Allocator>
class basic_string {
  // ...
  bool contains (std::basic_string_view<CharT>);
  bool contains (CharT);
  bool contains (CharT const*);

  bool starts_with (std::basic_string_view<CharT>);
  bool starts_with (CharT);
  bool starts_with (CharT const*);

  bool ends_with (std::basic_string_view<CharT>); 
  bool ends_with (CharT); 
  bool ends_with (CharT const*);

  template <typename Operation>
  constexpr void resize_and_overwrite (size_type count, Operation op);
  // ...
};
}  // std
```
Isograms
Published: 2022-07-02 19:40:11

An isogram is a word that has no repeating letters, consecutive or non-consecutive. Implement a function that determines whether a string that contains only letters is an isogram. Assume the empty string is an isogram. Ignore letter case.

Example: (Input --> Output)

```
"Dermatoglyphics" --> true
"aba" --> false
"moOse" --> false (ignore letter case)
```

Solution- ###Python

```
def is_isogram(string):
    string = string.lower()
    return len(set(string)) == len(string)
```
New RDoc Page about strftime Formatting
Tags: ruby, documentation
Published: 2022-07-02 19:39:36

---
title: New RDoc Page about strftime Formatting
published: true
description: 
tags: ruby, documentation
---

I've written (with helpful reviewing by Peter Zhu) a new Ruby doc page about `strftime` formatting.  Its content will replace content for the methods in `Time`, `Date`, and `DateTime`, and will be linked from those.

It's [merged](https://docs.ruby-lang.org/en/master/strftime_formatting_rdoc.html) (but not yet released).