teleren/devto huggingface dataset:
Express JS pour les débutants
Tags: node, expres
Published: 2021-08-30 21:50:23

### Qu'est-ce qu'Express et l'écosystème Node JS?
Lorsqu'il s'agit de créer un serveur Web, aucun framework dans l'écosystème Node JS n'est aussi grand qu'ExpressJS. C'est un framework qui donne beaucoup de flexibilité en ce qui concerne la personnalisation. Si vous aimez les frameworks minimalistes, ExpressJS n'est pas la seule option que Node a à offrir, nous avons:
* Fastify
* Koa
Si vous recherchez un framework plus robuste de type Rails/Django/Laravel, Node est également là pour vous !
* NestJS
* Adonis JS
* Sails
* Loopback

### Premiers Pas avec Express JS
Je suppose que vous avez installé Node et NPM, ce que vous pouvez faire sur nodeJS.org
Pour commencer, créez simplement un dossier vide quelque part sur votre espace de travail et ouvrez le terminal dans ce dossier et procédez comme suit.
```
npm init -y
```
Cela créera un fichier package.json qui pour l'instant aura pour objectif principal de tracker nos librairies et nos scripts. Installons notre première librairie (package en anglais) en exécutant cette commande à partir de notre dossier.
```
npm i express nodemon
```
* Express : Notre framework web
* Nodemon : commande pour exécuter nos fichiers et surveiller nos fichiers afin qu'il réexécute notre serveur lorsqu'il y a des modifications de fichiers.
```
/node_modules
.env
```
Maintenant créons un fichier appelé server.js avec comme ce qui suit …
```
//importer notre librairie
const express = require("express")

//initialiser l'application express
const app = express()

//Le port du serveur
const PORT = process.env.PORT || 3000 


//Exécution de l'application Express sur le serveur Node
//Cette expression dois toujours se situee en bas
app.listen(PORT, () => {
    console.log(`Le serveur est active au port: ${PORT}`)
})
```
Après avoir enregistré les dernières modifications, on peut remarquerez que dans la console, nodemon redémarrera le serveur. Maintenant, testons-les !

Accédez une fois de plus à http://localhost:3000, on doit pouvoir voir "Hello World"

![happiness gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3mhubigosqsvwiwjmowa.gif)

Félicitations, on a notre première application Express JS
DhakaOnline24.com
Tags: newspaper, dhakaonline24, newsportal, banglanewsportal
Published: 2021-08-30 21:38:37

DhakaOnline24 is an online news platform that attempts to give its audiences across the country with accurate, objective, and real-time news. The online news platform started its journey on 30th June 2021 with the slogan "সবার আগে সত্যের সন্ধানে"

This website is unusual and unique from other online news portals since it employs 'multimedia' journalism, which includes audio, video, infographics, and web stories in addition to local and international news.

National news and news from each district are given special attention by DhakaOnline24. Politics, economics, international, sports, entertainment, education, information and technology, features, lifestyle, and columns are among the topics covered.

As Bangladesh's premier online news portal, it publishes news on entertainment, lifestyle, special reports, politics, economy, culture, education, information technology, health, sports, columns, and features 24/7.

DhakaOnline24, which is led by a group of young, motivated, and experienced journalists, focuses on the news' storytelling pattern to help readers grasp even the most complex subjects.banglanewsportal
Day 441 : Holiday
Tags: hiphop, code, coding, lifelongdev
Published: 2021-08-30 21:30:06

_liner notes_:
- Saturday : Spent the day working on my side project and getting ready for the radio show. This was the first show where I used my new laptop and the recording device on the radio show. Everything worked out during the show, but it took a little longer getting the radio show uploaded because of a little difference in the post broadcast workflow. The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of an animated image of OutKast sitting in a car with the words Aug 28th 2021 Horn Jazz](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h2u25lbx7rg2b0b582vg.jpg)

- Sunday : Did the https://untilit.works cyphers. Got some stuff done like laundry and the post radio show promo work. During the show, the recorded videos weren't being automatically added to the archives page. Spent most of the day working on trying to figure it out. I was able to get the videos manually through the dashboard I created. In fact, I was able to all the previous videos that weren't uploaded because the automated system wasn't completed yet. Hopefully it was just a glitch and everything will be back to normal for the next show. After that, I watched "The Walking Dead" and went to sleep.


- Professional : Today was a UK bank holiday so a lot of my team was off. Took the opportunity to finish up a blog post and refactor a demo I made. Pretty productive day.


- Personal : While I was getting the old https://untilit.works videos up on the archive page, I noticed that the function I created to get the AI generated details of the videos wasn't working. Not sure what is happening. It looks like it send the information successfully, but nothing comes back. I'll have to look into it further. I really need to get back to working on my current side project. Also spoke with some friends and I'll be chipping in on an office space. This is good because for my current side project and some of the things I want to get into, a space will be needed.

![A field of tall green grass with little white flowers in Skagit Valley, WA, United States at sunset with some trees in the distance](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8r4q17syp63dxnyxqayz.jpg)

Going to work on the broadcasting dashboard for my current side project. Yeah, that's pretty much my sole focus for this week. Really want to make some progress on this project. Especially if I want to launch it by November for a small test run. Going to eat dinner and watch an episode of "Boruto".

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube hs-qrq2r6WM %}
CockroachDB - creating limited key ranges
Published: 2021-08-30 20:28:57

In CockroachDB, when choosing keys for your tables' primary keys, the recommendation is to use UUID-based keys because they are globally unique and because they create non-sequential values (which help to "spread" the data into different ranges.)

Often, however, if you're migrating an application to CockroachDB from a different database where the old database schema was using int-based keys, it is often more palatable to keep the int-based keys to avoid application changes.

A nice compromise can be to keep the int-based types but move away from generating the IDs via sequences and instead use the unique_rowid() function to create unique values.  The advantage of doing this is that values generated in this manner are more spread out and help to avoid write hotspots.

In CockroachDB, you can create various integer-based values (https://www.cockroachlabs.com/docs/stable/int.html), but typically for id field, you would consider the ones with larger ranges:
- INT4 - four-byte integers with a range between -2^31 through 2^31 (around negative 2 billion to positive 2 billion)
- INT8 - eight-byte integers with a range between -2^63 through 2^63 (around negative 9 quintillion to positive 9 quintillion)

The unique_rowid() function produces INT8-based values.  And, since it is responsible for creating unique values, it needs to create large values.  You can easily imagine having a table in a system that has more than 4 billion records and would exceed the range of int4-based values.

This brings up another wrinkle which folks sometimes run into when migrating to CockroachDB.  Sometimes, while migrating, folks need to move from int4-based values (with id generation happening via sequences) to int8-based fields (with id generation happening via the unique_rowid() function).  When they do this, they can run into an interesting limitation in Javascript (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER) which is that values greater than 2^53 can become truncated.  You can work around this by passing the integer-based values as strings which allows them to keep their precision.  But, this may require a lot of code changes.

Here is a workaround that can be done at the DB-level which uses an int8-based field but makes sure that the values contained in the field are less than 2^53 so they can flow through the Javascript/JSON API levels with minimal impact:

```
create table modtest ( i8 int, i7 int8 as (mod(i8, 9007199254740991)) stored PRIMARY KEY ); -- this big number is the max int size in javascript
insert into modtest ( i8 ) values ( unique_rowid() );
root@:26257/test> select * from modtest;
          i8         |        i7
---------------------+-------------------
  682240290961522689 | 6700346855948364
```

Notice that the i7 field is the primary key and can be used as the value to uniquely identify the record through the levels of the system (API, etc.). The i8 field is in the table but is strictly used as a way to create values.
The Axios Cancel Token In React (Advanced React Made Simple)
Tags: react, reactnative, webdev
Published: 2021-08-30 19:38:29

Hey, React devs! So you're pretty comfortable with Hooks and components in React but can you write optimized code? In this article, I'm going to share with you a way to optimize Axios API calls in React.

###The Problem
![Mohmed Ishak](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9d3oevjrsnpdcqv5rx5r.PNG)

This is it. Image you're building a search bar with autosuggest feature or with feature that will immediately query for the relevant search results from the backend after every keystroke by the user. Now, for some reason, I'd like to search for "whale", and so I type "w", "h", followed by "a". By this time, the frontend would have made the API call to your server 3 times, which congests the server and makes your app slow. 

###The Solution
Is there any way to optimize it? Yes, thanks to Axios' cancel token feature. If only cancel token from Axios were implemented in previous scenario which I mentioned, every new request after every keystroke from the user will cancel the previous request(s) that were made to the server (provided that the request(s) have not been served), so only the latest request will get executed. What's the code behind it? 

You can check out a super small article from Axios' docs using the following link (https://axios-http.com/docs/cancellation) or just copy the code snippet below which I'm sure you'll understand by just looking at it.

```javascript
const CancelToken = axios.CancelToken;
const source = CancelToken.source();

axios.get('/user/12345', {
  cancelToken: source.token
}).catch(function (thrown) {
  if (axios.isCancel(thrown)) {
    console.log('Request canceled', thrown.message);
  } else {
    // handle error
  }
});

axios.post('/user/12345', {
  name: 'new name'
}, {
  cancelToken: source.token
})

// cancel the request (the message parameter is optional)
source.cancel('Operation canceled by the user.');
```
<a href="https://www.buymeacoffee.com/mohmedishak" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" height="41" width="174"></a>
NestJS #1 : มาทำความรู้จักกับ NestJS กัน
Tags: npm, nestjs, node, nodejsframeworks
Published: 2021-08-30 20:20:55

   บทความนี้เราจะมาทำความรู้จัก NestJS เบื้องต้นกัน ซึ่งเป็น Node.js Framework ที่ใช้สร้างเว็บไซต์ในฝั่ง backend ที่มีประสิทธิภาพ และมี library ที่จำเป็นเตรียมไว้ให้อย่างครบครัน NestJS รองรับการเขียนโดยใช้ภาษา TypeScript (แต่ก็สามารถเขียนด้วย Javascriptได้) จึงใช้ความสารถของ TypeScript ได้เต็มที่ในการเขียนแบบ OOP (Object Oriented Programming), FP (Functional Programming), and FRP (Functional Reactive Programming)

   NestJS ทำงานโดยมี Express อยู่เบื่องหลังเป็น default แต่ก็ยังสามารถ configured ไปใช้ Fastify ได้

**ขั้นตอนการใช้งาน**

**1.ทำการติดตั้ง NodeJs**
  ก่อนที่เราจะใช้งาน NestJS ได้ต้องทำการติดตั้ง [NodeJs](https://nodejs.org/en/download/) ก่อน ซึ่งตัว NodeJs ก็คือ Runtime ของ javaScript ที่ทำให้ javaScript ทำงานนอก Web Browser ได้

**2.ติดตั้ง VSCode**
[VSCode](https://code.visualstudio.com/Download) เป็นโปรแกรม Editor ยอดนิยมของสาย Dev พัฒนาขึ้นโดยบริษัทไมโครซอฟต์ มีเครื่องมือเสริม(Extension) เจ๋งๆไว้ให้ใช้งานมากมาย ที่สำคัญคือ**ฟรี**

**3.ติดตั้ง NestJS CLI**
`npm install -g @nestjs/cli`
เป็นการติดตั้ง Command Line Interface (CLI) เพื่อเรียกใช้งานคำสั่งต่างๆ ของ NestJS

**4.การสร้างโปรเจค**
`nest new project-name`
จะเป็นคำสั่งในการสร้างโปรเจคขึ้นมาใหม่

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m79to9kitvenmqfwakg0.png)
หลังจากที่เราใช้คำสั่ง `npm install -g @nestjs/cli` แล้วจะให้เราเลือกตัวจัดการ package โดยที่ npm เป็นตัวจัดการ package เริ่มต้นที่ติดตั้งมากับ Node.js ส่วน yarn เป็นตัวจัดการ package ที่พัฒนาโดย Facebook  ปัจจุบันประสิทธิภาพของสองตัวนี้ไม่ค่อยต่างกันเท่าไหร่ ให้เราเลือกตัวไหนก็ได้

**5.โครงสร้างของ NestJS**
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/i14dpea5f2bgh21ucezm.png)
**ไฟล์ main:** จุดเริ่มต้นการทำงานของNestJS 
**ไฟล์ module:** เป็นไฟล์ที่ควบคลุม Controller และ Service หรือเอา Module อื่นมาใช้งานร่วมกันได้
**ไฟล์ controller:** ทำหน้าที่ในการจัดการ requests และ responses 
**ไฟล์ service:** เป็นไฟล์ที่ไว้เขียน function การทำงานต่างๆ
**ไฟล์ spec:** ไฟล์สำหรับทำ testing

บทความนี้เราได้ทำความรู้จักกับ NestJS เบื้องต้นไปแล้ว บทความต่อไปเราจะมาเริ่มเขียน api แบบง่ายๆกัน
Sentinel Linear Search
Tags: python, programming, algorithms
Published: 2021-08-30 19:09:07

```python
# sentinel_linear_search.py
#   This program uses a linear search of an array of size n for
#   value x but unlike its predecessor linear_search.py it utilizes
#   a sentinel value in the arrays last index as a placeholder
#   ensuring that only one check takes place becuase you will not be
#   checkinf for the array length, just the search term x
#   This algorithm is more efficient than either linear_search.py or
#   better_linear_search.py.
# by: Scott Gordon

things = ["bike", "house", "cat", "computer", "hammer"]


def linear_search(array, n, x):
    last = array[n-1]
    array[n-1] = x
    i = 1
    while array[i] != x:
        i += 1
    array[n-1] = last
    if (i < n-1) or (array[n-1] == x): 
        return i
    else:
        return "Not found!"


print(linear_search(things, 5, "cat"))  # prints the index of "cat" which is 2
# prints the index of "hammer" which is 4
print(linear_search(things, 5, "hammer"))
print(linear_search(things, 5, "pasta"))  # prints Not found
print(linear_search(things, 5, "junk"))  # prints Not found
```
Shopify theme and Webpack code-splitting
Tags: shopify, theme, webpack, codesplitting
Published: 2021-08-30 14:08:23

---
title: Shopify theme and Webpack code-splitting
published: true
description: Do you use build tools for your Shopify theme and trying to find a solution to remedy lighthouse asking you to remove unused Javascript?
tags: Shopify, Theme, Webpack, codesplitting
//cover_image: https://direct_url_to_image.jpg
---

In this post, I want to share how to leverage code splitting for your Shopify theme. There is a minor issue to implement it as you would typically do in a Webpack project which I will share a solution for it. 

## What is code-splitting, and why you may want to do it?

If you don't know what code-splitting is, then, in short, it is a way to deliver the least amount of JS to the browser on page load and let the loaded JS decide when to download the other parts of the code. It makes your website faster to load fists, but the user pays the cost of downloads later in the journey.

## How is it done with Webpack?

Basically, all bundling tools are capable of code splitting. You can see a report about it here: https://bundlers.tooling.report/code-splitting/

With Webpack there are multiple ways to achieve code-splitting, for the sake of an example you may split lodash like so: 

```js
import('lodash').then(({ default: _ }) => {...})
```
To read more, start here: https://webpack.js.org/guides/code-splitting/#dynamic-imports

After building, you will get two bundled JS files: 
- index.bundle.js
- vendors-node_modules_lodash_lodash_js.bundle.js

You only include `index.bundle.js` into your Shopify theme. For example, in the `head` of `/layouts/theme.liquid` and then the inde.bundle.js will load the other bundles (if needed) afterwards.

```liquid
<script src="{{ 'index.bundle.js' | asset_url }}" defer></script>
```

## The problem

The problem is Shopify serves your theme assets from a CDN that has a different domain. Also, the URL structure is not what Webpack would figure out by itself. Assuming your shop URL is `myshop.com`, you may see your `index.bundle.js` is loading from `https://cdn.shopify.com/s/files/1/1844/8937/t/273/assets/index.bundle.js`

## A Solution

Webpack provides an option to define the publicPath [on the fly](https://webpack.js.org/guides/public-path/#on-the-fly). We can specify the path in the first line of our JS src like this: 

```js
// keep this before your imports
__webpack_public_path__ = window.assetsPath;
```
And the value of the `assetsPath` can be assigned in your `/layouts/theme.liquid` file.

```liquid
<script type="application/javascript">
  window.assetsPath = "{{ 'index.bundle.js' | asset_url }}".split("index.bundle.js")[0]
</script>
<script src="{{ 'index.bundle.js' | asset_url }}" defer>
```
And there you have it, code-splitting in your Shopify theme to improve your speed scores and make your client happier.

Cheers!
Resolviendo el error de degit en la instalación de create-astro
Tags: astro, javascript, bash, spanish
Published: 2021-08-30 19:00:55

Si algún día pruebas [Astro](https://astro.build/) es posible que tengas el siguiente error en la instalación:
```bash
franqsanz@Franco/mnt/c/Users/franc/Desktop/random-books npm init astro
npx: installed 18 in 10.622s

Welcome to Astro! (create-astro v0.6.0)
If you encounter a problem, visit https://github.com/snowpackjs/astro/issues to search or file a new issue.

> Prepare for liftoff.
> Gathering mission details...
✔ Which app template would you like to use? › Starter Kit (Generic)
✔ Which frameworks would you like to use? › Preact, React, Solid, Svelte, Vue
> Copying project files...
zlib: unexpected end of file
```
Este error:
```bash
zlib: unexpected end of file
```
Si es que todavía no fue resuelto por el equipo de Astro (es muy probable que esté resuelto en el futuro).

## Solución

Sólo debes eliminar la carpeta `.degit` de la siguiente forma:
```bash
rm -rf ~/.degit/github/snowpackjs
```
Y luego volver a probar la instalación y esto es todo!

`degit` es lento en `create-astro`, así que debes tener paciencia.


[Aquí un hilo en github sobre el problema](https://github.com/snowpackjs/astro/issues/655)

¡Saludos!
Why isn't your resume getting results, no matter how many times you apply? [VIDEO]
Tags: resume, career, jobs, codenewbie
Published: 2021-08-30 18:24:06

When it comes to what developers can include on their resume, and what they could potentially learn next to improve their chances of success in a job search - it may seem like there are an infinite number of possibilities. 

Is your resume missing something that's been deemed important by the hiring manager? Or, did you simply try to get a little creative with your resume format?

That is all that it takes for The ATS (or Applicant Tracking System) to reject you, every single time. 

How do you figure out what you're doing wrong and if you need to add something or change something crucial about your resume? 

##A little research can kick start your job search. 
  
  
{% youtube 17t1Mfwv1OY %}

Before adding more tools to your dev toolbox or hiring a UX designer to take a look at your resume, you should know that you’re much better off putting your focus on figuring out what companies are actually saying they're looking for in job listings. 

If you're looking for a new dev job, the next thing you need to do is perform a Job Market Analysis. 

READ MORE: [The ATS Resume Check For Software Engineers - Beat The System & Get Interviews
](https://codingcareerfastlane.com/ats-resume-check/)
MongoDb Vs Sql
Tags: mongodb, sql, database
Published: 2021-08-30 18:20:42

### Author @naitik_pitroda 

##### #Explaining in very simple language to beginner's.

To understand this database languages. Let me give two pics which can clear your vision.


## SQL
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vuaglcx5wncl3zs2o7pz.jpg)
Show's SQl database(structured data Eg:1)
- It's very easy to find data when it's structured & organized in a good manner, which we can see in SQL. It's quiet tough to find data in a unstructured manner. We can easily find out book in this room.
 
- In SQL databases, data is stored in form of traditional 2 dimensional row-column structure
- Relational database:  E.g. EmployeeID column which would be a primary key of Employee table would be present as a foreign key in the Payments table, thus connecting the two tables with the referential property. This relationship ensures that there is no payment entry of an employee whose details are not present in the master Employee table. This is why SQL databases like MySQL are also called relational databases. 

- The architecture of SQL databases like MySQL is governed by the principles of ACID property.

ACID stands for Atomicity, Consistency, Isolation, and Durability. These properties focus on the consistency and reliability of the transaction done in the database.

<hr>


## MongoDb

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o91u25w3xbe5s4l8yvs2.jpg) 
Show's MongoDB database(unstructured data Eg:2) 

- It's difficult to find data when it's unstructured & improper, . It's quiet tough to find data in a unstructured manner. Like finding book in this pic.
- In MongoDB rich data document model is followed, which allows storage of any type of data and fast working.
- On the other hand, in MongoDB, we cannot establish such a relationship between the unstructured data of the collections. Hence it is considered as a non-relational database
- MongoDB is built on the principles of CAP Theorem which focuses on Consistency, Availability, and Partition. Unlike the ACID properties of SQL databases, CAP theorem focuses on availability of data in the case of MongoDB.

<hr>

### Personally, suggested to start with SQl then create some basic projects using it. Afterwards move to MongoDb for advance level and for full stack development. SQL is easy to learn and code compare to MongoDb. Begineer's should start with SQl.
<hr>


#### -Atlast what every you learn you have to Implement it according to large or small scale projects requirement's.
My Web Developer internship experience with LetsGrowMore Community
Tags: webdeveloperinternship
Published: 2021-08-30 18:43:06

Hello everyone,
Hope you all are doing extremely well
I am glad to share that I have successfully completed my web development internship at LetsGrowMore Community under their Virtual Internship Program.
I am thankful to Aman Kesarwani and Letsgrowmore Community for giving me this wonderful opportunity to learn and enhance my skills. It was a great learning experience full of ups and downs, but everything at the end just paid off! LetsGrowMore Community has provided amazing resources which helped me a lot to get all my web development concepts clear. This community is very helpful and helped me a lot in my web development journey.
I assure you as the name suggest it will help you to grow more in your career! I highly recommend you to please check out their site once and the links are:-  
https://letsgrowmore.in/
https://letsgrowmore.in/vip/

#experiencesharing #webdevelopment #internship #oppportunity #letsgrowmore