teleren/devto huggingface dataset:
Start or Expand Your DevSecOps Education Journey - Introducing STO Developer Certification
Tags: devsecops
Published: 2023-11-28 01:44:17

As systems grow more distributed, complex, and critical to our daily lives the fog of development starts to set in; no one person has complete end to end visibility into the entire workings of a system. To combat the fog of development, dissemination of expertise across your pipelines is crucial. Security in an application and infrastructure context is a good model of this with the [DevSecOps](https://www.harness.io/blog/devsecops-strategies-secure-applications) movement. 

Software development teams are becoming more tasked with shifting left requirements to produce hygienic software. In the real world, software ages like milk and not like wine, so what was hygienic today might not be hygienic tomorrow. Your CI/CD pipelines are conduits of change and are excellent spots to disseminate expertise and ensure compliance and standards to security posture. 

Harness’s [Security Testing Orchestration or STO module](https://www.harness.io/products/security-testing-orchestration) is purpose built for your pipelines by orchestrating and prioritizing results from a multitude of scanning tools. Most organizations will have more than one scanning tool because tools can be granular or vertical in focus around a few pillars such as intent, language, and distribution. Because of the complexity of modern systems, everyone involved with the development of these systems should take a stake in helping secure these systems. 

Security, Everyone’s Responsibility
-----------------------------------

At Harness, we view security as an important skill to have, we are offering our STO Developer Certification for free so everyone can up-level their DevSecOps skills. Taking a [look at our study guide](https://developer.harness.io/certifications/sto?lvl=developer), will provide a great foundation around application vulnerability management. 

![STO Dev Cert Study Guide](https://assets-global.website-files.com/622642781cd7e96ac1f66807/6564babd68bf98666efe40d1_AthYlz6X34_eoD04EfwaM13Gu87vo0LT8mgzkH0IeITSoXykwScJFcVlE9xrv1Ra0DBf0_TRpgCM_e5rZfCiCFEgBa49UKcQaBOoMd5mGcAM6mcVMzPzT9ay7Mo9qfYMlRNSfTofoljzvxowYWPssWI.png)

STO Dev Cert Study Guide

Because so many components are in modern software today, keeping up with the bill of materials / how components age can be tricky. Harness STO can help you identify and prioritize issues that do need to be addressed. Having Harness STO as part of your pipeline is a prudent capability and being certified in Harness STO is a great skill to have.

Study and Sign Up Today
-----------------------

Getting certified at the developer level on Harness Security Testing Orchestration is a great milestone in your DevSecOps journey. Register for the exam from the [Harness Developer Hub](https://developer.harness.io/certifications/sto?lvl=developer) once you feel comfortable taking the exam. 

\-Harness Product Education Engineering Team

‍

‍Check out the original blog [here](https://www.harness.io/blog/introducing-sto-developer-certification)!
Debuggin en VsCode
Tags: vscode, depurar, tips, developer
Published: 2023-11-28 01:26:50

Para levantar vscode como debugger

Levanta la paleta de comando presionando:

`command + shift + p`

Escribe: 

`npm ...` 

![Ejecución de paleta de comandos en vscode](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hfk533nmre43a302oa3d.png)

Y seleccionar el que dice en ingles (Debug npm script) y en español (Depurar script npm)

Aparecerán estas opciones:

![Selección de script a ejecutar](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/neob1pysx1zx0hyb8c8d.png)

Son los script de ejecución disponibles en tu package.json.

Selecciona el que quieras usar, en mi caso el de desarrollo para depurar..

Vas seleccionando los puntos de interrupción o BreakPoint
![Selección de BreakPoint](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zyl5ouhe5vxagnkllpxh.png)

Y por último ejecuta las acciones en tu aplicación, que se yo entrar a una url, a un path en específico una acción en la aplicación, o ejecuta postman para interactuar con la api... Divierte..


![Como se veria el depurador corriendo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mai12den9yhsy7yj23gg.png)

Ahhh y al final cuando se ejecuta pues te lleva al punto de interrupción... Y con ese menú chiquitito vas interactuando con los puntos.
React + webpack5 + styled components based landing page with adaptive layout
Tags: landingpage
Published: 2023-12-06 09:13:15

---
title: React + webpack5 + styled components based landing page with adaptive layout
published: true
date: 2023-11-28 00:53:00 UTC
tags: LandingPage
canonical_url: https://reactjsexample.com/react-webpack5-styled-components-based-landing-page-with-adaptive-layout/
---

# Hikes landing page
 ![React + webpack5 + styled components based landing page with adaptive layout](https://reactjsexample.com/content/images/2023/11/Code_2023-11_14-48-36.jpg)

React + webpack5 + styled components based landing page with adaptive layout. Optimised WEBP images are generated during the app prebuild stage.

## App start

- Development build:

```
npm run start

```

- Production build:

```
npm run build

```

## Layout template

Thanks guys from [https://verstaem.online/projects/rumtibet/](https://verstaem.online/projects/rumtibet/) for sharing this wonderful template:

[https://www.figma.com/file/NrPZZU8u1sLytOicIHcIAx/%D0%A0%D1%83%D0%BC%D0%A2%D0%B8%D0%B1%D0%B5%D1%82?node-id=1%3A194&mode=dev](https://www.figma.com/file/NrPZZU8u1sLytOicIHcIAx/%D0%A0%D1%83%D0%BC%D0%A2%D0%B8%D0%B1%D0%B5%D1%82?node-id=1%3A194&mode=dev)

![React + webpack5 + styled components based landing page with adaptive layout](https://camo.githubusercontent.com/3136b60e77037be1d38b43cec55caa9e21c6b78da87abf01c675b2e11234d335/68747470733a2f2f696d6775722e636f6d2f53417a764962422e6a706567)

## GitHub

[View Github](https://github.com/amozalev/hikes-landing)
Guide de Publication d'un Site Web Statique sur GitHub Pages
Tags: github, webdev, tutorial
Published: 2023-11-28 00:41:10

## Étapes à suivre

### 1. Créer un Répertoire de Projet

Créez un nouveau répertoire sur votre ordinateur pour contenir votre site web statique. Assurez-vous d'avoir une structure de fichiers appropriée (index.html, css/, js/, etc.).

### 2. Initialiser un Référentiel Git

Ouvrez un terminal dans le répertoire de votre projet et exécutez la commande suivante pour initialiser un référentiel [Git](https://git-scm.com/).

### 3. Créer un Fichier README.md

Créez un fichier README.md dans le répertoire de votre projet. Utilisez ce fichier pour fournir des informations sur votre projet.

### 4. Créer un Fichier .gitignore

Créez un fichier `.gitignore` pour spécifier les fichiers et répertoires à ignorer lors du suivi des modifications avec Git.

### 5. Ajouter et Valider les Modifications

Ajoutez les fichiers de votre projet au suivi de Git et validez les modifications.

### 6. Créer un Nouveau Référentiel GitHub

Allez sur GitHub et créez un nouveau référentiel. Ne cochez pas l'option pour ajouter un fichier README, car vous en avez déjà créé un.

### 7. Lier le Référentiel Local à GitHub

Liez votre référentiel local à votre référentiel GitHub en utilisant les commandes appropriées dans votre terminal.

### 8. Activer GitHub Pages

Accédez aux paramètres de votre référentiel sur GitHub. Sélectionnez la branche que vous venez de pousser, puis cliquez sur "Save".

### 9. Accéder à votre Site Web

Après avoir activé [LadyXena](https://ladyxena.github.io/) Github Pages, votre site web sera accessible à une adresse spécifique.

## Félicitations !

Votre site web statique est maintenant publié sur GitHub Pages. Vous pouvez continuer à ajouter du contenu à votre référentiel local, valider les modifications, et elles seront automatiquement reflétées sur votre site web.
TODO List React Application
Tags: todo
Published: 2023-12-06 09:13:20

---
title: TODO List React Application
published: true
date: 2023-11-28 00:33:00 UTC
tags: Todo
canonical_url: https://reactjsexample.com/todo-list-react-application/
---

# TODO List React Application

## Installation and Launch

1. Clone this repository.
2. Navigate to the project directory.
3. Run `npm install` to install dependencies.
4. Run `npm start` to start the application.

## Features

- Fetches tasks from MockAPI.
- Implements pagination for task display.
- Allows CRUD operations for tasks.
- Custom-designed UI for better user experience.
- State management via Redux/Local Storage.

## Folder Structure

- `src/`
  - `components/`: Contains React components.
  - `redux/`: Redux-related files (if using Redux).

## How to Use

- Add tasks using the ‘Add Task’ button.
- Mark the task as completed or delete using the appropriate buttons.
- Navigate between pages using pagination.

## Repository Link
 ![TODO List React Application](https://reactjsexample.com/content/images/2023/11/Code_2023-11_21-28-09.jpg)

[Git repository link.](https://github.com/EuJinnLucaShow/todo-app)

## GitHub

[View Github](https://github.com/EuJinnLucaShow/todo-app?ref=reactjsexample.com)
Validate email addresses using regular expressions
Tags: python, coding
Published: 2023-11-28 00:29:58

I realized that I can use the regular expression to validate the email address.

The code without AI.

```
def validEmailList(emailList):
    emailList(len(@))
```

After searching and asking AI.

```
import re

def validEmailList(emailList):
    valid_emails = []

    for email in emailList:
        # Validate email addresses using regular expressions
        if re.match(r'^[^\s@]+@[^\s@]+\.[^\s@]+$', email):
            valid_emails.append(email)

    return valid_emails
```
What is import re?

Answer;
re is the library for using regular expressions.
 
Note.

> ^: Indicates the beginning of a line.
> [^\s@]+: Indicates a space or a character other than @ repeated one or more times.
> @: Indicates an @ character.
> \. Indicates a : . Indicates a . character. However, . has a special meaning in regular expressions, so \ is used to escape it.
> $: Indicates the end of a line.
Setting for "Bob made a new post..." notification?
Tags: discuss, help
Published: 2023-11-28 00:24:57

Is there a setting to disable this notification type? 


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

Here are the settings that I have available ... 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/monakssa0g3orua4a1ev.png)
Help with CSS
Tags: html, css, beginners, webdev
Published: 2023-11-28 00:09:09

I am developing landing pages with React and Tailwind CSS.
But whenever I add the Navbar component, the content become overflowed and I have to scroll horizontal and vertical to see all the components. This is my Navbar component.

```
export default function Navbar() {
  return (
    <>
        <nav className="bg-gray-900 border-gray-200 m-0 shadow-md text-black">
            <div className="flex items-center justify-between m-0 h-[87px] p-0">
                <p className="font-extrabold text-white text-4xl font-inter pl-[22px] m-0">Programador123</p>
                <button data-collapse-toggle="navbar-default" type="button" className="inline-flex items-center p-2 w-10 h-10 justify-center text-sm text-gray-500 rounded-lg md:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600" aria-controls="navbar-default" aria-expanded="false">
                    <span className="sr-only">Open main menu</span>
                    <svg className="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 14">
                        <path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M1 1h15M1 7h15M1 13h15"/>
                    </svg>
                </button>
                <div className="hidden w-full md:block md:w-auto" id="navbar-default">
                    <button type="button" className="text-white bg-transparent pr-[22px] hover:bg-gray-100 border border-none focus:ring-4 focus:outline-none focus:ring-gray-100 font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-gray-600 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:bg-gray-700 me-2 mb-2">
                        <div className='pr-[22px] m-0'>
                            <svg className = "w-[35px] h-[35px]" viewBox="0 0 35 35" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <path d="M31.5 0H3.5C1.575 0 0.0175 1.575 0.0175 3.5L0 35L7 28H31.5C33.425 28 35 26.425 35 24.5V3.5C35 1.575 33.425 0 31.5 0ZM25.165 18.725L21 15.4V19.25C21 20.2125 20.2125 21 19.25 21H8.75C7.7875 21 7 20.2125 7 19.25V8.75C7 7.7875 7.7875 7 8.75 7H19.25C20.2125 7 21 7.7875 21 8.75V12.6L25.165 9.275C26.3025 8.365 28 9.17 28 10.64V17.36C28 18.83 26.3025 19.635 25.165 18.725Z" fill="white"/>
                            </svg>
                        </div>      
                        <p className="font-extrabold text-white text-[32px] font-inter">Book Call</p>
                    </button>
                </div>
            </div>
        </nav>
    </>
  )
}
```

Looking hearing from all of you.
Thank you.
Can You Begin a Coding Career at 50?
Tags: discuss, codenewbie, beginner
Published: 2023-11-28 00:00:00

---
published_at : 2023-11-28 00:00 +0000
---
Can you begin a successful software development career at the age of 50? Share your thoughts and experiences.
<br>
Follow the CodeNewbie Org and #codenewbie for more discussions and online camaraderie!
{% embed https://dev.to/codenewbieteam %}
'읽기 좋은 코드가 좋은 코드다'를 읽고
Published: 2023-11-28 00:00:00

---
title: '읽기 좋은 코드가 좋은 코드다'를 읽고
date: 2023-10-17 00:00:00 UTC
published: true
canonical_url: https://www.hyesungoh.xyz/%EC%9D%BD%EA%B8%B0-%EC%A2%8B%EC%9D%80-%EC%BD%94%EB%93%9C%EA%B0%80-%EC%A2%8B%EC%9D%80-%EC%BD%94%EB%93%9C%EB%8B%A4
---

![읽기 좋은 코드가 좋은 코드다](https://github.com/hyesungoh/learningWhatIWant/assets/26461307/c55b2c99-6015-4b3a-beea-58d5e2a0e1c7)

정리한 내용들은 [깃허브](https://github.com/hyesungoh/learningWhatIWant/tree/master/Books/%EC%9D%BD%EA%B8%B0-%EC%A2%8B%EC%9D%80-%EC%BD%94%EB%93%9C%EA%B0%80-%EC%A2%8B%EC%9D%80-%EC%BD%94%EB%93%9C%EB%8B%A4)에서 확인할 수 있다.

## 읽게 된 계기

저자는 구글, 마이크로소프트와 같은 기업에서 수 많은 사람들과 함께 일해 보았는데

읽기 쉬운 코드를 만들기 위해 당연하다고 생각되는 방법들을 지키는 사람들이 10명 중 한 두명이라 말했다.

<br />

무엇이 좋은 코드냐에 대한 생각이 읽기 좋은 코드라는 생각에는 공감하며, 

그런 코드를 만들 수 있는 방법을, 당연하게 생각되는 방법들을 알기 위해 읽게 되었다.

## 읽은 후 느낀 점

바라지도 않았지만, 은 총알 같은 방법이 포함되어 있진 않았다.

<br />

생각지도 못한 방법을 찾았기 보다는

내가 고민하고 실천하려 했던 방법들을 구체화하고 믿음을 굳건히 할 수 있었던 책이라 생각한다.

<br />

현실 세계에서 도움을 많이 받을 것 같은 부분은 두 가지인데, 

읽기 쉬운 코드를 만들기 위해 타인에게 의견을 물어보고 타인의 눈으로 보는 것

그리고 코드를 만들 당시의 생각과 고민을 주석에 녹이는 것도 도움이 될 수 있다는 것이다.
How to deploy in AWS a SpringBoot java maven app with MySQL RDS connection
Published: 2023-11-27 23:27:55


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

This is the DB conf

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d156js7yxuq53tlk1b2q.png)
Basic Game Recommendation software
Tags: gaming, recommendation, codenewbie, beginners
Published: 2023-11-27 23:16:55

As a part of my Codecademy course I am doing, one of my portfolio projects was to use a data structure to store and call data as a part of a recommendation software. I chose to build a master tree, stemming off this are multiple genre tree's and in each of these genre tree's were more tree nodes each with a game and some basic information. 

This could easily be expanded on by adding further information/data into each of the tree's (e.g. could add a purchase link, other reviews, youtube footage of each game, small review etc.). Due to the way the tree's are built the expansion of data and nodes could be limitless.

Please take a look yourself, and if you have any advise to offer please let me know. 

[https://github.com/Nayr91/Codecademy/tree/master/recommendation](https://github.com/Nayr91/Codecademy/tree/master/recommendation)
Character code
Published: 2023-11-27 23:10:21


There was a hint how to solve this coding test so I checked [this site](https://atmarkit.itmedia.co.jp/ait/articles/2101/19/news022.html) and find that I need to lower all of alphabet so I used `s1.lower `.

```
def isFirstStringLarger(s1,s2):
    S1 = s1.lower  
    S2 = s2.lower  

    F1= S1.encode
    F2= S2.encode

    X = F1+F2

    if F1 > F2:
        return True
    else:
        return False
```


When I test that code the result was this.
```
Traceback (most recent call last):
  File "script.py", line 17, in <module>
    print("case0" + str(('true' if (isFirstStringLarger("enim","sequi") == True) else 'false')) + "case0")
  File "script.py", line 6, in isFirstStringLarger
    F1= S1.encode
AttributeError: 'builtin_function_or_method' object has no attribute 'encode'
```
I cannot use `.encode` so I need to find another way to encode the alphabet to ASCII and found that I should write like this.
`encode()`

Copilot code.
```
def isFirstStringLarger(s1, s2):
    # Convert both strings to lowercase
    S1 = s1.lower()
    S2 = s2.lower()

    # Compare the encoded byte strings
    F1 = S1.encode()
    F2 = S2.encode()

    if F1 > F2:
        return True
    else:
        return False

```
After testing the code above, I could not pass this test case.
`isFirstStringLarger("Appearances may deceive","I think so too") `

After checking the code I got this from AI.

```
def isFirstStringLarger(s1, s2):
    s1 = s1.lower()
    s2 = s2.lower()

    # Calculate the sum of ASCII values for each string
    sum1 = sum([ord(c) for c in s1])
    sum2 = sum([ord(c) for c in s2])

    # Compare the two sums
    if sum1 > sum2:
        return True
    else:
        return False

```
I wanted to know the difference between first one and second one.

> The isFirstStringLarger and isFirstLarger functions are both designed to compare two strings and return True if the first string is lexicographically larger than the second string, and False otherwise. However, they use different methods to make the comparison.
> The isFirstStringLarger function converts both strings to lowercase, encodes them as byte strings, and then compares the byte strings using the > operator. This method works because the > operator compares the byte values of the two strings in lexicographic order.
> The isFirstLarger function also converts both strings to lowercase, but then calculates the sum of the ASCII values for each string using a list comprehension and the ord function. It then compares the two sums using the > operator. This method works because the ASCII values of the characters in a string are ordered in the same way as the characters themselves.
> Both methods are valid ways to compare two strings lexicographically, but the isFirstStringLarger method is more concise and efficient because it avoids the need to create a list of ASCII values for each string.

Seems like isFirstStringLarger  method has built-in ASCII conversion function so no need to encode.
Day 841 : Concentrate
Tags: hiphop, code, coding, lifelongdev
Published: 2023-11-27 23:01:15

_liner notes_:
- Saturday : This was the first day back into the station. Felt good. I didn't remember the actual digits to the code to the door, but my muscle memory kicked in and my hand just knew what to press. Had a good time. My co-host wasn't able to make it. I did the show and probably was able to finish getting everything uploaded the fastest I have in a while, so I wrapped up like 2 hours earlier than normal. Spent the night researching my side project. The recording of this week's show is at https://kNOwBETTERHIPHOP.com

![Radio show episode image of the Bandcamp United Union logo that is a drawing of a cassette tape spool with hands shaking with the words Nov 25th 2023 Just Get Up](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1ctu5ohd8k09opaxadee.jpg)

- Sunday : Did my study sessions at https://untilit.works I was able to get a working proof of concept for my side project. Pretty productive day. Ended the night watching the new "Dr. Who" special.

- Professional : Today started off with a hiccup. I had dentist appointment early in the morning. My van wouldn't start. Took another car and made my appointment. On the way back, the car shutdown a couple of times on me. It did start back up and I made my way home. Had a couple of meetings, answered some community questions and did some other work. Kept going till my mouth started to hurt and was it was hard to concentrate. So, I took a nap.

- Personal : Made some progress on my side project. I'm using Cloudflare's Workers AI and made a demo where I enter in some text and generate an image based on it. The demo is based on another demo I saw from someone that works at Cloudflare, but had to change some things to get it working for me. This is like the middle part of what I eventually want to make in my side project. I thought of a couple of things I can add to the workflow to hopefully make things easier.

![View into Opabin Plateau, BC, Canada surrounded by mountains with pine trees in the valley with some lakes.](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4pfk6g0asmqb7ynac078.jpg)

Going to add on to my proof of concept with a couple of things to add to the workflow to make things easier for the user. I think I can also get it done with Cloudflare Workers AI. Now that I got it working on Cloudflare, it shouldn't be too difficult to add some other things because I already have a blueprint. I want to end the night catching up on some anime.

Have a great night!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube ZEPmQgS-HY8 %}