teleren/devto huggingface dataset:
Building an Angular application with a seperated server-side backend
Tags: angular, discuss, help
Published: 2021-10-01 09:49:08

I want to preface all of this by saying I'm a pretty new developer. If there's any clarification needed because my question is not preicse enough I'll gladly provide!

So as part of my current education we're doing something they call pop-up internship where you go to visit a company for a day or two and run through a couple different departments to get a feel for how different companies might tackle some of the daily tasks they encounter.

One company in particular had an app in development that really got me interested. They were building a web application for one of their customers based on the Angular framework from what I understand. The backend/serverside code was written in Java. The interesting part is that they used some way to turn the expoted Java-WAR into a file they would include in the Angular project. This allowed them to call methods from that service and, what was the most interesting to me, the classes for the project were only defined in that Java code yet perfectly usable in that Angular code. I saw some kind of service URL in the code which I assume is somehow being used to make the actual calls in some way.

Unfortunately I wasn't able to dig deep enough/get into the deeper questions I had regarding the whole procedure. 

I don't have any experience with Java, writing mostly little PHP and C# applications so far so I wondered - is a model like this possible to set up with Angular and PHP? If yes, where do I need to look in terms of guidance to set something like that up with my Angular project? What are some key things I need to know before tackling something like this? Is it even worth doing like that?

There's a lot floating in my head right now regarding this because this is kinda exciting to me, any and all help would be greatly appreciated
Create an FAQ Accordion With jQuery 
Tags: javascript, html, jquery, css
Published: 2021-10-01 09:18:54

<p class="codepen" data-height="300" data-default-tab="html,result" data-slug-hash="eYRXqPb" data-user="kavindusithara" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
  <span>See the Pen <a href="https://codepen.io/kavindusithara/pen/eYRXqPb">
  FAQ Accordion</a> by kavindu_sithara (<a href="https://codepen.io/kavindusithara">@kavindusithara</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

{% codepen https://codepen.io/kavindusithara/pen/eYRXqPb default-tab=js,result %}
Best Opensource HTML / Vue  Template for Developer Portfolio
Tags: webdev, opensource, portfolio, vue
Published: 2021-10-01 08:32:58

Minimal and Modern theme for Portfolios . Created using vuejs and vuetify . The template is completely free , opensource .

Give it a star 🌟 on Github if you find it useful.

GitHub Repo https://github.com/aabidsofi19/neva-portfolio-template

Check out the live demo https://neva-portfolio-vue.netlify.app

Link to docs https://www.aabidsofi.com/docs/neva-portfolio-vue/

The template is best fit for developers and designers wanting to showcase their portfolio to  the mighty web audience 

Fully Responsive on Mobile Devices

The template has been crafted with love using Vuejs, Vuex, and Vuetify.
The template follows a component-based design so, is easy to customize for both developers and people not familiar with code.

The template has been specially crafted to be simple to customize for people not familiar with code.

The installation process is pretty simple and won’t take more than 10 minutes. So let’s begin.

Hav’nt installed the template yet,clone the repo now.

The template has been licensed under the MIT license. Which means you are not bound for any type of credit. But surely giving one in your footer will be helpful and appreciated a lot.

Star the repo on Github and follow me. It means a lot ❤️.
How long is an App Linking link valid for?
Tags: android, huawei, applinking
Published: 2021-10-01 08:31:16

The [App Linking](https://developer.huawei.com/consumer/en/doc/development/AppGallery-connect-Guides/agc-applinking-getstarted-android-0000001054594767) service provided by AppGallery Connect, is a great cross platform App link generation service. The SDK supports both Android and iOS. For non-Huawei Android phones, the link can be set to redirect users to the phone's app market, as well as support for fallback URLs.

No matter what device the user is on a Huawei AppGallery Connect App Link will work and direct that user to the best method for installing the app on their device.

But here is the question, does the links create have a validity period? If they do how long can they last?

The link of App Linking can be created in AppGallery Connect manually or via code after your app has been integrated with the SDK. Is there a difference between the validity periods of the links created using the two different methods?

Taking a look at the API reference we find that the SDK for Android and the SDK for iOS both have an API to set the validity period of the link:
For Android: The API is **setExpireMinute**, and is a time accurate to the minute. A link is valid for two years by default, and the minimum validity period is 5 minutes.
For iOS: The API is **expireMinute**, and is a time accurate to the minute. A link is valid for two years by default, and the minimum validity period is 5 minutes.

However, there is no description about the validity period of the link on the link creation page in AppGallery Connect.
And there was also an Archive button, what does this do?

![image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8jxjro8wnthb1fk18i8m.png)

The Links created in AppGallery Connect are permanently valid if unarchived. Archived links are still valid within one year.
After you click the Archive button, links will be archived but their data will not be traced.
Archived links can still be viewed within seven days. You can filter the links in AppGallery Connect by selecting Archived in last 7 days. You can also click Unarchive in the Operation column to cancel archiving.

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

References:
[setExpireMinute](https://developer.huawei.com/consumer/en/doc/development/AppGallery-connect-References/applinking-builder-0000001055180835)
[expireMinute](https://developer.huawei.com/consumer/en/doc/development/AppGallery-connect-References/agcapplinkingcomponents-0000001054853636)
[Archiving a Link of App Linking](https://developer.huawei.com/consumer/en/doc/development/AppGallery-connect-Guides/agc-applinking-archive-0000001063922926)
Clean Architecture on Frontend | The dev.to post of the month.
Tags: typescript, react, architecture, javascript
Published: 2021-10-01 08:24:28

Alex Posted an article about "**Clean Architecture on Frontend"** on Sep 1 and Updated it on Sep 6

{% user bespoyasov %}

He says:
> Not very long ago I gave a talk about the clean architecture on frontend. In this post I'm outlining...

It's a cool article with over 3600 positive reactions 👍.
with #typescript #react #architecture

{% post https://dev.to/bespoyasov/clean-architecture-on-frontend-4311 %}

Direct link 👆.

Thanks 💖💖💖.
Introduction to Flutter
Tags: flutter, tutorial
Published: 2021-10-01 08:17:08

### What is Flutter?
Flutter is a framework developed by Google. It is used to develop applications on cross-platform. So our application we wrote with Flutter; web and performs on both ios and android devices. In other words, we can have an application that can run on many platforms with a single code. In this way, we can save both cost and time. Google first used Flutter when developing the <strong><em><a href="https://fuchsia.dev/" rel="nofollow" target="_blank">Fuschia</a></strong></em> operating system.

Flutter doesn't work with any development tools, but includes editor plugins for **Visual Studio Code** and **IntelliJ/Android Studio**. It is also open source. You can review their code on <em><strong><a href="https://github.com/flutter/flutter" rel="nofollow" target="_blank">GitHub</a></strong></em>, and you can contribute by adding code.

### Why Flutter?
Continue this post on my blog! [Introduction to Flutter](https://baransel.dev/post/what-is-flutter/).
Time change in daylight saving
Tags: timezone, utc, daylightsaving
Published: 2021-10-01 07:50:30

I live in a country not following daylight saving time. By writing this article, it helps me to understand what happens when daylight saving time starts and ends. 

## You can't stick with UTC all the time

Ideally, we should stick with UTC whenever possible. But most of us live with local time. For example, trading hour of New York stock exchange opens at 09:30 New York local time (or Eastern time). 09:30 ET is 13:30 UTC in summer or 14:30 UTC in winter. If you schedule a task with UTC time to do something when market opens, then you need to be aware of time change.

We will use **Eastern time** as example in this article.

## When daylight saving time starts

In March every year, we change from standard time to daylight saving time. We do a "clock forward", 1 hour is skipped in local time.

```sh
SOURCE_TIMEZONE=UTC && TARGET_TIMEZONE=America/New_York

# Change 2021-03-14 06:00 UTC to ET
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-03-14 06:00"''
# Sun Mar 14 01:00:00 EST 2021

# Change 2021-03-14 06:59 UTC to ET
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-03-14 06:59"''
# Sun Mar 14 01:59:00 EST 2021

# Change 2021-03-14 07:00 UTC to ET
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-03-14 07:00"''
# Sun Mar 14 03:00:00 EDT 2021
```

From the above, 02:00 is skipped.

After 01:59 (EST), it jumps ahead to 03:00 (EDT). The timezone changes from `EST` (Eastern standard time) to `EDT` (Eastern daylight time).

So what if we try to format a time `2021-03-14 02:00 ET` to `UTC`?

```sh
SOURCE_TIMEZONE=America/New_York && TARGET_TIMEZONE=UTC

# Change 2021-03-14 02:00 ET to UTC
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-03-14 02:00"''
# date: invalid date 'TZ="America/New_York" 2021-03-14 02:00'
```

We can't do that or the behaviour is unknown.

## When daylight saving time ends

In November every year, we change from daylight saving time to standard time. We do a "clock backward", 1 hour is repeated in local time.

```sh
SOURCE_TIMEZONE=UTC && TARGET_TIMEZONE=America/New_York

# Change 2021-11-07 05:00 UTC to ET
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-11-07 05:00"''
# Sun Nov  7 01:00:00 EDT 2021

# Change 2021-11-07 05:59 UTC to ET
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-11-07 05:59"''
# Sun Nov  7 01:59:00 EDT 2021

# Change 2021-11-07 06:00 UTC to ET
TZ=$TARGET_TIMEZONE date --date='TZ="'"$SOURCE_TIMEZONE"'" '"2021-11-07 06:00"''
# Sun Nov  7 01:00:00 EST 2021
```

From the above, 01:00 is repeated.

After 01:59 (EDT), it falls back to 01:00 (EST). The timezone changes from `EDT` (Eastern daylight time) to `EST` (Eastern standard time).

Hope this help to maintain timezone sensitive application. I worked with a few data APIs (e.g. Reuters), some of their documentations contain mistakes with timezone.
5 Things Clients Value
Tags: programming, webdev, services, computerscience
Published: 2021-10-01 07:46:18

"quality of service"
1.Way you interact with them.
2.How you responded to their emails.
3.How are you going to present your session.

"Your Experience"
1.How many times have you gotten new clients who are comparable to them in the years you've been doing this.
2.Your projects | portfolios

"You and your customers' relationship"
1.The more people with whom you have a positive relationship, the more likely they are to hire you.
2.How do you deliver your product or Services to people

"Your brand"
 just like you, cares about what you buy as a consumer product, and service providers only want to collaborate with strong brands.

"Time management"
How do you manage your time and provide your goods in a shorter amount of time? As a provider, it strains your time management since there is so much demand, and every client expects it to be met.

Golden tip
Make sure you invest in your other assets as well as your brand's services so that they may choose you for more than simply your design talents and others stuff too
Understand the TLS Handshake
Tags: security
Published: 2021-10-01 07:31:22

{% youtube WD5oqjZXJFo %}

---

To be safe on the Internet, it is essential to pass information through encrypted communication. 🔐

This is also called encrypted streams. 🔐

But how does it work all these exchanges to arrive at a result where my data is in encrypted flows and it is inviolable? 🤔

As a developer, I'm going to need to understand how all of this works so that I can implement it effectively in my app or website. 👨🏼‍💻

As a security engineer, it is essential to know how it works in order to be sure that there are no potential vulnerabilities in the implementation of my web service. 👷🏼‍♂️

As an individual "general public", it is classy to know these type of things to shine in society. 😄

I'll explain all of that to you in this week's video .... 👆🏼

---

*If you like this content, push the like button, that helps spread the message.* 👍🏼
*If you think it can be useful to anyone in your network, share it.* 📨

---

Video produced by [Wild & Secure](https://wildnsecure.com), your consulting firm to all things security and real estate.
If you want to receive weekly quality content about security, subscribe to our newsletter on our website. [https://wildnsecure.com](https://wildnsecure.com)
Golang 101: Merhaba Dünya!
Tags: go, helloworld
Published: 2021-10-01 07:06:21

Golang ilk örneğimize gelenekleri bozmadan "Merhaba Dünya!" diyerek başlayalım.

**main.go**:
```golang
package main
 
import "fmt"
 
func main() {
    fmt.Println("Merhaba Dünya!")
}
```
[çalıştır!](https://go.dev/play/p/rZCKpGZKFl3)

Uygulamadaki alanları inceleyelim..

## Paketler (package)
Golang uygulamalarında öncelikle paket adını tanımlayarak başlanır. Ana uygulama ve ona bağlı uygulamalar **package** deyimi ile başlar ve **main** paketi olarak kabul edilir. Sonraki örneklerde daha detaylı değineceğiz.


## İçe Aktarma (import)
Hazır gelen paketler veya harici geliştirilen paketleri/modülleri ise **import** ile içe aktarır sonrasında kullanırız. Bu örnekte kullanılan [**fmt**](https://pkg.go.dev/fmt) paketi Girdi/Çıktı (I/O) işlemleri için geliştirilmiştir. **Println** fonksiyonu ise belirtilen girdiyi (örnekte: *"Merhaba Dünya!"*) sonuna yeni satır karakteri ekleyerek yazdırır (*stdout*).

## Fonksiyon (main)
Ana uygulamanın bir **main** fonksiyonu olmak zorundadır. Uygulama çalıştırıldığında bu fonksiyon otomatik olarak çalıştırılır ve işlevleri gerçekleştirir.

## Çalıştırmak (run)
Uygulamanızı test etmek için **go run main.go* komutunu kullanmamız yeterlidir. Uygulamayı test etmek için kodun hemen altında link verildi, web üzerinden çalışmalarınızı denemek için https://play.golang.org adresini kullanabilirsiniz.

## NOT
Tüm yazıları örnekler üzerinden anlatmaya çalışacağım, tanımlarda veya söz dizimlerinde hatalarım olursa lütfen bildirin birlikte düzeltelim.

*Bilgi Paylaştıkça Çoğalır!*
C++ and Java Code for Sieve of Eratosthenes
Tags: primenumbers, java, cpp
Published: 2021-10-01 06:59:40

The sieve of Eratosthenes is one of the most efficient ways to find all primes smaller than n when n is smaller than 10 million or so. Following is the algorithm to find all the prime numbers less than or equal to a given integer n by the Eratosthenes method: 

When the algorithm terminates, all the numbers in the list that are not marked are prime. 

* Firstly write all the numbers from  2,3,4…. n
* Now take the first prime number and mark all its multiples as visited.
* Now when you move forward take another number which is unvisited yet and then follow the same step-2 with that number.
* All numbers in the list left unmarked when the algorithm ends are referred to as prime numbers.

## C++ Implementation
```c++
void SieveOfEratosthenes(int n)
{
    bool prime[n + 1];
    memset(prime, true, sizeof(prime));
 
    for (int p = 2; p * p <= n; p++)
    {
        if (prime[p] == true)
        {
            for (int i = p * p; i <= n; i += p)
                prime[i] = false;
        }
    }
    for (int p = 2; p <= n; p++)
        if (prime[p])
            cout << p << " ";
}
```
## Java Implementation
```java
class SieveOfEratosthenes {
    void sieveOfEratosthenes(int n)
    {
        boolean prime[] = new boolean[n + 1];
        for (int i = 0; i <= n; i++)
            prime[i] = true;

        for (int p = 2; p * p <= n; p++){
            if (prime[p] == true)
            {
                for (int i = p * p; i <= n; i += p)
                    prime[i] = false;
            }
        }

        for (int i = 2; i <= n; i++)
        {
            if (prime[i] == true)
                System.out.print(i + " ");
        }
    }
}
```
Time complexity of Sieve of Eratosthenes :
o(n * (log(log(n)))).

Space complexity: O(1)
Source - [InterviewBit] (https://www.interviewbit.com/blog/sieve-of-eratosthenes/)
Install PHP8, PHP7 on macOS Big Sure
Tags: php, macos, brew
Published: 2021-10-01 06:49:49

---
title: Install PHP8, PHP7 on macOS Big Sure
published: true
description: How to install multiple PHP versions on macOS Big Sur
tags: php, macOS, brew,
cover_image: https://images.unsplash.com/photo-1599507593499-a3f7d7d97667?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2340&q=80
---

Only `PHP7.2` through `7.4` are officially supported by `Brew`, but these have to be build which is pretty slow. For the latest version of `PHP`, I am going to use the new tap from `@shivammahtur` as there are many versions pre-built.

```bash
➜ brew tap shivammathur/php

# different versions of PHP
➜ brew install shivammathur/php/php@7.4
➜ brew install shivammathur/php/php@8.0
```

After the successful installation, you are able to find the `php.ini` for each version of PHP in the following directories:

```
/usr/local/etc/php/7.4/php.ini
/usr/local/etc/php/8.0/php.ini
```
or show the `php.ini`by using the command:
```
➜ php -i | grep php.ini
```

## switch PHP version

```
# switch to 7.4
brew unlink php && brew link --overwrite --force php@7.4

# switch to 8.0
brew unlink php && brew link --overwrite --force php@8.0
```

## define the aliases
```
alias php74="brew unlink php && brew link --overwrite --force php@7.4"
alias php80="brew unlink php && brew link --overwrite --force php@8.0"
```
then type `php74` or `php80` to switch php versions.
Fullstack app (workshop) with distributed tracing, logging and monitoring
Tags: dotnet, webdev, showdev, monitoring
Published: 2021-10-01 06:41:48

## Intro
I would like to announce the OpenSource Fullstack App Example (Workshop) that shows a specific stack implementation from frontend to backend, including identity and distributed tracing, logging and monitoring.

https://github.com/damikun/trouble-training

### What is the idea behind this?
There are many courses, trainings (paid/opensource) online that show you specific things, but not many that show you a fullstack implementation. 

![TroubleTraining architecture example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bvyisv7tybemytl0zdkk.png)

This is not perfectly done! Take this as my notes. Some parts were exported from my custom CCMS that I use for factory automation field, and I remember when I was just starting out and did not have snippets to help me solve certain problems.

### What it's about.
- Showing simple frontend integration for a webhooks management app with login/logout via backend bff using React, Relay, Typescript.
- Shows exporting telemetry and logs to distributed monitoring endpoints with Opentelemetry and ElasticStack
- Shows a full backend implementation for webhooks, including self-hosted identityServer and protected Graphql API.

![FullStack request distributed tracing example](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/00va17s6ipyj99gmnq6q.png)

#### For who it is
- You are a full-stack developer (an attempt is made to explain advanced topics).
- You are a .Net developer and use modern technologies.
- Or you are implementing a modern React and Relay frontend based on a .Net backend.
- You want to understand the advanced concept of security patterns as BFF.
- You want to know how to trace and monitor a distributed application.

### Topics

This release contains 7+ main topics that you can read about in detail:
- [Configuring Logging](https://github.com/damikun/trouble-training/blob/main/Doc/Logging.md)
- [Configuring Telemetry](https://github.com/damikun/trouble-training/blob/main/Doc/OpenTelemetry.md)
- [Configure identity](https://github.com/damikun/trouble-training/blob/main/Doc/Identity.md)
- [Configure Monitoring](https://github.com/damikun/trouble-training/blob/main/Doc/ElasticSearch.md)
- [Handle 6a GraphQL Errors](https://github.com/damikun/trouble-training/blob/main/Doc/GraphQL%20-%20MutationErrors.md)
- [Build Automation](https://github.com/damikun/trouble-training/blob/main/Doc/BuildSystem.md)
- [Setup WebHook Backend](https://github.com/damikun/trouble-training/blob/main/Doc/WebHookBackend.md)

(Some topics are language specific, others relate to a specific platform).

### Repository:

[https://github.com/damikun/trouble-training](https://github.com/damikun/trouble-training)
My Hacktoberfest Repos
Tags: hacktoberfest, githunt, opensource, contributorswanted
Published: 2021-10-01 06:40:00

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

## My Hacktoberfest Repos

👋🏻 Hi everyone, and Happy Hacktoberfest! 

This is my repos ready for the Hacktoberfest:

### C++

Header-Only C++ library for Graph Representation and Algorithms with a simple interface.
 
{% github zigrazor/CXXGraph %}


A C++ Library to which implements the structures and algorithms for finite automata, pushdown automata, and Turing machines. 

{% github zigrazor/CXXAutomata %}

### Python

A Python implementation of simply configurable State Machines.
 
{% github ZigRazor/PyStateMachine %}



Happy Coding! 💻