teleren/devto huggingface dataset:
GitHub Actions - DevSecOps Pipeline
Tags: actionshackathon21
Published: 2021-11-29 14:47:45


### My Workflow
DevSecOps Pipeline - https://github.com/magnologan/gha-devsecops

### Submission Category: 
Maintainer Must-Haves


### Yaml File or Link to Code

https://github.com/magnologan/gha-devsecops


### Additional Resources / Info

SonarCloud GHA - https://github.com/marketplace/actions/sonarcloud-scan

Snyk GHA - https://github.com/marketplace/actions/snyk

OWASP ZAP GHA - https://github.com/marketplace/actions/owasp-zap-baseline-scan

Shoutout to Snyk Ambassadors! https://snyk.io/snyk-ambassadors/
Upgrade to firebase V9 NOW!!!
Published: 2021-11-29 14:34:32

**Hello Developers 👋👋**

Firebase V9 is here and it is awesome...

I upgraded my project [yourounotes](https://yourounotes.vercel.app/) to firebase V9 and the results were impressive

![Firebase](https://i.pinimg.com/originals/6e/46/6c/6e466cb0d3df7f082596fef171d6d370.jpg)

Responses time drop from 2s to 307ms, 85% faster.

I go all in and update everything, from auth, to firestore, to firebase storage...

I ran into many bugs and I have to read a lot of documentation and it was all worth it in the end.

I am writing blogs on almost everything related to firebase

Started last week with auth.

Read [how to add google login functionality with firebase V9](https://dev.to/shareef/firebase-v9-login-with-google-in-react-and-nextjs-426m)

Would love to read about your experience with firebase V9.

Closing here 👋👋👋
> This is **Shareef**.
> My recent project [yourounotes](https://yourounotes.vercel.app/)
> My [Portfolio](https://portfolio.shareef.vercel.app/)
> Twitter [ShareefBhai99](https://twitter.com/shareefBhai99)
> [Linkedin](https://www.linkedin.com/in/nadeem-shareef-7a8394182/)
> My [other Blogs](https://dev.to/shareef)
Introduction to Version Control Systems
Tags: github, versioncontrol, webdev, beginners
Published: 2021-11-29 14:21:38

A **version control system** is a software tool that helps the developer team to make changes and track the codebase. The codebase is simply the source code collection that was used to build a particular system or application. Version control is important because it helps the developer team to manage changes made to the source code and keep record of who made the changes.

## Types of Version Control Systems

**_- Local Version Control Systems_**
This system keeps track of files within your local computer. Any changes made to a particular file is stored as a patch and every patch set will only contain the changes made to the file since its last version.

_**- Centralized Version Control System**_
A single repository contains all the versioned files where developers can commit changes to files. this system allows for collaboration among developers however the repository is the single point of failure which can affect other developer's working on it.

**_- Distributed Version Control System_**
This system contains multiple repositories and each user has their own working copy.


##** Benefits of Version Control**

1. Distributed version control systems enabled individuals from around the world to make contributions to projects remotely and make collaborations.

2. Ability to track changes made to software and connect it to software testing tools.

3. History logs of every file where when and who makes changes are tracked to enable future debugging of the system.

4. Users can have multiple backups locally therefore preventing loss of data in case of a system failure.

**Best Version Control Systems**

Although there are many systems in the marketplace, a few of them standout and are mostly used by developers. They include:

- _GitHub_
Developers host their projects on this platform in repositories. They can easily track code changes and do rollbacks on app versions when necessary.

- _GitLab_
It has continuous integration capabilities which you can use to perform automatic tests and deliver code.

- _Perfoce_
it has a system known as HelixCore which comes with a single platform for seamless team collaboration,  and support for both centralized and distributed development workflows.

- _BeanStalk_
This software is ideal for remote workers as it is based on browser and cloud, allowing users to code, commit, and deploy on the browser.
Data Engineering 101 for developers
Tags: datascience, engineering, udacity, learn
Published: 2021-11-29 14:14:51

Recently I started the online nanodegree program [Data Engineering](https://www.udacity.com/course/data-engineer-nanodegree--nd027).

In order to learn the new technologies and concepts better, I will sum up the learned content in a small series on dev.to.

In addition you can find the according exercises on [my github account](https://github.com/BarbaraJoebstl/data-engineering-nd).
Divide et Conquer vs Dynamic Programming
Tags: algorithms, computerscience, beginners, programming
Published: 2021-11-29 14:10:34

Divide and Conquer (D&C) and Dynamic Programming (DP) are two great algorithmic techniques. Both divide a given problem into subproblems and solve the subproblems.

How do you choose which one is better to use for solving a problem ?

To answer this question you need first to understand if the subproblems overlap or not. If they don't overlap you should use Divide at Conquer. If they overlap you should use Dynamic Programming.

Let's consider a problem P broken down into 2 smaller subproblems S1 and S2. 

With Divide and Conquer you would:

1. solve S1 and S2 separately
2. combine their solutions in a certain way
3. get the answer to P

A classic example is the mergesort algorithm, where you sort an array by:

1.  dividing it into 2 subarrays
2. sorting the 2 subarrays independently
3. merging the sorted subarrays to get the original one sorted

There is no inter-dependency between the 2 subarrays for finding the solution.

With DP the first thing you need to realize is that S1 and S2 overlap. What does it means ?
Basically that there is an inter-dependency between S1 and S2.

Let's suppose that S2 depends on S1. This means that S1 has to be solved before S2 can be solved. That's exactly what DP does when implemented in bottom up way.

How ?

* solving S1 first and remembering the result.
* solving S2 utilizing the remembered result for S1 (S2 depends on S1)
* solving P using the solutions of S2 and S1.

All you need to do is start from bottom (S1) and move gradually (through S2) towards up (P).

A classic example is the Fibonacci sequence defined as f(n) = f(n-1) + f(n-2). Here the solution for f(n-1) depends on the solution for f(n-2). The DP approach:

* solve the problem for the smaller number first 
* reuse this value to calculate the larger value
* get the final value

Thank you for reading! I'm Franco Fernando, helping you to better understand algorithms and data structures.

If you liked this post, follow me here and on [Twitter](https://twitter.com/Franc0Fernand0) to get more related content daily!
CANSAT Surecimiz basliyor...
Published: 2021-11-29 14:08:24

{% instagram CWDzcWusejo %} 
Bu yıl kulübümüz;
Dünyanın farklı yerlerinden üniversite takımlarının yarıştığı ve Amerikanın Virginia eyaletinde düzenlenen.
NASA, ASS, Siemens gibi firmaların sponsor olduğu CanSat Competition yarışmasına katılmaya karar verdi.
Bu yarışma ekibimizi hem maddi/hem manevi olarak çok yorucaktı. Neden olmasın dedik ve KTU Uzay CANSAT Team kuruldu ve  yarışmaya başvurduk. Ben ve Duhan GÜNSEL arkadaşım ekibin yer istasyonunun masaüstü yazılımdan sorumlu olduk. Duhan ile beraber github üzerinden projemizi ortak geliştirdik. 15 Mart 2022 de yarışmaya göndermiş olduğumuz ingilizce teknik raporun ve hakemlere online sunumun sonucu açıklandı. Yarışma için Virginia eyaletine gidebilecek sadece 55 takım vardı ve bu rapor aşamasını Dünya 4.sü olarak geçmiş olduk. Bu haber yurtdışında okulumuzu temsil edeceğimiz için bizleri çok mutlu etmişti.
İşin kötü yanı ise pandemi sebebi ile vize randevuları geç tarihlere veriliyor ve bizler 2023 yılına randevu alabildik.
Hem Cansat uydu takımı hem de ESS roket takımı olarak iki farklı yarışmadan Amerikaya davet mektubu alabilmemize rağmen gidemedik.

Not: Cansat Yetkilileri vize alamayanlar için ayrı bir kategori açarak Haziran ayının sonunda  online bir yarışma düzenleyecek.


(Güncelleme yarışma sonucunda dünya 3.sü olduk)
{% instagram CfUkSNIMb6F %}
Code Snap a new way to share code
Tags: productivity
Published: 2021-11-29 13:50:08

**Code Snap** is an extension for **Visual Studio Code**. It lets you save screenshots of the selected code and it looks better and cleaner. It can be customized to your liking and saves the image as png to make it easier to share.


[CODE SNAP](https://marketplace.visualstudio.com/items?itemName=adpyke.codesnap)
COMMAND LINE BASICS
Tags: 100daysofcode
Published: 2021-11-29 13:49:45

> The black screen or window that appear on our system is the  COMMAND LINE INTERFACE(CLI),where we are able to enter commands that our computer will run for us.
        Working with it is a critical skill for us to learn as a developer.

> _The command line is like our base of operations, from which we can launch other program and interact with them.If you will be entering the same command dozens of time, you'll quickly pick up the commands you needs the most.

~TEST DRIVE YOUR TERMINAL

*Open a terminal on your computer linux:open the program menu and search for "TERMINAL"
*you can also open 'TERMINAL'by pressing "CTRL+ALT+T"

       BEFORE THIS TAKE A LOOK HERE---
$whoami.This is a terminal command because it begins with $.$ is saying"hey!Enter what follows in your terminal.
It means we must exclude $ when entering a command.In the above example, we would only enter "whoami"in our terminal.
Now try it out and make sure your terminal is open, type the command mentioned and press ENTER.

~WHY COMMAND LINE:

because the upcoming installations will require you to install many different program using the command line. As part of bigger picture,you may well be using command line on a daily basis as a software developer.


      Before diving into command line, let's know how to create a file.
1.Open your terminal and enter 1S, 1S will show you the file and folder.

2.Create a file called"test.txt"by entering in terminal"touch test.txt".

3.Now enter 1S once again. You should see "test.txt"listed in the output.

~NOTABLE POINTS:

1. You might have already noticed that copying and pasting inside the command line doesn't work.So when you are inside the command line use "CTRL+SHIFT+C" to copy and "CTRL+SHIFT+V" to paste.

2.You need to learn about TAB COMPLETION(is a common feature of command line interpreter, in which the program automatically fills in partially typed commands.
                         It allows the user to type the first few characters of a command, program or file name and press completion key i.e tab to fill in the rest of the item.The user then press'return' or 'enter' to run the command or open the file.
            THANK YOU AND HAVE A NICE DAY...
Contribute to React/Node website as a beginner
Published: 2021-11-29 13:44:09


{% link https://dev.to/ats1999/a-nextjs-app-to-keep-track-of-your-time-37im %}

This is a beginner friendly project, head over the [github-repo](https://github.com/ats1999/time-stamp). Go through issue, or create your own issue. 

I'll suerly revert

Thank You :)
Simple Pre Loaders Using CSS --Wave Style
Tags: css, webdev, beginners, codenewbie
Published: 2021-11-29 13:38:09

Here are some examples of simple pre loaders using CSS. These are based on waves, I would like to know your feedbacks. These codes are not optimized, there are just experiments. Hope you will like it.   
{% codepen https://codepen.io/kiran-r-raj/pen/mdBbVzP %}

{% link https://dev.to/kiranrajvjd/css-pre-loaders-circular-components-css-only-462f %}
How to reuse component's props in TypeScript
Tags: javascript, react, typescript, ux
Published: 2021-11-29 13:37:26

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7of21h7z4nsqimhak00i.jpg)

We often find ourself defining types for the props that are not actually part of that component and are used in some other component.

**_Lets take a simple example:_**
Suppose we have a Parent and a Child component with following props.

```javascript
import React from 'react';
import { Child } from './Child';

type Props = {
  greeting: string;
  firstName: string;
  lastName: string;
};

export const Parent: React.FC<Props> = ({ greeting, firstName, lastName }) => {
  return (
    <>
      <span> {greeting}</span>
      <Child firstName={firstName} lastName={lastName} />
    </>
  );
};
```

```javascript
import React from 'react';

type Props = {
  firstName: string;
  lastName: string;
};

export const Child: React.FC<Props> = ({ firstName, lastName }) => {
  return (
    <>
      <div>{firstName}</div>
      <div>{lastName}</div>
    </>
  );
};

```

⚠️ **Problem Statement:**

**_Repetitive Props_**

- 
Type for `firstName` and `lastName` are also defined in Parent because it needs to be passed down to the Child component. 

**_Code Sync issues_**

- 
If one part changes we need to make sure the others stays in sync.

- 
If the Child component is used in a similar pattern elsewhere we need to make sure we update the props there too.

💡 **Solution:**

We can use ComponentProps to extract the Props directly form the component's type and use rest and spread syntax to avoid repetition.


```javascript
import React, { ComponentProps } from 'react';
import { Child } from './Child';

type Props = ComponentProps<typeof Child> & {
  greeting: string;
};

export const Parent: React.FC<Props> = ({ greeting, ...childProps }) => {
  return (
    <>
      <span> {greeting}</span>
      <Child {...childProps} />
    </>
  );
};
```
**Benefits:**

- Creating the parent's props by merging them with it's child's solves the code sync issues.
- Makes a unique source of truth.

**PS:** _If you only need some of the props in the Child component, you can use Partials._



`#coding #softwareengineering #productivity #webdeveloper #cleancode #codingtips #javascript #webdev #devlife #programming #computerscience`
Week 5 experience time goes up and skills increase
Tags: codeofafrica, awesomitylab, taskforce
Published: 2021-11-29 13:30:52

Hello folks! Time goes up, and skills are booming. This week 5 of Bootcamp at Code Of Africa was excellent and worked hard and never give up on what you started in your passion.

This week's tops were APIs security, logs, and tests. As you see, these topics are exciting and required in software development. Why are these interesting? API security helps us to provide permission for the application's resources by setting up who will be able to access an endpoint and who will not have a right to access the endpoint. Imagine every user in a system has the right to access the admin's activity. Can you feel how it's wild? This is what security can handle. Logs pray a big role in software tracking the actions which are happening at any time, and also it helps to know when any issues happen; then as a developer, you can solve it quickly without taking a long time to find where the issue is. Testing is also an excellent topic which is testing. This helps us to know what API is providing as a response meets our expectations?


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b219bvlqc36gepjyi8iw.jpg)
My team and I, we had a hard time on Tuesday where slept in the morning like 3:30 AM; it was really hard and I experienced a lots

Again, this week was not about only technical but also soft skills, like design thinking and time management. Everyone needs to experience time management in their daily lives. As a software developer, we do not need to stay in coding we also need to learn more about cultural awareness that will help us to work with the client from different cultural by understanding him/her according to his/her culture without judging the client according to his/her culture. This next week I hope, will be more funny and productive.

Thank you for leading. Cheers :)
What‌ ‌are‌ ‌the‌ ‌latest‌ ‌features‌ ‌in‌ ‌Rails‌ ‌7,‌ ‌How‌ ‌important‌ ‌are‌ ‌they?‌
Tags: rails, programming, startup, webdev
Published: 2021-11-29 13:25:47


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n7gqgao71mp7dopr5pce.png)Rails 7 and its numerous enhancements, features, and updates are sure to delight Ruby on Rails fans. This approach can be used to build modern and dynamic web applications without having to write JavaScript; Hotwire is one of the most notable upcoming features of Rails 7. A list of changelogs includes ActiveRecord, ActiveJob, ActiveStorage, ActiveRecord, and others.

The following is a quick overview of the major features relevant to our day-to-day work that you will likely use in Rails 7.


Merged:- Webpack should not be required as part of the default framework of Rails. The import mapped Hotwire allows us to easily switch between Hotwire and Webpack if necessary. There will still be the option to use webpack if you know you will need it (like when using React).  


Retry jobs indefinitely from Rails 7:- Rails' Active Job framework supports asynchronous job declaration and execution on queueing backends. Background jobs can fail for a variety of reasons, including incorrect logic, database errors, network failures, and queue malfunctions. Rails 7 introduces a new option :unlimited, which allows developers to specify an indefinite runtime for a background job. Users of this functionality can be certain that the failure of the job will be resolved eventually.


PreviewError:- Easy-to-use tools are available in the ActiveStorage platform for managing media and storage. A key feature of the platform is preview generation. As a result, Poppler creates files with 0 bytes when previews cannot be generated. When you perform any action on these files, such as resizing, you may encounter a wide variety of unexpected errors. With Rails 7, a previewer child process that exits with a status code other than 0 will raise a new exception named PreviewError. As a result, developers can account for preview errors from the start rather than dealing with unpleasant surprises later.  

ActiveRecord:- A total of 63 modules exist in ActiveRecord::Base.logger. Since it is implemented as a mattr_accessor, instead of a class variable, it cannot benefit from the new performance improvements in Ruby. There has been a substantial improvement using class_attribute :logger - almost 7x! The real world has been able to improve a Rails application very well.


Hotwire is without a doubt the most talked-about new feature of Rails 7 since it has drawn attention from both the Rails community and from other programming communities.
Short oneliners: Create array of hour interval strings
Published: 2021-11-29 13:15:11

This is a way to get an array of hours in a day in the HH:mm format:

```
Array.from({ length: 24 }, (_, k) => k + 6).map(el => `${String(el % 24).padStart(2, '0')}:00`);
```

Result:

```
Array(24) ['06:00', '07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00', '00:00', '01:00', '02:00', '03:00', '04:00', '05:00']
```

We can change the start time by changing the "k + 6" increment amount, or also include the same starting hour in the next day by changing the result length to 25.
ERPNext Nasıl Kurulur?
Tags: python, javascript, webdev, tutorial
Published: 2021-11-29 13:07:15

Selamlar,

İşletmelerin satınalma, satış, sevkiyat, üretim, kalite kontrol gibi süreçlerini ERPNext ile çok kısa sürede yönetmeye başlayabilirsiniz.

ERPNext'i kendi sunucunuza kurmak için aşağıda ki adımları izleyebilirsiniz. 

Notlar:
- Örnekte yeni kurulmuş Ubuntu 20.04 Server kullanılmıştır.
- "frappe" adıyla yeni bir kullanıcı açılmıştır.
- Kurulum esnasında MariaDB Root şifresi, ERPNext Administrator şifreleri sorulmaktadır. 


```
sudo apt update
sudo apt upgrade
sudo adduser frappe
sudo usermod -aG sudo frappe
su - frappe
export LC_ALL=C.UTF-8
sudo apt install python3-minimal build-essential python3-testresources python3-setuptools
wget https://raw.githubusercontent.com/frappe/bench/develop/install.py
sudo python3 install.py --verbose --production --user frappe-logedo --frappe-branch version-13 --erpnext-branch version-13
```

Bütün işlemler tamamlandıktan sonra alınması gereken sonuç:
Bench + Frappe + ERPNext has been successfully installed!

Kaynak: https://kenfavors.com/code/how-to-install-erpnext-on-ubuntu-20-04/

Talep veya beğeni gelirse konuyu derinleştirebiliriz.
Squid Game Website Design
Tags: react, html, webdev, showdev
Published: 2021-11-29 13:00:39

## You can get the template from the link proivided in the description of the video.

### Technologies Used :-
+ React
+ Styled Components

### Libraries and Assets Used :- 
+ React Icons
+ Scroll Reveal

## To learn how to create this template watch the complete video. You can get the template for free from the link provided in the description of the video.

{% youtube 9oqC-Yt26AY %}

## Please do like the video and subscribe to the channel. It helps and motivates me to create more content like this.
My Github Action Hackerthon experience but with a wacky project
Tags: actionshackathon21, actionshackathon, opensource, productivity
Published: 2021-11-29 13:00:03

It was an afternoon when I came across the hackathon announcement. 'This is gonna be fun, I thought. 
Reading the hackathon instructions, I loved the word wacky, sounds fun to me. 

![wildcald](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6pluzmc3wcsdxkj34z3j.png)
 

I checked out what wacky means like a classic googler and it made me more interested

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

oops! I meant wacky 💀

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

"slightly odd"; that's exactly the word I was looking for. 

So what's it's gonna be. **An auto comment feature that you can embed in your Github Workflow.**

### Features of the project

- you can add fun to your open source project and have the single folks trooping in to get some sweet selected love text 😂
- you can include selected memes fun the 10+ year memes experience from the community
- or you can include a custom message.

### Project Initialization

First, I need to set up the coding environment you thought, but writing the love text seems like the most necessary step. 

```jsx
const love_test = [
  "You are the CSS to my HTML.",
  "[me != me]. [me += you].",
  "Are you a computer keyboard? Because you're my type.",
  "Are you an exception? Let me catch you.",
  "Baby you must be Google Glasses, because you augment my reality",
  "Could I have your I.P.?",
  "Here's my number: 0011 0011 1011 0001 0010 1000 0101",
  "I am a Boolean method whose love will always return true.",
  "I googled your name earlier... I clicked on 'I'm Feeling Lucky.'",
  "I think you could be an integral part of my project life cycle.",
  "I'd switch to emacs for you.",
  "You are a field in my class. You will always be protected.",
  "You are my methods. I am nothing without you.",
  "You auto-complete me.",
  "You have nice syntax.",
];
```

These are some tested and trusted lines! They fail every time 😂

Next, I wrote some codes published the action [here](https://github.com/marketplace/actions/auto-commentter). (Honestly, were you thinking I'd paste the whole code here 😏 )

### Results
![love_text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/atdzx08q6kz882thei8z.png)

![meme](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9lz68x0kx204bcd44pa0.png)
 

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


You can view the code in this [repo](https://github.com/zt4ff/auto-commenter). Your contributions are highly welcomed. 
Kindly drop a star too. 😌