teleren/devto huggingface dataset:
Stop using JavaScript for everything!
Tags: javascript, webdev, programming, tutorial
Published: 2023-08-11 16:50:35

In the world of web development, JavaScript has become the go-to language for building interactive and dynamic applications. It can also be run in the backend, it can be used for desktop applications, mobile applications, multipurpose programming and even Machine learning. However, the trend of using JavaScript for everything might not always be the best approach.

## The JavaScript Craze

JavaScript's versatility and browser compatibility have made it an indispensable tool for creating modern web applications. From front-end interactivity to server-side logic, JavaScript has expanded its reach. The thing I hate about JavaScript is that it is somehow being used for stuffs that we shouldn't using (like Machine learning with JavaScript?).

## The Downsides

While JavaScript offers numerous advantages, relying on it exclusively can lead to certain downsides:

### Performance Overhead

Using JavaScript for complex tasks can lead to performance bottlenecks, especially on resource-constrained devices and slower networks. JavaScript is an interpreted language, which means that the code is executed line by line at runtime. This can lead to slower execution compared to compiled languages, as each line of code needs to be interpreted before it is executed.

### Maintenance Complexity

As projects grow, JavaScript codebases can become hard to maintain and debug, increasing development time and costs. Maintenance complexity in JavaScript refers to the challenges developers face when managing and updating code over time. Due to JavaScript's dynamic nature, lack of strict typing, varying browser environments, and its inconsistency, maintaining JavaScript code can become complex. 

### Memory inefficient

One of the major drawbacks of JavaScript is its memory inefficiency. JavaScript can be memory inefficient due to factors like memory leaks, unnecessary object retention, and improper handling of large data sets.

## Conclusion

JavaScript remains a powerful tool, but it's essential to use it 
judiciously. I love JavaScript but the enthusiasm to use it 
everywhere is mindboggling. Other languages exists for a reason. You don't have to use JavaScript for everything. Most of the newcomers in tech end up only learning JavaScript.


What are your thoughts on the JavaScript-first approach? Share your opinions in the comments below.
How to Read Scientific Papers from arxiv.org on Kobo E-Readers
Tags: kobo, ebook, research, arxiv
Published: 2023-08-11 16:49:56

Reading scientific papers on arxiv.org directly from your Kobo E-Reader without needing a USB connection sounds like a dream, right? This guide will walk you through the process, step-by-step.

## The Challenge with PDFs

Many scientific papers on arxiv.org are in PDF format. Directly saving these PDFs to Pocket means they won't appear on your Kobo E-Reader at all. Thus, to ensure the content is accessible and optimized for reading, we need a different approach.

## Step-by-step Guide:

### 1. Set Up a Pocket Account on Your Kobo E-Reader

*Turn on your Kobo E-Reader.*
- Tap the `More` option, usually represented by three dots (`...`).
- Navigate to `Settings`.
- Scroll and find the `Accounts` section.
- Choose `Pocket`, then `Sign in or create an account`.
- Follow the prompts to set up an account. Remember, the Firefox login option won't work here.

### 2. Access Your Pocket Account on a Computer or Mobile Device

- Go to [Pocket’s website](https://getpocket.com/).
- Use the credentials you set up on your Kobo to log in.

### 3. Install the Pocket Browser Extension

- Head to your browser's extensions or add-ons marketplace.
- Search for and install the `Pocket` extension.
- Once installed, you'll gain the ability to add pages to Pocket via the browser's context menu (right-click).

### 4. Make the arxiv PDF Reader-Friendly

- Go to the arxiv page of your desired paper.
- In the URL, change the "x" in "arxiv" to "5".  
  *For example:*  
  Original URL: `https://arxiv.org/abs/1706.03762`  
  Modified URL: `https://ar5iv.org/abs/1706.03762`
  
- This change converts the PDF into a responsive webpage, optimized for e-readers.

### 5. Store the Converted Page in Pocket

- Right-click on the page.
- Select the `Save to Pocket` option from the context menu.

### 6. Access and Read the Paper on Your Kobo E-Reader

- On your Kobo E-Reader, from the home screen, tap the `More` tab on the right.
- Tap `My Titles` (next to the Pocket logo. You should now see a list of all articles you've saved, including the recently added paper.
- Tap on the desired paper to read it in a format optimized for the Kobo.

## Conclusion

By utilizing ar5iv's rendering tool and the Pocket extension, you can enjoy a seamless experience reading scientific papers from arxiv.org on your Kobo E-Reader. This method bypasses the need for USB transfers, making the entire process wireless and hassle-free.
Can you help me? I made a extension but it's not working.
Published: 2023-08-11 16:49:14

Basically, i wanted to make a extension which can extract text from pdf and text from images and give prompts to ChatGPT but it's not working. Here i have attached my folder https://www.dropbox.com/scl/fo/g8xp2rxoukkzpbpfd6g1u/h?rlkey=jkrk4rdpkcj8ietpqqnxv7ifx&dl=0
Work Smarter This August: 7 Free AI Tools to Boost Your Efficiency
Tags: productivity, ai, tools, webdev
Published: 2023-08-11 16:43:45

Here are 7 free AI-powered tools you can use right now to work smarter and take your ideas further.

## 1. [Runway](https://runwayml.com/)

Runway is an applied AI research company shaping the next era of art, entertainment, and human creativity. 

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

## 2. [Claude](https://claude.ai/chats)

Meet Claude, an AI assistant that can generate content, answer questions, automate workflows, and serve as your personal productivity sidekick.

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

## 3. [Clockwise](https://www.getclockwise.com/)

Clockwise is AI assistant that looks at your schedule, responsibilities, and work patterns to create an optimal calendar tailored to your unique workflow.

![Clockwise](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7237bcl4gyl5rqqpsnvc.gif)

## 4. [Beautiful AI](https://www.beautiful.ai/)

Elevate your presentations with Beautiful.ai, AI-powered tool that makes creating stunning slides a breeze. 

![Beautiful AI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qtwlcet6sddb2k7xvlnh.gif)

## 5. [BlueWillow](https://www.bluewillow.ai/)

BlueWillow creates beautiful, one-of-a-kind images from text prompts. 

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


## 6. [Bard](https://bard.google.com/)

Bard helps you supercharge your imagination, boost your productivity, and bring your ideas to life. 


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


## 7. [Bing AI](https://www.bing.com/?/ai)

Unlike traditional search engines that simply provide links, Bing AI gives you rich, comprehensive answers and recommendations to help you get things done.

![Bing AI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b1z4tgnsrknwtooohszw.gif)
Exploring the Chat GPT-A -Complete Guide
Published: 2023-08-11 16:29:49


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ai7dfx0vurctbkrwo6ez.jpg)
Chat GPT is an advanced language model developed by OpenAI. It is part of the GPT-3.5 architecture, a powerful version of Generative Pre-trained Transformer. Utilizing cutting-edge artificial intelligence technology, Chat GPT can understand and generate human-like text, making it an excellent tool for a wide range of applications.
ChatGPT (Chat Generative Pre-Trained Transformer) is a large language model-based chatbot developed by OpenAI and launched on November 30, 2022, notable for enabling users to refine and steer a conversation towards a desired length, format, style, level of detail, and language used. Successive prompts and replies, known as prompt engineering, are taken into account at each stage of the conversation as a context.
ChatGPT is the internet’s shiny new toy. It’s also a potential shortcut for students to quickly generate essays and other writing assignments — which has many educators rethinking their assignment designs.
(For some, that means trying to AI-proof their writing assignments; for others, it may mean teaching students how to use a text-generating AI conscientiously as a writing tool.)
Virtual Reality and Augmented Reality: A Deep Dive into Their Transformative Impact
Tags: virtualreality, augmentedreality
Published: 2023-08-11 16:26:24

In the realm of technology, few innovations have captured the imagination and potential of humanity quite like Virtual Reality (VR) and Augmented Reality (AR). These twin marvels, born from the creative fusion of science and imagination, have significantly altered the way we interact with the digital and physical worlds. In this comprehensive discourse, we embark on an extensive journey, unearthing the intricate layers and boundless possibilities of VR and AR technologies. From their historical roots to their contemporary applications and future potential, we leave no stone unturned.

[Read More..](https://amlogy.com/virtual-reality-and-augmented-reality-a-deep-dive-into-their-transformative-impact/)
AI
Tags: beginners, tutorial, devops, ai
Published: 2023-08-11 16:23:43

Excited to have attended the 'Generate AI' workshop! 🚀 Learned about cutting-edge AI technologies and how they're shaping the future. Key takeaways included understanding the fundamentals of machine learning, exploring neural networks, and discovering the real-world applications of AI, such as Text, image recognition and natural language processing. Looking forward to applying these insights in my journey to contribute to the exciting world of AI! 


#AI #WorkshopLearning #AIEnthusiast
#UTC #TensorFlow #DeepLearning #MachineLearning
#TechWorkshop
How To Correctly Handle Errors In React With Error Boundary
Tags: webdev, react, frontend
Published: 2023-08-11 16:18:43

Hello fellow developers 🙋‍♂️,

Learn seamless error handling with my blog: ["How To Correctly Handle Errors In React With Error Boundary."](https://gaurav-shrivastava.hashnode.dev/how-to-correctly-handle-errors-in-react-with-error-boundary) 


Happy coding! 🚀💻
7 vs code extension for web developers
Tags: typescript, webd, vscode, javascript
Published: 2023-08-11 16:14:09

#### Here are the list of 7 vs code extension that will be very useful for your development

## 1. ES7+ React/Redux/React-Native snippets
If you are a react developer than it is the most needed extension 


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

## 2 . FontSize Shortcuts
This is also one of the most useful extension for zooming your code when you hit ```Ctrl + ``` the whole code gets zoom so this extension solves that pain.

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


## 3. Console Ninja
if you are struggling with debugging your code code of in browser console then this extension is great for you and helps in catching the errors inside vs code no need to depend that much in browser for console option.

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


## 4 . Error Lens
when working with the project we often get error we can't decide what the actual error or data type what it is demanding ,so this extension solves the error and show error message which helps to solves the error quickly.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ykpd8s6o2xxfc1p5d4gd.png)

5 . JavaScript and TypeScript Nightly
This is the most required extension for boosting your typescript skills and it provides the typescript  IntelliSense.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o97o26fu374d4ymdsand.png)

## 6. Prettier - Code formatter
Obviously i can't stop taking about , i think every people have this extension if not then i helps to format your code which makes clean.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/km67dw7w10oqzekx4w4v.png)

## 7 . TODO Highlight 
As a developer you might have different tasks to work on some times you might forget what you need to do so this extension helps you to make the Todo 
suppose you need add features you could do using TODO: // working on progress api integration so this type of features are provided by this extension
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ps6vstu1b9tzhy4wcxkr.png)

### Any others things that i missed ? let make know
Making a chatbot in PictoBlox
Tags: pictoblox, ai, programming, chatbot
Published: 2023-08-11 16:07:49

<h2> Walkthrough for making a chatbot in PictoBlox </h2>

<p> In this tutorial, we will make a chatbot in PictoBlox. We will use conditional statements to make the chatbot respond to the user's input. </p>

<h3> Getting Started </h3>

<p> First, download and install PictoBlox from <a href="https://thestempedia.com/product/pictoblox/download-pictoblox/">here</a>. </p>

<p> Launch PictoBlox and choose the <b> Block Coding </b> mode. </p>


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


<p> Now, let's start making the chatbot! </p>

<h3> Making the chatbot </h3>

<p> First, let's make the chatbot greet the user. </p>

<p> Drag and drop the <b> when flag clicked </b> block from the Events palette. </p>

<p> Next, drag and drop the <b> say </b> block from the Looks palette, write <b> Hello! I'm your chatbot. How can I assist you today? </b> in the text field and place it under the <b> when flag clicked </b> block. </p>


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


<p> Now, let's make the chatbot respond to the user's input. </p>

<p> Drag and drop an <b> ask and wait </b> block from the Sensing palette into the "forever" block. This block will allow the user to input their message. </p>

<p> Enter the question: "How can I help you today?"</p>

<p> Drag and drop an "if" block from the Control palette below the "ask and wait" block.</p>

<p>Drag and drop a "contains?" block from the Operators palette into the condition slot of the "if" block.</p>

<p>Place the "answer" block from the Sensing palette into the first slot of the "contains?" block.</p>

<p>Enter the keyword "symptoms" in the second slot of the "contains?" block.</p>

<p><b>(You can add the name of the symptoms like "fever", "cough", etc. in the "say" block.)</b></p>


<p>Drag and drop a "say" block from the Looks palette inside the "if" block. </p>



<p>Add the say block for the chatbot to send the details of the symptoms and treatments.</p>

<p>You can add more "if" blocks for the chatbot to respond to more keywords.</p>

<p> Now, To make the chatbot say goodbye to the user. </p>

<p> Drag and drop the <b> say </b> block from the Looks palette, write <b> Goodbye! </b> in the text field and place it under the <b> if </b> block. </p>

Final Look:


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



<h4> That's it! We have successfully made a chatbot using conditional statements in PictoBlox! </h4>

<p> You can also refer to this related tutorial: <a href="https://ai.thestempedia.com/project/make-your-own-smart-ai-chatbot-using-speech-recognition/">Make a Chatbot using PictoBlox using Speech Recognition</a> </p>
Ng-News 23/31: SSR Vulnerability, Q&A Session, RFC ended
Tags: webdev, javascript, programming, angular
Published: 2023-08-11 15:48:25

A vulnerability in Angular Universal (SSR) was detected. The RFC for the control flow syntax and deferred loading ended. The Q&A session had a comeback and new content from Dmytro Mezhenskyi and Thomas Laforge.

{% embed https://youtu.be/3eWFA8Boc2M %}

## SSR Vulnerability

We start with a vulnerability announcement. If you SSR in Angular 16.1.0 or 16.1.1, then please upgrade to 16.1.2. Angular Universal depends on the library Critters, which is open to cross-site scripting attacks.


{% embed https://blog.angular.io/notice-of-xss-issue-affecting-angular-universal-16-1-0-16-1-1-95dbae068f %}

## Closed RFC

The RFC about deferred loading and the control flow syntax in the template ended. There were more than 600 comments, and they had an impact. The Angular team must now decide with which syntax they want to go. The choice is between an at Symbol or the single brace with a hash.


 https://github.com/angular/angular/discussions/51241

## Template Challenges

Alex Rickabaugh, Angular framework lead, provided some insider information. He listed challenges the Angular team sees in the area of the template.


For example, one was the necessity to import a component two times. Another was about possibilities to improve content projection.

https://www.reddit.com/r/Angular2/comments/15enffo/comment/jue6dlv/ 

## Angular Q&A

After a two months break, the Angular Q&A stream took place. Mark and Jeremy from the Angular team were the hosts.


There were quite a lot of questions, mainly centring around Signals.


To summarise, there wasn't new information, except for one thing: The Angular team is thinking about improving asynchrony with Signals.


{% embed https://www.youtube.com/live/OFQ8ym_AQd0?feature=share %}

## Directive Composition API


Dmytro Mezhenskyi published a new video on the channel Decoded Frontend. It was about the Composition API we have had since Angular 15.

{% embed https://www.youtube.com/watch?v=tpSwvVYViRI %}

## share/shareReplay

Thomas Laforge published an article about the differences between the RxJs operators share and shareReplace.

Thomas is also the author of the Angular Challenges. That's a collection of different exercises. Definitely check them out.


{% embed https://dev.to/this-is-angular/share-sharereplay-refcount-331j %}
SOLID: writing better interfaces
Tags: php, beginners, programming
Published: 2023-08-11 15:01:29

The Interface Segregation principle (the "I" in SOLID) can be tough to understand at the beginning.

## Interfaces in theory

You may declare the following interface, but it would not make sense:

```PHP
interface VehiculeInterface {
    public function roll(): void;
    public function fly(): void;
}
```

Why?

Because you'd have entire classes of vehicules that cannot implement all behaviors but only some of them.

It's better to write two interfaces in this case, and your vehicules may still implement both interfaces:


```PHP
interface RollingVehiculeInterface {
    public function roll(): void;
}
interface FlyingVehiculeInterface {
    public function fly(): void;
}
```

## Interfaces in practice

Most PHP frameworks follow such principle, but you get handy feature like autowire and automatic injection, so you only have to typehint:

```PHP
use Psr\Log\LoggerInterface;

class MyClass
{
    public function __construct(
        private LoggerInterface $logger,
    ) {
    }
}
```

or even:

```PHP
use Psr\Log\LoggerInterface;

class MyClass
{
     public function index(LoggerInterface $logger) {}
}
```

## What is "interface pollution"?

It's sometimes hard to resist the temptation to add methods to an existing interface.

However, it usually impacts maintenance negatively.

You can see the problem from different perspectives, but it's the same idea:

* interfaces should not have multiple responsibilities
* "Clients should not be forced to depend upon interfaces that they do not use" [Uncle Bob]

## Why do we need that approach?

It's because interfaces allows implementing behaviors: different behaviors, different interfaces.

The ultimate goal is to prevent bad side effects, which is way easier to achieve when you split the code into simple/small/single parts.
Decoding Commercetools Integration: A Peek Behind the Scenes
Tags: headlesscommerce, commercetools, api
Published: 2023-08-14 10:04:40

---
title: Decoding Commercetools Integration: A Peek Behind the Scenes
published: true
date: 2023-08-11 15:06:26 UTC
tags: headlesscommerce, commercetools, api
canonical_url: 
---

![](https://cdn-images-1.medium.com/max/800/1*BHhlMlxp66LarqFycyCdGA.jpeg)

This week Voucherify announced the commercetools connector. Integrating with another MACH tool gave us a unique chance to assess our product. By using APIs for a concrete use case, we could explore two POVs:  
👉 What we can learn from [MACH Alliance](https://www.linkedin.com/company/machalliance/) founders & leaders  
👉 Is our API as dev-friendly as we want it to be?

Re 1) I talked to our devs about what they like about CT API. Among other things, the API Extension model was praised as “webhooks on steroids’’. Unlike webhooks, the synchronous and time-sensitive nature of API Extension makes it more predictable to work with (and boy we have been struggling with some pain-in-the-neck webhook mechanisms for some time).

The flexibility of this model and the requests chaining policy are also well thought of. You can do pretty much everything with an active order and pass all the relevant info further to subsequent call-outs.

commercetools API has some learning curve for sure, but once you grasp the basics and install the SDK you don’t need docs on the side to understand what’s in the “cart” and other objects passed with a request. When you add to it a CLI task that registers a local ngrok instance as a target endpoint for API Extensions, you — as [Michał Moczulski](https://www.linkedin.com/in/ACoAAAx6gBYBQFbJ3d11D-MOtHfY5AD-jtDP0B4) puts it — “forget you’re working with external SaaS.”

Hats off to [Kelly Goetsch](https://www.linkedin.com/in/ACoAAABIk90BajMmOMdE1FcLgzdxuG_mXl3CM0Q) and the team 👌

Re 2) The connector highlighted some gaps in our docs and SDKs. One thing that was clearly missing are sequence diagrams showing the order of API calls (like this one 👇)

![](https://cdn-images-1.medium.com/max/1024/1*9o8-QAffvMd85SSCUva19g.jpeg)

BTW I learned about mermaid ([https://mermaid.js.org/#/](https://mermaid.js.org/#/)) which gives you grammar for building diagrams in your editor (and github can render it right away). Cool thing for automating product marketing too.

As for the connector itself, it’s open source so you can see how we implemented a few unique discounting features such as applying many promo codes/gift cards/etc at the same time.

But our integration team ([Marcin Ślęzak](https://www.linkedin.com/in/ACoAAAuaYA4BCGSn2pyuKM_bKUO7Oq1aZFUdsVE), [Tomasz Łochmańczyk](https://www.linkedin.com/in/ACoAAC7AKPcB-nlUqKeVIt0vLm3FwDoifxIz2to), [Michał Moczulski](https://www.linkedin.com/in/ACoAAAx6gBYBQFbJ3d11D-MOtHfY5AD-jtDP0B4)) is pushing new features. If you want to stay updated, star ⭐️ the repo on Github or join our Slack channel.

Links:   
[https://github.com/voucherifyio/commerce-tools-integration](https://github.com/voucherifyio/commerce-tools-integration)  
[https://community.voucherify.io/](https://community.voucherify.io/)
Looking for the best Online Food Ordering System?
Tags: onlinefoodorderingsystem, onlinefooddeliveryscript, onlinefoodorderingscript, onlinefoodorderingsoftware
Published: 2023-08-11 14:55:15

Then, download **[Foodzat app](https://www.bugtreat.com/foodzat-online-food-delivery-script)** right now!

Foodzat app is the best [food for takeout & delivery software](https://www.bugtreat.com/foodzat-online-food-delivery-script) that is ideal for Restaurants, Home Chefs, Fast Food and Caterers where the customers can make easy order placement with the flexible payout options.

For more details, please contact support@bugtreat.com