teleren/devto huggingface dataset:
2024, me voilà ! 🤩
Tags: devresolutions2024, opensource, career
Published: 2024-01-06 00:31:29

<!-- ✨ Feel free to customize this template to suit your needs—adjust the title, structure, and wording as you see fit! ✨ -->

### Professional Goals

Since April 2023, I'm a freelancer as a web developer, new to the professional domain, but not in web dev. 

My objective is simple, get more clients AND collaborations. I think that **local collaboration is essential** in this environment. I know that **I can't do everything**, at least not as professionally as a photographer, for example. So **working with other people who aren't necessarily developers can only be beneficial**. 

And yes, having more customers is the goal of any business. But I'd also **like to diversify my creations**, to give more value to those who ask for it through their website. To **make a page accessible and attractive that provides enough information** for the customer/visitor to feel they're in **the right place**.

### Personal Goals

I already posted some goals at my life update of 2023,

{% embed https://dev.to/thomasbnt/my-life-update-and-the-open-source-devimpact2023-41h1 %}

But I'll mention it again here:
- `🔨` Continue to update [my Discord bot](https://mrrobot.app) - [@mrrobot on DEV](https://dev.to/mrrobot)
- `📄` Learn more English 
- `🎹` Play more pianooo 
- `🚀` Contribute more [to the Open Source](https://github.com/thomasbnt) 
- `📹` Stream more [on Twitch](https://www.twitch.tv/thomasbnt) 
- `📚` Write more here and on [my personal blog](https://thomasbnt.dev/blog) 

### DEV Community Contributions

On DEV, I would like to publish more posts, and continue to moderate bad accounts and posts. ✨
Day 889 : Focus
Published: 2024-01-06 00:28:28

_liner notes_:
- Professional : Today was a half day. Knowing that, I worked on fixing a new feature on the POC for an hour and got it done. I came in this morning thinking I would just need to do one more thing and finish in time for the half day and enjoy an early weekend. I opened my laptop and started working on my POC. It wasn't until I clicked save that I realized that I did the fixes last night on another computer and the code on my work laptop was old and when I clicked save, it overwrote what I did. Awesome. So basically I had to redo what I did. Just had to sit down, focus and remember what I did. Took like an hour and a half, but I got it working again. Worked on the final feature I planned to finish before the end of the week. About an hour later than I wanted, I was able to get to a good stopping point. 

- Personal : Last night, I put together tracks for the radio show. Put them in a playlist and created the social media posts. Did a little work on my side project. Got caught up with "Zom 100". Not a bad night.

![Shot from the shore looking at the Brooklyn Bridge in NY, United States and night with the city in the background](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uqduyub449u2oxw4wk4n.jpg)

Going to finish up working on the radio show. Do some research on Scroll Driven Animations and work on my side project. I'll probably start watching "Blue Eyed Samurai" on Netflix. My show co-host was telling me it was good. Going to eat and get to work. Radio show on Saturday (https://kNOwBETTERHIPHOP.com) and study sessions on Sunday (https://untilit.works)

Have a great night and weekend!

peace piece
Dwane / conshus
https://dwane.io / https://HIPHOPandCODE.com
{% youtube 7HGs1xheHno %}
Phase 1 at Flatiron (JavaScript)
Published: 2024-01-06 00:21:04

**Phase 1 quick summary:**

The start of my first phase at Flatiron School has been quite the experience. The first week was overwhelming to say the least due to the amount of JavaScript that we had to learn in such a short period of time. 

Then during the second week, everything started to click as we were applying the concepts such as arrays, objects, functions, etc. into our practice labs. 

Going into the 3rd week, working on the website project was an exciting challenge that tested me on what I learned with JavaScript and CSS and being able to create a functional website, made it all the worthwhile.


**What I learned:**
Within my phase-1 experience, there were many different concepts that I learned within JavaScript and CSS. Below is one thing I have learned that I felt what was most intriguing and stood out during my journey through JavaScript for phase-1.


**.addEventListener():**

One of the most useful codes that I have learned has involved using an .addEventListener(). This form of method uses an "event", which will then trigger a callback function or object. When the event is used, then it will perform the action that the developer intended. Some of the events that are used for event listeners are submit, click, etc. As most users would recognize from some of the example events, submit would be the event that is using information a user enters in a form and is submitted. Click occurs when a user clicks an element within the webpage, like clicking a link within the webpage and being sent to the link that has been clicked.


**For example:**


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


 
Through the example from my phase-1 project with an event listener, this event listener will submit a new form adding a new character into the array of current characters for our website.
We start with a variable in order to target the form. Then we use that variable and add the .addEventListener(). Within the event listener, we used the "submit" event and added a function that targets "e". The e.preventDefault() is placed for "submit" events in order for the page to not refresh. 

Then we create another variable for the new character that needs to be added an create an array with objects with the information of the character. After, we make a new array by putting the new character before the existing characters from the API with spread syntax. The newCharacter variable is placed into our renderCharacters function, which the function will show the information for our new character in our website.


**Wrap-up:**

Just from this one example, it shows how important event listeners are for the daily user experience with simple tasks. Such as submitting information for creating an account or clicking on images/links to access more information.
A log of errors
Tags: documentation, tips, devtips, productivity
Published: 2017-11-15 21:31:07

---
title: A log of errors
published: true
description: 
tags: documentation, tips, devtips, productivity
---

Let me start with a confession. I really love the dev.to community. There are not a lot of developer communities, that are so kind and friendly.

But why this tribute to the community? Because it was a community member who told me about the idea, that I will write about. It was [Joseph Jude](https://dev.to/jjude) who commented on the article [Take Notes on Everything](https://dev.to/maxwell_dev/takes-notes-on-everything-3io) by [Max Antonucci](https://dev.to/maxwell_dev). Joseph commented, that he keeps a log of every error (and the corresponding solution) he gets while developing. **What a great idea**!

It's a shame, how often I have to google the same error message or bug, that I googled a couple of months ago. The idea of an "error log" is just awesome. 

## Format

I use markdown. Why? Because I love markdown. It is a simple and powerful markup language. It's easy to insert code snippets, images, links and much more.

And if you use a good editor, like [MarkdownMonster] (https://markdownmonster.west-wind.com/) or [VS Code] (https://code.visualstudio.com/) , it's even more fun. 

### Markdown Template

I created myself a little template for every error I log. It consists of 
- a title 
- a few tags (to make it better searchable)
- a description of the problem
- a description of the reason/cause of the error 
- and of course the solution to it. 

It looks like this:

```
## Title (for example an error message)

**Tags**:

> these, are, my, tags, for, the, search

### Problem

A short description of the problem/bug/error. 
In most cases it contains the situation 
in which the error occurs 
and the error including the stacktrace.

### Reason

Why did the error happen?

### Solution

What's the solution for this problem?

```

## Where to keep it

I wanted to have this error log accessible from almost everywhere. That's why I use GitHub. 

GitHub also provides a pretty good search functionality. That helps a lot.

Of course you can just use a simple directory structure on your disk and sync it to your Dropbox, or something like that. But for me, GitHub was an excellent choice. 

## Summary

I said it before and I will say it again: all credit goes to [Joseph Jude](https://dev.to/jjude). I learned that from his great comment. 

Please let me know what you think. Do you already keep an "error log" or maybe something similar?
Interview Mastery: Lessons from Mistakes?
Published: 2024-01-06 00:00:00

---
published_at : 2024-01-06 00:00 +0000
---
Share the interview mistakes you've learned from and corrected. What lessons can others apply to improve their performance in future interviews?
<br>
Follow the [CodeNewbie Org](https://dev.to/codenewbieteam) and [#codenewbie](https://dev.to/t/codenewbie) for more discussions and online camaraderie!

*{% embed* https://dev.to/codenewbieteam *%}*
Do You Have a Mantra That Guides You?
Published: 2024-01-06 00:00:00

---
published_at : 2024-01-06 00:00 +0000
---
Define a personal coding philosophy or mantra you developed in 2023. How does this guiding principle shape your approach to coding and community engagement?
<br>
Follow the DEVteam for more discussions and online camaraderie!
{% embed https://dev.to/devteam %}
interactive planners vs interactive pantsers
Tags: gamedev, writing
Published: 2024-02-25 21:27:31

---
title: interactive planners vs interactive pantsers
published: true
date: 2024-01-06 00:00:00 UTC
tags: [ 'gamedev', 'writing' ]
canonical_url: https://onwriting.games/daily/20240106-187-interactive-planners-vs-interactive-pantsers/
---

Is there room in interactive narrative for the planners vs pantsers dichotomy?

With the narrative complexity presented by the rhizome, the discussion of **planners vs pantsers becomes kinda outdated**.

While there may be different types of systems to which planners and pantsers can orient themselves (rigid structures for planners, and perhaps more organic and random elements for pantsers), we will **never succeed in finishing a game without planning**.

At the same time, I am convinced that the **best ideas arise from free writing** , a practice that belongs mostly to pantsers.

Therefore, I believe that in interactive narrative, in one way or another, there needs to be a **symbiosis between both approaches to writing**.

That is why, if you identify with one of these groups, one should start listening and delving into the methods of the other, to see if this facilitates progress in your game.

But in the end, the key is always the same, even if it gest boring: test and playtest!
Newsletter Repost - OpenLampTech issue #112
Tags: mysql, php, programming, webdev
Published: 2024-01-05 23:16:33

Manage MySQL databases with PHP | MailerGlue | MySQL health checks | Drupal microsites | JavaScript support in MySQL.

---

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

---
Be sure you are [subscribed to OpenLampTech](openlamptech.substack.com) so you don't miss any of the great content published each week!
Understanding React Routing Using React Router
Published: 2024-01-05 22:55:10


**React Router**: React Router is a library for handling navigation in a React application. It enables the navigation of different components in a React application, making it possible to create a Single Page Application (SPA) where the page doesn't reload when navigating between different views.

## Exploring Page Navigation with React Router: A Practical Guide

In this blog post, I'll guide you through the process of seamlessly navigating between pages using React Router.

## Getting Started: Setting up a React Application with Vite JS

To begin your journey, let's create a new React application using Vite JS. Open your terminal and enter the following command:

```
npm create vite@latest
```
You will be prompted to choose a few things, make sure that you choose react and javascript.

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

## The React Router Experience

Once your React application is up and running, we'll dive into the world of React Router. Learn how to efficiently move between pages, enhancing the user experience of your application.

# Ready to embark on this journey? Let's get started!

After the project has been created, install the dependencies and open it on the vs code or the code editor of your choice. 

```
cd react-navigation
npm install
code .
```

When the project is opened on your code editor, install react-router using the following command 

```
npm install react-router-dom
```
When its completed, navigate to `App.jsx` and write the code in this image.


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


Here we are importing `Link` from `react-router-dom`. `Link` is similar to an `a` tag and is used in navigation.
Then open the `src` directory and create a folder and name it as `pages`.

Inside `src/pages` create a file name it `About.jsx` and write the code in this image.

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

Navigate to `main.jsx`. This is where we will set up our navigation.
To start, we will have to

1. import `About` from `./pages/About.jsx`.

```
import About from "./pages/About.jsx";
```

2. import `createBrowserRouter` and `RouterProvider` from `react-router-dom`.

```
import { createBrowserRouter, RouterProvider } from "react-router-dom";
import About from "./pages/About.jsx";
```
3. Create our router

```
const router = createBrowserRouter([
  {
    path: "/",
    element: <App />,
  },
  {
    path: "/about",
    element: <About />,
  },
]);
```
We use `createBrowserRouter` to create our routes which accepts an array of objects each having a `path` and an `element`

4. Replace `<App />` inside the `<React.StrictMode></React.StrictMode>` with `RouterProvider` and placing the `router` inside it.
```
<React.StrictMode>
    <RouterProvider router={router} />
</React.StrictMode>
```
![Main.jsx image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g5f9yrelqbydf6py0z7e.png)
TRACING AND RECOVERY LOST CRYPTO FROM SCAMMERS ONLINE
Published: 2024-01-05 22:31:52

The world of cryptocurrency is a thrilling rollercoaster: soaring highs of potential, heart-stopping dips of volatility, and the ever-present hum of uncertainty. While the rewards can be immense, the risks are equally daunting, none more so than the chilling prospect of losing your hard-earned digital assets. This is where Daniel Meuli Web Recovery steps in, not just as a technical savior, but as a beacon of hope in the digital abyss.
My story is unfortunately familiar. A seemingly innocuous phishing attack, a moment of carelessness, and my digital wallet, once brimming with promise, lay empty. The pit of despair was bottomless; the fear of financial ruin was paralyzing. Desperation led me down a rabbit hole of online forums and recovery "experts," each promising a solution, each leaving me with a deeper sense of helplessness. Then, I stumbled upon Daniel Meuli Web Recovery. Their website, unlike the others, exuded a quiet confidence, and a sense of professionalism that resonated with my desperation. The testimonials, heartfelt and genuine, offered a glimmer of hope, a fragile spark in the darkness. I reached out to them @ Danielmeuliweberecovery @ email . com & TELEGRAM  @DANIELMEULI with a hesitant plea for help, and was met not with skepticism, but with genuine empathy and a meticulous understanding of my predicament. The recovery process itself was a masterclass in efficiency and transparency. Every step was explained in clear, concise terms, and my questions were answered with patience and understanding. The Daniel Meuli Web Recovery team never sugarcoated the challenges, but they never wavered in their determination to find a solution. Days turned into weeks, each update a nail-biting cliffhanger, until finally, the news arrived: my cryptocurrency, every precious Satoshi, had been recovered. The relief was overwhelming, a tidal wave of gratitude washing away the months of anxiety. But beyond the sheer joy of regaining my assets, it was the human touch that truly resonated. Daniel Meuli Web Recovery wasn't just a recovery service; they were my digital lifeline, my unwavering support system in a time of crisis. My experience demonstrates Daniel Meuli Web Recovery's unwavering devotion to their clients as well as their technical expertise. They are aware of the psychological effects of losing cryptocurrencies, including the terror and despair that can overcome even the most experienced investor. They tackle every case with kindness and commitment, viewing each missing currency as a personal issue that must be solved.
15 Most Watched Frontend Conference Talks In 2023
Tags: webdev, javascript, programming, frontend
Published: 2024-01-05 22:31:19

Hi everyone 👋!

I've recently been heavily into watching conference talks as a conferences seem to be back after pandemic.

At some point, I was looking for the most watched talks across different conferences and meetups to better understand the overall trends. Having this data lets me find talks I wouldn't find otherwise.

Finally, based on that data, I put together a list of the most watched Frontend conference talks in 2023. These include topics like Javascript, Typescript, React, testing, webassemly and more!

I hope you enjoy it ⭐️!

# 🏆 Most Watched Frontend Conference Talks In 2023

1. ["Locknote: How JavaScript Happened: A Short History of Programming Languages - Mark Rendle"](https://youtube.com/watch?v=hEdzaIa4Heg)
2. ["Josh Goldberg - Setting Up ESLint and TypeScript for React"](https://youtube.com/watch?v=sSJBeWPIipQ)
3. ["Deep Dive into Advanced TypeScript: A Live Coding Expedition - Christian Woerz - NDC Oslo 2023"](https://youtube.com/watch?v=5woZK_3z25U)
4. ["The Economics of Programming Languages" by Evan Czaplicki (Strange Loop 2023)"](https://youtube.com/watch?v=XZ3w_jec1v8)
5. ["Your website does not need JavaScript - Amy Kapernick - Copenhagen DevFest 2023"](https://youtube.com/watch?v=wKU65gV6FSA)
6. ["What can't WebAssembly do?" - Katie Bell (PyCon AU 2023)"](https://youtube.com/watch?v=JbZAsSzzk0E)
7. ["Has TypeScript became the villain he was once supposed to conquer? - Paweł Borecki - code::dive 2023"](https://youtube.com/watch?v=55JsOq1iZzk)
8. ["Modern Frontend on ClojureScript and React in 2023" by Yuri Khmelevsky](https://youtube.com/watch?v=lvsAqVIeRAQ)
9. [Architecting Fortresses: A Deep Dive into Advanced Security Measures for ReactJS Apps - Jim Manico](https://youtube.com/watch?v=PyLE8ujGQMg)
10. [Build Your Mental Model of React’s Rendering Behavior - Charlotte Isambert | React Native EU 2023](https://youtube.com/watch?v=-x2HdZ5unH4)
11. [Theo Browne – Simple by default (Chain React 2023)](https://youtube.com/watch?v=dXDxa9YdqFA)
12. [Bjorn Lu - The Complete Guide to packaging Libraries - Vuejs Amsterdam 2023](https://youtube.com/watch?v=Pf-N8WGu7iQ)
13. [Marc Backes - Let's Build A Virtual DOM - Vuejs Amsterdam 2023](https://youtube.com/watch?v=bzYFCDz817I)
14. [Dan Neciu - Modern Testing Practices in Frontend Applications - JSWORLD 2023](https://youtube.com/watch?v=VN77l9jkCl4)
15. [Markus Oberlehner - Writing (Really) Good Tests - Vuejs Amsterdam 2023](https://youtube.com/watch?v=zPGJ4DL4d6A)

On a side note, I'm building a newsletter on Substack called [**Tech Talks Weekly**](https://techtalksweekly.substack.com) where I'm sending a weekly email with recent trending conference talks. If you're into watching the talks, you might be interested!
Full Stack Odyssey(Part1)
Tags: webdev, beginners
Published: 2024-01-05 07:15:50


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

#### Before we dive into topics, we need two pieces of software
1. Web Browser

2. Code Editor

After writing the code in the code editor, a web browser is needed to view the website.

**What is HTML?**

HTML is an acronym which stands for **Hyper Text Markup Language** which is used for creating web pages and web applications. This is the tool we use to create Websites.

**Hyper text** means a text has a link within it.

**Markup Language** is a system of annotating a document to describe its structure and presentation. It uses tags or codes to define elements such as heading, paragraph, lists, images, links and more.

**What is web pages, website, web application?**

**Web Pages:-** It is a document which is commonly written in HTML, which can be displayed in a web browser such as Firefox, Google Chrome, Apple Safari, Microsoft edge.

**Website:-** It is a collection of web pages and related content that is identified by a common domain name and published on at least one web server.

**Web application**:- A web application (or web app) is application software that is accessed using a web browser.
Vaga - DevOps Engineer
Tags: devops, vaga, oportunidade
Published: 2024-01-05 21:22:05

Junte-se a nós para liderar a revolução tecnológica como Engenheiro DevOps. Seu papel será essencial na integração e automação de ferramentas de monitoramento como Datadog, Splunk, Dynatrace e muito mais. Com conhecimentos avançados em Docker, Kubernetes, AWS e linguagens como Python, Shell Script e Groovy, você será o arquiteto da transformação. Se busca desafios, crescimento e impacto real, candidate-se agora mesmo!

**Requisitos:
**

- Experiência em administração e integração de soluções de monitoramento e observabilidade.
- Domínio em Docker, Kubernetes, AWS (EC2, DynamoDB, Lambda, RDS PostgreSQL, WAF).
- Conhecimento profundo em Linux e suas configurações.
- Fluência em Python, Shell Script e Groovy para automação e integração.
- Familiaridade com processos de governança de TI e modelo AIOps.

**Diferenciais:**

- Aptidão técnica na arquitetura técnica e habilidades multidisciplinares.
- Experiência em criação de soluções via APIs para integrações.
- Capacidade de aprendizado rápido e adaptação a novas tecnologias.
- Habilidade em articular e direcionar discussões entre negócios e tecnologia.