teleren/devto huggingface dataset:
The Journey of Learning Coding:
Published: 2023-09-22 15:00:21



In a rapidly evolving digital age, the ability to code is a superpower. It unlocks the doors to a world of limitless possibilities, enabling individuals to create, innovate, and solve complex problems. For those embarking on the journey of learning coding, it can be both exhilarating and challenging, but the rewards are boundless.

**The Starting Point**

Imagine a person with little to no prior experience in coding. They are drawn to the world of technology, inspired by the idea of building their own applications or websites. This individual begins their coding journey with a sense of curiosity and determination.

**The Basics**

The first steps are often the most daunting. Learning coding involves understanding the fundamentals, such as variables, data types, and basic logic. It's like learning a new language, with its own grammar and vocabulary. However, with the help of online tutorials, coding courses, and dedicated communities, beginners can start to make sense of it all.

**The Power of Problem-Solving**

As our aspiring coder progresses, they discover that coding is not just about memorizing syntax; it's about problem-solving. Every coding challenge becomes an opportunity to think critically, break down problems into smaller, manageable parts, and devise elegant solutions. This skill transcends coding and becomes a valuable asset in everyday life.

**The Joy of Creativity**

One of the most gratifying aspects of learning coding is the ability to create. Our coder begins to build small projects, experimenting with code to see their ideas come to life. They might develop a simple website, design a basic game, or automate a repetitive task. Each achievement fuels their passion for coding and inspires them to dream bigger.

**The Role of Persistence**

Coding is not always smooth sailing. There are moments of frustration, bugs that seem unsolvable, and hours spent staring at lines of code. However, the key to success is persistence. Our coder learns to embrace failure as a stepping stone to success, understanding that every bug fixed is a lesson learned.

**The Community and Collaboration**

Learning coding is not a solitary endeavor. Our coder joins coding communities, attends meetups, and collaborates with others on open-source projects. They discover the power of teamwork and the joy of sharing knowledge. These interactions foster personal and professional growth and keep the passion for coding alive.

**Unlocking Career Opportunities**

As our coder gains confidence and experience, they begin to explore the vast job market for developers. Coding skills are in high demand across various industries, from tech giants to startups, offering exciting career opportunities and the potential for financial stability.
Convert a 2D array to an object in JavaScript
Tags: javascript, webdev, programming
Published: 2023-09-22 15:36:57

Here is a brief tutorial about how to convert JavaScript 2D array to a array of objects.

Here is a array we want to convert:

```
let arrToObj = [
  ["name", "Victor"],
  ["language", "JavaScript"],
  ["country", "Nigeria"],
  ["mood", "Happy Mode"]
];
```

Here is the code to convert the 2d array to an array of objects.

```
const result = arrToObj.map(arr => {
    let obj = {};
    obj[arr[0]] = arr[1];
    return obj
});

console.log(result);
```

The result will be:

```
[
  { name: 'Victor' },
  { language: 'JavaScript' },
  { country: 'Nigeria' },
  { mood: 'Happy Mode' }
]
```
¿Qué es la metodología Kanban y cómo usarla?
Tags: kanban, metodología
Published: 2023-09-22 15:21:27

Originario del país del sol naciente, "Kanban", que se traduce como "señal visual", emergió en los años 40 en Toyota como una estrategia para optimizar procesos productivos. Con el tiempo, esta metodología ha evolucionado y se ha diversificado, hallando cabida en campos como el desarrollo de software y la administración de proyectos. La esencia de Kanban reside en la representación gráfica del trabajo y en el compromiso de evolucionar continuamente.

## Pilares fundamentales de Kanban

**Dibujar el panorama laboral**: Usando un tablero, se esquematizan las tareas en columnas, las cuales simbolizan las fases del proceso. Esta representación facilita la identificación de obstáculos y retrasos.

**Acotar la labor en desarrollo (WIP, por sus siglas en inglés)**: Se establece un tope para el número de tareas que pueden estar simultáneamente en una fase específica. Este control previene saturaciones y garantiza eficiencia.

**Administrar la dinámica**: Se busca mantener un ojo crítico sobre el ritmo y calidad del trabajo, con la mira puesta en refinar la eficiencia y acortar los tiempos de entrega.

**Transparentar las normativas**: Es vital que todas las reglas y lineamientos para cada fase sean claros y conocidos por todos. Esto garantiza coherencia y previsibilidad en la ejecución.

**Ciclos de retroalimentación**: Integra mecanismos que permitan recibir comentarios y ajustar la estrategia de forma periódica.

**Evolución constante**: Kanban anima a estar siempre en busca de optimizaciones y refinamientos en el proceso.

## Pautas para implementar Kanban

**Delinear las fases de trabajo**: Identifica y define las etapas que cada tarea deberá atravesar, por ejemplo: "Ideación", "Desarrollo", "Evaluación" y "Finalización".

**Construir el espacio Kanban**: Puede ser un espacio físico con tarjetas y pizarras o una plataforma digital como Asana o Monday. Cada columna simbolizará un estado del proceso.

**Integrar las tareas**: Cada acción o proyecto se representa con una tarjeta que se sitúa en su fase correspondiente.

**Delimitar la WIP**: Define cuántas tarjetas son permitidas en cada columna al mismo tiempo.

**Desplazar las tarjetas conforme al avance**: A medida que se progresa, las tarjetas cambian de columna, reflejando su nuevo estado.

**Observar y recalibrar**: Es esencial revisar el sistema regularmente para identificar áreas de mejora y ajustar donde sea necesario.

## Reflexiones finales

Kanban, más que una simple herramienta, es una filosofía de trabajo que incentiva la transparencia, la colaboración y la mejora constante. Al adoptar este enfoque, las organizaciones no solo mejoran su productividad, sino que también cultivan un ambiente laboral proactivo y adaptable a cambios. Implementando Kanban, el desafío es mantenerse en constante aprendizaje y adaptación.
AntDB-Oracle Compatibility Developer's Manual P4–10
Published: 2023-09-22 15:20:19

#### Program Security

Security issues involving which users can execute SPL programs, which database objects can be accessed by users who are executing SPL programs, etc. are determined by the following factors.

- The permissions used to execute the program.

- The permissions that have been granted on the database objects (including SPL applications) that an application needs to access.

- Whether the application is defined with definer or invoker privileges.

These are discussed below.

##### EXECUTE Permissions

An SPL application (including functions, procedures, or packages) can begin execution only if any of the following conditions are true.

- The user currently invoking the SPL application is a superuser.

- The user currently calling the SPL application has granted execution privileges to the SPL application.

- The user currently calling the SPL program has inherited the privilege by becoming a member of the group that has the privilege to execute the SPL program.

- The EXECUTE privilege has been granted to the PUBLIC group.

When an SPL program is created in AntDB, the EXECUTE privilege is automatically granted to the PUBLIC group by default, so any user can execute the program immediately.

This default permission can be withdrawn by running the REVOKE EXECUTE command. See the REVOKE command for more detailed information. The following

is an example of this command.

```
REVOKE EXECUTE ON PROCEDURE list_emp FROM PUBLIC;
```

We can explicitly grant EXECUTE privileges on an SPL program to a specified user or group.

```
GRANT EXECUTE ON PROCEDURE list_emp TO john;
```

Now, user john can execute the list\_emp program, but those who do not meet the conditions listed at the beginning of this section cannot execute the program.

A security permission check is required when the program starts executing and then attempts to perform the following operations on any of the database objects.

- Read or modify data from a table or view.

- Create, modify or delete database objects such as tables, views, indexes or sequences, etc.

- Get the current or next value from a sequence.

- Calling another procedure (function, procedure or package).

By restricting the permissions on the database objects, we can control these operations very well.

It is important to note that a database may have several objects with the same name and type, which belong to different schemas in the database. In this case, which object will be referenced by the SPL application? This is what will be discussed in the next section.
Is it essential to integrate Vite with Tailwind ?
Tags: webdev, laravel, tailwindcss, vite
Published: 2023-09-22 15:13:24

I'm developing a simple Facebook clone with PHP Laravel, Tailwind, and JavaScript. I'm wondering if I should use Vite with Tailwind. I know Vite can speed up the app development and deployment, but I'm also worried about possible compatibility and configuration problems. I would love to hear from anyone who has experience with this. Thanks.
AntDB-Oracle Compatibility Developer’s Manual P4–7
Published: 2023-09-22 15:08:42

##### Call Function

Functions can be used wherever expressions can appear in SPL statements. We can call a function by specifying the name of the function and the parameters in parentheses after the name.

name \[ (parameters) ]

name is the name of the function. parameters is the list of actual parameters.

Note: If there are no actual parameters, the function can be called with an empty parameter list, and the parentheses after the function cannot be omitted.

The following example shows how to call a function.

```
select simple_function();

  SIMPLE_FUNCTION  
-------------------
 That's All Folks!
(1 row)
```

The function is usually called in the SQL statement shown below.

```
SELECT empno "EMPNO", ename "ENAME", sal "SAL", comm "COMM",
emp_comp(sal, comm) "YEARLY COMPENSATION" FROM emp;

 EMPNO | ENAME  | SAL  | COMM | YEARLY COMPENSATION 
-------+--------+------+------+----------------------
  7369 | SMITH  |  800 |      |               19200
  7499 | ALLEN  | 1600 |  300 |               45600
  7521 | WARD   | 1250 |  500 |               42000
  7566 | JONES  | 2975 |      |               71400
  7654 | MARTIN | 1250 | 1400 |               63600
  7698 | BLAKE  | 2850 |      |               68400
  7782 | CLARK  | 2450 |      |               58800
  7788 | SCOTT  | 3000 |      |               72000
  7839 | KING   | 5000 |      |              120000
  7844 | TURNER | 1500 |    0 |               36000
  7876 | ADAMS  | 1100 |      |               26400
  7900 | JAMES  |  950 |      |               22800
  7902 | FORD   | 3000 |      |               72000
  7934 | MILLER | 1300 |      |               31200
(14 rows)
```
AntDB-Oracle Compatibility Developer’s Manual P4–6
Published: 2023-09-22 15:04:51

#### Function Overview

A function is an SPL procedure that is called as an expression. When the function is finished running, it returns a value instead of where the function was called in the expression. A function can receive a value in the form of an input parameter from the program that called the function. In addition to returning the value itself, the function can also return the value as an output parameter to the caller of the function. It should be noted, however, that the use of output parameters in functions is not advocated in the actual process of writing programs.

##### Create Function

The CREATE FUNCTION command defines and names a function that will be stored in the database.

CREATE \[ OR REPLACE ] FUNCTION name \[ (parameters) ]

RETURN data\_type

{ IS \| AS }

\[ declarations ]

BEGIN

statements

END \[ name ];

name is the identifier of the function. If \[ OR REPLACE ] is defined and a function with the same name exists in the schema, then the newly created function will replace the existing function with the same name. Conversely, a newly created function cannot replace an existing function in the same schema. parameters is a list of formal parameters. data\_type is the type of the function's return value.

declarations are declarations of variables, cursors or types. statements are the statements used by the SPL application.

The BEGIN-END block contains a section to catch exceptions.

The following is an example of a function that is simple and takes no arguments.

```
\set PLSQL_MODE ON
CREATE OR REPLACE FUNCTION simple_function()
RETURN VARCHAR2
IS
BEGIN
RETURN 'That''s All Folks!';
END simple_function;
/
```

Here is another example of a function with two input arguments. More information about parameters is discussed later in this section.

```
\set PLSQL_MODE ON
CREATE OR REPLACE FUNCTION emp_comp (
p_sal      NUMBER,
p_comm   NUMBER
) RETURN NUMBER
IS
BEGIN
RETURN (p_sal + NVL(p_comm, 0)) * 24;
END emp_comp;
/
```

See the CREATE FUNCTION command for details.
Understanding Stateful vs. Stateless Widgets in Flutter
Tags: flutter, android, programming, tutorial
Published: 2023-09-22 15:00:00

If you're diving into Flutter development, you've likely encountered the terms "Stateful" and "Stateless" widgets. These are the building blocks of your Flutter app's user interface, and understanding when to use each is crucial. Let me break it down for you.

Stateless Widgets
Stateless widgets are, as the name suggests, static and unchanging. They don't store any mutable data. Once you create a Stateless widget, its properties (also called parameters) cannot change. Here's what you need to know:

Immutability: Stateless widgets are immutable. Once you set their properties in the constructor, they won't change during the widget's lifetime.

Build Method: Stateless widgets must override the build method. This method returns the widget that the StatelessWidget represents. This is where you define what your widget should look like.

Example: A button with a static label. It doesn't change based on user interactions.
```
class MyButton extends StatelessWidget {
  final String label;

  const MyButton({required this.label});

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () {},
      child: Text(label),
    );
  }
}

```
Stateful Widgets
Stateful widgets, on the other hand, can change. They have an associated mutable state object that can be modified. Here's the lowdown:

Mutable State: Stateful widgets can hold data that might change during the widget's lifetime. You can call setState to trigger a rebuild with new data.

Build Method: Like Stateless widgets, Stateful widgets also have a build method. This method returns the widget based on the current state.

Example: A counter that increments when you tap a button.

```
class MyCounter extends StatefulWidget {
  @override
  _MyCounterState createState() => _MyCounterState();
}

class _MyCounterState extends State<MyCounter> {
  int count = 0;

  void incrementCounter() {
    setState(() {
      count++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text('Count: $count'),
        ElevatedButton(
          onPressed: incrementCounter,
          child: Text('Increment'),
        ),
      ],
    );
  }
}

```

When to Use Which?
Use Stateless Widgets when your widget doesn't need to change after being built. They're efficient and straightforward.

Choose Stateful Widgets when your widget's content needs to change dynamically based on user interactions or other factors.

In Flutter, combining Stateless and Stateful widgets efficiently is key to building responsive and interactive user interfaces. Now that you're armed with this knowledge, go ahead and craft amazing Flutter apps! 🚀📱 #FlutterDev #StatefulVsStateless

Video: https://youtu.be/LN_7wjeDZiU
HTML Tip: Theme Colors
Tags: html, webdev, tutorial, video
Published: 2023-09-22 14:55:54

---
title: HTML Tip: Theme Colors
published: true
description: Learn about the theme-color meta tag and how it can help customize your website (with a 1-minute video)
tags: html,webdev,tutorial,video
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/74x3i3y8o128qtiiykrw.jpg
canonical_url: https://alvaromontoro.com/blog/68041/html-tip-theme-color
---

Here’s a quick video with a demo of theme color in action and how to use it. Below, there is a description (it’s basically a “transcript” with additional details).

{% youtube https://www.youtube.com/watch?v=pCBaU1XQm4U %}

----

You have a website. You can style it in many ways, but the address bar and the toolbar break the flow. They stand out and don’t match the design. That’s because they are part of the browser itself, and you don’t have control over them… or do you?

**[Theme colors](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta/name/theme-color) to the rescue!**

Place the following code in the `<head>` (and change the `content` attribute to match the color you want):

```html
<meta name="theme-color" content="#cc99cc">
```

If the browser supports theme colors, it will turn the top bars of the specified color (on mobile) or use the color to paint the background in some cases.

**Notice that this behavior may change from browser to browser** as the HTML standard doesn’t specify how to use the color; it only suggests that browsers should use it to highlight the page or the surrounding interface.

Some information about `theme-color`:

- Most mobile browsers (and some desktop browsers) support it!
- It doesn’t impact your page if it’s not supported; the browser will look the same as it usually does.
- It comes with automatic accessibility: if you pick a dark color, the text will automatically be light (and vice versa), ensuring that there will be enough color contrast for accessibility.
- It can be combined with the media attribute to specify different colors for different situations.

One example of that last point. You could have the following code:

```html
<meta name="theme-color" content="#cc99cc">
<meta name="theme-color" 
      media="(prefers-color-scheme: dark)" 
      content="#000">
```

Then, the UI will be purple by default (#cc99cc), and it will change to black (#000) if the person has activated the dark mode in their system.
Simplifying Test Automation with Selenium Framework
Published: 2023-09-22 14:36:33

## Introduction

Test automation might sound like a complicated term, but it's really just a way to make testing software easier and more reliable. One important tool for test automation is the Selenium framework. In this blog post, we'll break down what the Selenium framework is and how it helps in automating tests for websites and applications.

## What is Selenium?

Selenium is like a super-smart robot that can help you test websites and apps. It's not a physical robot; instead, it's a special software that can click buttons, fill out forms, and check if everything on a website works as expected. You tell Selenium what to do, and it does it for you, just like a helpful assistant.

## How Does Selenium Work?

Think of Selenium as a set of instructions or rules that tell your computer what to do when testing a website. Here's how it works in simple terms:

**Open the Browser:** Selenium can open a web browser like Chrome or Firefox on your computer.

**Visit a Website:** You can tell Selenium which website or webpage to go to. It's like giving it directions to a specific place on the internet.

**Click and Type:** Selenium can click on buttons, links, and fill in forms, just like you would when using a website.

**Check Things:** Selenium can also check if something is on a webpage, like making sure a specific word or image is there.

**Report Back:** After doing all these actions, Selenium can tell you if everything worked okay or if there were any problems. This helps you know if your website or app is working correctly.

## Why Use Selenium?

**Selenium** is handy because it saves a lot of time and effort. Here's why it's a helpful tool:

**Repeatable Tests:** You can use Selenium to do the same tests over and over again, which is great for checking if your website works after each change.

**Speed:** Selenium can do tests much faster than a human, so you get results quickly.

**Consistency:** It does things exactly the same way every time, so you don't have to worry about human errors.

**Coverage:** Selenium can test lots of parts of a website, making sure nothing is broken.

**Integration:** You can use Selenium with other tools that help you build and release software, making it part of your development process.

## Conclusion:

Selenium is like a computer assistant that can test websites and apps for you. It follows your instructions to open browsers, visit websites, click on things, and check if everything is working. This saves you time, makes testing consistent, and helps you catch problems early. So, if you want to make sure your website or app works well, consider giving Selenium a try. It's like having a smart helper by your side in the world of test automation.
JavaScript vs. TypeScript for Open Source: Seeking the Community's Thoughts 🤔
Tags: webdev, javascript, react, opensource
Published: 2023-09-22 14:35:58

Hey there, fellow devs!

We're at a crossroads with our open-source project, [Webcrumbs](https://github.com/webcrumbs-community/webcrumbs), and would love your perspective. We're deliberating between JavaScript and TypeScript, and while we're leaning in a direction, we're curious to know the community's thoughts.

Some initial pros and cons that come to mind:

### JavaScript:

**Pros**:
- Widespread adoption and massive community.
- No additional setup required.
- Immediate browser compatibility.

**Cons**:
- Dynamically typed, which can lead to potential type-related issues.
- Might lack some advanced features for larger applications.

### TypeScript:

**Pros**:
- Static typing can catch potential type-related bugs during compile time.
- Can use all of JS's features plus additional TS ones.
- More structured, which could be beneficial for large projects.

**Cons**:
- Requires a compilation step.
- Might have a steeper learning curve for newcomers.

Which do you think would be better for Webcrumbs, considering the following features:
- **Plugin Platform**: Integrate and manage React plugins to extend functionality effortlessly.
- **No-Code Admin Panel**: Control every aspect of your website from a robust admin interface, no coding needed.
- **Fully Customizable**: Developers can tailor Webcrumbs according to specific needs.
- **Open Source & Free**: Webcrumbs is committed to being an open-source, community-driven project.

Additionally, if you believe in the project's mission, we'd love your support:

1. **Star the Repository**: Show your support and help us gain more visibility by starring ⭐️ the repository. [Star Webcrumbs on GitHub](https://github.com/webcrumbs-community/webcrumbs).
2. **Join the Discussions**: Your opinions and ideas matter. Participate in ongoing discussions or start a new one. [Go to Discussions](https://github.com/webcrumbs-community/webcrumbs/discussions).
3. **Check Open Issues**: See what issues are open and where you can contribute. [View Open Issues](https://github.com/webcrumbs-community/webcrumbs/issues).
4. **Read the Contributing Guide**: Get all the information you need about how to contribute. [Read Contributing Guide](https://github.com/webcrumbs-community/webcrumbs/blob/main/CONTRIBUTING.md).

Looking forward to your insights! 💡