teleren/devto huggingface dataset:
Ng-News: Issue 22/10
Tags: angular, javascript, programming, webdev
Published: 2022-03-14 12:56:09

This is a weekly posting, covering the latest updates from the Angular community.

{% youtube t8JEbaVkpiI %}

## ECMAScript proposal for types

TypeScript published an ECMAScript proposal to add types. ECMAScript is the name of the JavaScript standard.

This means we could add types in JavaScript as we do with TypeScript, but it doesn't make JavaScript a statically typed language. Instead, the engine, which executes JavaScript, would simply ignore these types, and we still need to run the type checks inside of our IDE or CI.

So what's the benefit?

We don't need to compile anymore. Compiling TypeScript to JavaScript is nothing more than removing the type information. In addition, the compiler requires a building tool you need to configure, etc. That all would go away. 

The proposal is in stage 0, so we are still at the very beginning.

https://github.com/giltayar/proposal-types-as-comments/

## Angular Twitter Space

Angular did their first Twitter Space. Emma, Mark, and Minko represented the Angular team.

Participants could ask their questions only via audio and not by chat message, as typical with similar formats. That gave the whole session a more personal touch. Since it was the premiere, it was not recorded.

One noteworthy point was about the successor for Protractor. Although Angular doesn't nominate an official replacement, there exists a cooperation between E2E frameworks and the Angular team, if these frameworks fulfill certain requirements.

The command `ng e2e` lists them and their schematics.

## Miscellaneous

### Release Candidate Angular 13.3

We have a first release candidate for Angular 13.3. 

https://github.com/angular/angular/releases/tag/13.3.0-rc.0

### Future of Micro-Frontends

"The Future of Micro-Frontends" is an article from Luca Mezzalira where he discusses the topic from different perspectives.

It is not specific for Angular but more general.

https://medium.com/better-programming/the-future-of-micro-frontends-2f527f97d506

### Use Angular directives to extend components that you don’t own

From Tim Deschryver, we got an article on how to reduce the verbosity of components in Angular that tend to have a lot of input properties.

https://timdeschryver.dev/blog/use-angular-directives-to-extend-components-that-you-dont-own
How to turn a website into an app in 2022?
Published: 2022-03-14 12:47:18

How to turn a website into an app? This question has triggered many businesses since the inception of digitization. 

Over 5 billion mobile app users have been over 85% of people spent time on mobile apps and only 13% on the website. Millennials use more mobile apps, either for buying groceries, ordering food, calling a taxi, gaming, or watching Netflix. They are glued to the screens all the time, which has increased the value of mobile apps today. 

That's the reason why businesses are thinking of porting their website to a mobile app. It would be much easier to reach a larger segment of the audience. The benefits of converting into a mobile app are:

1. Convenient
2. Fast & Secure
3. Better ROI
4. Offline Access
5. Rich UI/UX
6. Push Notifications

Now the question comes is how would you [convert your website to a mobile app](https://www.excellentwebworld.com/turn-a-website-into-an-app/?utm_source=Turn+your+website+into+an+app&utm_medium=infographic&utm_campaign=Mahima)?

With the help of the best mobile app development company, you can get the portability done quickly. Decide upon which platform you need your application to work on. Use the study of your target audience and make a Progressive web app, Native app, or Hybrid app.

There are multiple reasons people choose PWA and Native apps over portraying the products and services over a website. The biggest drawback of not converting into an app is the users cannot have easy access without the internet, it's not installable, nor would the users get any notification regarding offers, vouchers, new products, etc. 

A PWS has it all. The users do not have to install the app from the play store or an app store. If you build a PWA for your business, users can save the app on their mobile home screen. Some of the popular examples of PWA are Twitter, Facebook LITE, Flipkart, and more. 

Native apps are used by multiple companies with common characteristics of web and mobile applications. Written in HTML5, CSS, and JavaScript with easy code on multiple platforms like Android, iOS, or Windows. The developers will write the code once, and that's all. 

Some of the examples are Evernote, Uber, Baskin Robbins, etc.

You may find multiple things on the web if you search for converting a website to an app. You may go with either of the porting services that can boost your business.

(https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sa5evvzhtel6lw1jk2wk.jpg)
TERMINAL KOMANDALARI PART-4
Published: 2022-03-14 12:42:24

-alias
-Bu komanda takroriy ishlatiladigan komandalar uchun yangi nickname(taxallus) beradi.

-alias datedir='mkdir $(date "+%d-%m-%Y")' - ushbu komanda bugungi sana nomi bilan papka yaratadigan uzuuuuun komandaga qisqa nom beradi. Endi datedir deyish orqali bugungi sana nomi bilan papka yaratsa bo'ladi.

-alias komandasi bitta terminal session uchun ishlaydi holos.
NodeJS and DOM API
Tags: javascript, node, webdev
Published: 2022-03-14 12:42:07

NodeJS is a server-side javascript runtime environment.
DOM API is a client-side api implemented in Web Browsers.

Something NodeJS new learners can be confused.
```html
<html>
  <head>
  </head>
  <body>
    <div class='card'>
      card
    </div>
  </body>
</html>
```
```js
const div = document.querySelector('.card');
div.addEventListener('click', clickHandler);
```
You can see this javascript code trying to play with a div tag with a class name `.card`.
But this is impossible in NodeJS.
The reason is `document` is a global object that is supported by Web browsers. Thus, You cannot use `document` in NodeJS.

You may be confused because you are writing it in Javascript.
but Javascript doesn't have that.
You may link your javascript file to a html file, like
```html
<script src="public/js/test.js" />
```
First, You will open a `html` file. (i.e index.html).
Then, Web browser will load the html codes and javascript codes through `<script>` tag. Your javascript codes will be executed in Web browser architecture and the web browser has DOM API which supports `document` object.

But When you use NodeJS, There's no way your javascript code on NodeJS will be executed on Web browsers.

> Thanks for reading my post! If you have some feedback, please share it via comments! :)
Streaming March 14, 2022
Tags: opensource, python, streaming, apachepulsar
Published: 2022-03-14 12:39:59

[March 14](https://www.linkedin.com/pulse/streaming-march-14-2022-tim-spann-)

🇺🇦 #SUPPORTUKRAINE 🇺🇦

[https://www.linkedin.com/pulse/streaming-march-14-2022-tim-spann-/?trackingId=lOUMZGbOSSWWxT2%2B8sA89A%3D%3D](https://www.linkedin.com/pulse/streaming-march-14-2022-tim-spann-/?trackingId=lOUMZGbOSSWWxT2%2B8sA89A%3D%3D)
TERMINAL KOMANDALARI PART-3
Published: 2022-03-14 12:34:48

-date

```echo $(date '+%d-%m-%Y') ```- ushbu komanda hozirgi sanani (dd-mm-yyyy ko'rinishida) terminalga chop etadi
- ```mkdir $(date '+%d-%m-%Y')``` - bu komanda orqali bugungi sana nomli papka yaratiladi.

-code

-code main.cpp - bu komanda joriy papka ichida main.cpp degan fayl (yo'q bo'lsa) yaratib uni vscode ichida ochadi

-code . - joriy papkani vscode dasturida workspace (ishchi maydon) sifatida ochadi

-g++

-bu komanda C++ kodlarni kompilatsiya qilish uchun ishlatiladi.

-g++ main.cpp - bu komanda joriy papkadagi main.cpp nomli C++ kod faylni kompilatsiya qiladi va by default a.out nomli dasturiy fayl yaratadi

-g++ main.cpp -o dastur komandasi main.cpp faylni kompilatsiya qilib natijani dastur nomli faylga saqlaydi.
A new era for web development 🚀
Tags: webdev, laravel, php, productivity
Published: 2022-03-14 12:33:54

**DECK** is a modern web development studio built by developers for developers. So you are no more wasting time setting up your project on a local system.
An easy and fast GUI to set up any project stack. Not only that, DECK is now no more dependent on the Docker desktop app.

From 2019 to 2022, we are getting unexpected and warm appreciation from the [GitHub community](https://github.com/sfx101/deck) and the Reddit community. And so that while continuing our journey, we are excited to announce DECK V4 🎉

For the past 1 year, we have been entirely focused on creating a more easy GUI with 5x speed. So finally, the moment of truth comes.

Welcoming all web developers to give it a shot and help us grow more 🪴.
We are committed to your support.
[Download DECK now](https://get-deck.com)
Terminal 4-qism
Published: 2022-03-14 12:33:01

```
 Alias 
```
###Bu komanda takroriy komandalar uchun yangi nickname(taxallus) beradi.
- `alias datedir='mkdir $(date "+%d-%m-%Y")'`- bugungi komanda qiladigan bugungi sana nomi bilan papka uzuuuuun komandaga qisqa nom beradi. Endi `datedir`deyish orqali bugun sana nomi bilan papka bo'ladi.


- `alias`komandasi bitta terminal sessiyasi uchun ishlaydi holos.
Terminal | 3-qism
Published: 2022-03-14 12:25:32

```
Date
```

- **echo $(date '+%d-%m-%Y')**- komanda hozirgi sanani (dd-mm-yyyy ko'rinishida) terminalga chop etadi.
- **mkdir $(date '+%d-%m-%Y'**)- bu komanda orqali bugun sana nomli papka qilinadi

```
 Code

 ```

- ` code main.cpp- ` bu komanda joriy papka ichida main.cpp degan fayl (yo'q bo'lsa) yaratib uni vscode ichida ochadi.


- ` code .`- joriy papkani vscode dasturida workspace (ishchi maydon) sifatida ochadi.

```
g++

```
- bu komanda C+ kodlarni kompilatsiya qilish+ uchun.
- `g++ main.cpp`- bu komanda joriy papkadagi **main.cpp** nomli C++ kod faylni kompilatsiya qiladi va sukut bo'yicha `a.out` nomli dastur fayl fayli
- `g++ main.cpp -o dastur` komandasi main.cpp faylni kompilatsiya 
natijasidan dastur nomli faylga saqlaydi.
GitKraken
Tags: linux, gitkraken, git
Published: 2022-03-14 12:17:25

## Table of Contents
1. [Introduction](#introduction)
2. [Common Actions](#common-actions)
3. [Installing](#installing-gitkraken)

### Introduction
#### What is GitKraken?
It is an elegant GUI, developed by [Axosoft](https://www.axosoft.com/), for developers to keep track of their repositories, git history, visualize their timeline, and more. GitKraken  supports not only Github and Gitlab, but also Bitbucket, Trello and Azure Devops. You are also given access to GitKraken Boards and GitKraken Timelines after creating an account.

![GitKraken Gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a4ib5gtys4yx2w4agd5v.gif)

#### Who can use it?
GitKraken is [currently available](https://www.gitkraken.com/download) for Windows, Mac, and Linux. 

It comes in three different [price](https://www.gitkraken.com/git-client/pricing) ranges. Free comes with a 7-day trial of paid features. Both Pro and Enterprise are paid per user/month and is paid annually. You are able to download a trial of both as well.

### Common Actions
![GitKraken Toolbar](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/00hj0z3ms69jrfmukfmq.png)

Most of these actions can be accessed either on the toolbar at the top of the application or the right hand panel.

* Undo
* Redo
* Pull
* Push
* Branch
* Stash
* Pop
* Stage changes
* Commit stages, etc.

### Installing GitKraken
GitKraken is available in the Software Center of multiple Linux distributions such as Ubuntu, Linux Mint, and Zorin OS (YAY, that's mine!)

GitKraken is also available through [snap](https://snapcraft.io/gitkraken) and Flatpak.

For snap you would run:
*If you don't have snap installed, there is [instructions](https://snapcraft.io/docs/installing-snapd) available.*
```
$ sudo snap install gitkraken --classic
```

For Flatpak you would run:
*If you don't have Flatpak installed, there is a [setup page](https://flatpak.org/setup/).*
```
$ flatpak install flathub com.axosoft.GitKraken
```

Having just recently started using GitKraken, I am still new to this platform but would definitely encourage people to give it a try. It's a wonderfully helpful UI and powerful system that increases productivity, in my opinion.

I'll be writing more about the different applications I switched to when converting to Linux soon.

Happy coding!
What is an API?
Tags: webdev, api, javascript, programming
Published: 2022-03-14 12:08:26

**API is an acronym for Application Programming interface**
Application Programming Interface (API) is a software middleman that allows two apps to communicate with one another.

 You utilize an API every time you use an apps like ola, uber and swigyy, and try to track your delivery.

_For Better Understanding lets take one familiar and easy example:_

Imagine you’re sitting at a table in a restaurant with a menu of choices to order from. 

The kitchen is the part of the “system” that will prepare your order. 

What is missing is the critical link to communicate your order to the kitchen and deliver your food back to your table. That’s where the waiter or API comes in.

 The waiter is the messenger or (API)  that takes your request or order and tells the kitchen (the system) what to do.
 Then the waiter delivers the response back to you; in this case, it is the food.

![API Example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j345iym7tzkk1txv21em.png)

_Here is a real-life API example._ 

You may be familiar with the process of searching for flights online. Just like the restaurant, you have a variety of options to choose from, including different cities, departure and return dates, and more. 

Let us imagine that you’re booking you are flight on an airline website. You choose a departure city and date, a return city and date, cabin class, as well as other variables. 

In order to book your flight, you interact with the airline’s website to access their database and see if any seats are available on those dates and what the costs might be.
 
![API example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l4j2ek8i01ksnjfv286w.png)
 
**Benifits of APIs**

1. Security
Any of the applications cant access the system data directly. So  API provides one extra layer of security
2. Monitoring
All the illegal activities can be tracked using an  API key

Thank you for your read!
Terminal kommandalari | PART 4
Tags: terminal, beginners, uzbek, cpp
Published: 2022-03-14 12:06:23

### `alias` 
Bu komanda takroriy ishlatiladigan komandalar uchun yangi nickname beradi.
- `alias datedir` =`'mkdir $(date "+%d-%m-%Y")'`
 -ushbu komanda orqali takror takror bir `code` ni qayta qayta yozmaslik uchun qulaylik yaratadi
- endi `datedir` komandasi orqali bugungi sana bilan papka yaratsa bo'ladi!
- yana bir misol: qayta qayta `clear` kommandasini yozishga eringanim uchun o'zimga qulay qilib `alias` kommandasi orqali moslashtirib olaman

> `alias` **c**='clear'
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7hleq2xcke2s3p38f2rz.jpg)
endi **c** harfini yozsangiz avtomatik *clear* qialdi


 `alias` bir terminal session uchun ishlaydi holos
Top Soft Skills You Need in IT
Tags: beginners, productivity, career, discuss
Published: 2022-03-14 12:05:31

{% youtube IQ8X9TSObf0 %}

Hi! Let’s talk about soft skills in IT. About their importance, the largest challenges for developers, and some crucial situations when you may need them the most tells our frontend developer Bartosz.

Enjoy! You can also read the article at [Frontend House](https://frontendhouse.com/experts-zone/top-soft-skills-you-need-in-it-experts-zone-talks-16).
Terminal komandalar | Part 4
Tags: beginners, uzbek, terminal, cpp
Published: 2022-03-14 12:01:24

### `alias`
Bu komanda takroriy ishlatiladigan komandalar uchun yangi nickname(taxallus) beradi.
- `alias datedir='mkdir $(date "+%d-%m-%Y")'` - ushbu komanda bugungi sana nomi bilan papka yaratadigan *uzuuuuun* komandaga qisqa nom beradi. Endi `datedir` deyish orqali bugungi sana nomi bilan papka yaratsa bo'ladi.
- `alias` komandasi bitta terminal session uchun ishlaydi holos

### `date`
Bu komanda hozirgi vaqtni chop etish uchun ishlatiladi.
- `date` deb yozsa, *Mon Mar 14 17:55:28 +05 2022* formatda sanani chop etadi
- `date '+%d-%m-%Y'` komandasi sanani chop etishda **dd-mm-yyyy** formatda chop etadi. *14-03-2022*
- `date '+%d/%m/%Y'` komandasi *14/03/2022* ni chop etadi
Need to show save as option for excel download from URL
Tags: javascript, react, typescript
Published: 2022-03-14 11:30:12

Hi Team
I am downloading the excel file from api, its downloading successfully into download folder directly but I need to show Save as option for downloading file and I need to save where ever I want.
Please help on this 
Am using both axios and filesaver package also``
`
 `axios.get('url', { responseType: 'arraybuffer' })
      .then((response) => {
        var blob = new Blob([response.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
        FileSaver.saveAs(blob, "downloading.xlsb");
      });``


or 
 `const type = response.headers['content-type']
      const blob = new Blob([response.data], { type: type })
      const link = document.createElement('a')
      link.href = window.URL.createObjectURL(blob)
      link.download = 'STA_VIIV_and_Halt_Tracking.xlsb'
      link.click()`
The Cloud Resume Challenge
Tags: cloud, aws, devops
Published: 2022-03-14 11:20:20

[The Challenge](https://cloudresumechallenge.dev/)
[My Cloud Resume](https://cloudresume.morolakeanifowose.com/)

I came across the challenge while watching this [video](https://www.youtube.com/watch?v=vWerXJrNw2g&t=185s) on going from zero to  cloud engineer in 6 months. Going through the challenge and seeing the steps, I decided to go for it and get my hands dirty with new tools and technologies. The very first step of the challenge was getting the AWS CCP certification and luckily for me, I obtained it just two months prior.


**Setting up the Frontend**
This part of the challenge was fairly easy. I replicated my resume in HTML and styled it as I didn’t want to use a template. Using the AWS SAM CLI, I provisioned an S3 bucket and uploaded my files with the sync command. Once the site was hosted, I purchased a domain name (morolakeanifowose.com) in Route53. After purchasing my domain name, I requested a certificate using the AWS Certificate Manager. I then setup a CloudFront distribution, making my S3 bucket the origin, creating an alternate domain name, and attaching the previously created SSL certificate.

**Setting up the Backend**
Since I was using AWS SAM, my Lambda functions and APIs were created for me. I set up CORS and played around with my Lambda function, initially returning a static value when the API is called. From my YAML template, I created a DynamoDB table. Working with DynamoDB was a little difficult for me because I had never worked with with a NoSQL database prior to the challenge. I then split my Lambda function into two, one for inserting data into my DynamoDB table and the other for returning that data using the AWS SDK for Python (Boto3).

**Connecting the two**
After my DynamoDB, API Gateway and Lambda functions worked together, I created a simple Javascript counter in my HTML document to return the value in my DynamoDB table as the visitor count on my webpage.

**CI/CD**
The CI/CD part involved setting up Github actions such that when my Python tests pass, the SAM application gets packaged and deployed to AWS and when new website code is pushed, the S3 bucket automatically gets updated. 

![CI/CD Frontend](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/89b0dqzw3zgbhnif83ee.png)

**Final Words**
I really loved the challenge as I got to work with tools such as DynamoDB, AWS SAM, Github Actions which I had never used before. 
There were parts I struggled with, but YouTube came to my rescue as usual. Here is my [finished product](cloudresume.morolakeanifowose.com).
Feel free to reach out to me on [LinkedIn](https://www.linkedin.com/in/morolake-anifowose/) or via [email](morolaanney@gmail.com).
How to Hire a Flutter Developer?
Published: 2022-03-14 11:12:44

Flutter is an open-source software development kit (SDK) developed by Google. It is used to develop applications for Android, iOS, Windows, Mac, Linux, and web. The first version of Flutter was known as "Sky" and ran on the Android operating system.

With the rapidly changing market trends, business owners and decision-makers often look for quicker yet flexible mobile app solutions. The cut-throat and highly competitive market attracts a lot of startups and entrepreneurs to launch their apps fast so as to gain the maximum advantage. Flutter platform offers a complete UI kit to build high-scale and flexible mobile apps with the best icons, typography, and scrolling behaviors. This robust yet flexible framework allows app developers to create a full-fledged cross-platform mobile app that not only saves time but reduces development costs to a great extent.

**If you’re looking forward to hiring flutter app developers, they need to be proficient in the below-mentioned roles and responsibilities:**

- Designing and developing simple and complex applications
- Practicing clean code
- Make sure to follow the flutter app development lifecycle
- Fixing errors, bugs, and glitches if any
- Investigating and incorporating better technologies for the swift development process
- Follow new development trends.
- The rates to hire flutter app developers in 2022 vary countrywide. Generally, developers prefer to work over hourly rates. However, that can vary based on the below factors.
- Hiring options (freelance, in-house, outsource)
- Qualifications (junior, mid-level, senior)
- Regions.

Now, you are aware of the skill requirement in a flutter developer. So, you can share your requirement with an agency for hiring a dedicated flutter developer.
 
So, if you wish to create your own flutter app, just drop your details to **WebClues Infotech** and their sales executive will get back to you with detailed estimations.
Chatbot for WooCommerce
Tags: web
Published: 2022-03-14 11:09:13

Provide automated customer support by engaging customers in predefined queries with [WooCommerce messenger bot](https://woocommerce.com/products/facebook-messenger-chatbot-for-woocommerce/).You can set multiple options with replies in form of text, URLs, or postbacks to simplify the conversations. As per the policy, it allows to set up to three postback replies. [WooCommerce Chatbot](https://woocommerce.com/document/facebook-messenger-chatbot-for-woocommerce/) allows you to send images in initial chat messages to engage customers. You can also create default chatbot messages with titles. This plugin allows you to create conditional questions as auto-replies to provide customers with multiple answers to choose from. It also allow post, product, or category search in chat. You can display chat bubble on shop, home, or single-product pages. It enables you to connect your social business page with your online store.  You can change the connected page when needed.
Terminal bilan ishlash | Part 1
Tags: beginners, foundation, terminal, linux
Published: 2022-03-14 11:00:05

### `Terminal nima?`


`Terminal` operatsion tizmda o'rnatilgan dasturlarga murojat qilish uchun yaratilgan maxsus dastur.
Ba'zilar uni `Konsol` deb ham atashadi

Terminal bu kompyuterni sichqonchasiz ya'ni, Konsolga ma'lum buyruqlarni yozish orqali boshqarish imkonini beradi.

`rozibek@home:~$` 
   ^-Bu (rozibek) foydalanuvchi logini
- `~` - foydalanuvchining uy papkasi
- `$` - belgisi buyruqlar oddiy foydalanuvchi tomonidan bajarilayotganligini bildiradi.
Agarda `$` - belgisi o'rnida `#` belgisi tursa demak, buyruqlar `Super` foydalanuvchi tomonidan bajarilayotganligini anglatadi.
 
Ho'sh endi savol tug'iladi, `Oddiy` foydalanuvchi bilan `Super` foydalanuvchining farqi nimada?

`Oddiy` foydalanuvchida faqat o'zining uy papkasi ichida o'zgartirishlar huquqi bo'ladi.
`Super` foydalanuvchi tizimning istalgan joyida o'zgartirish mumkin.