teleren/devto huggingface dataset:
Why I Built Mission Control
Tags: webdev, php, laravel, softwaredevelopment
Published: 2023-08-21 19:37:49

I started working on [Mission Control](https://missioncontrolapp.io) in 2017 because I had a brief interview with DataDog who asked me to make them a monitoring tool with PHP. I wrote it, I liked it, I didn't proceed in the interview but I did proceed with working on my own use of the code. I had played with scraping tools and had used apps like PagerDuty, UptimeRobot, New Relic, and Sentry. I totally understood the desire to build apps that solve one problem really well and I think these platforms do that. That being said, I also think that many of the monitoring tools out there fall into one of two categories. They are either over the top and filled with a million features fixing a million problems or are focused on solving one problem with a few features revolving around that main problem. However, I am one developer making this project in my spare time as a tool to solve my problems. I am not DataDog, or New Relic or Sentry, these teams can build incredibly detailed products that will always out feature and out perform what I make and I'm totally fine with that. Since these platforms handle many languages, I thought, what if I focus on PHP only and at that Laravel.

As a member of the general Laravel community, I feel like I'm surrounded by brilliant people who likely already have solutions for this. After all, I remember when Freek Van Der Herten released [Oh Dear](https://ohdear.app) And then shortly after released [Flare App](https://flareapp.io). These are brilliant tools and have inspired some of the details I eventually added to Mission Control. Even Taylor and the team at Laravel added performance monitoring to Forge. So I've sat on Mission Control for a while contemplating why, and whether or not the world really needed this kind of platform anymore. In the grand scheme of things these guys build amazing products and have a great teams, so who am I to build something that "competes" with their features.

After some further thinking, I came to the conclusion that Mission Control isn't really competing with any of the platforms listed above. Platforms like New Relic and Sentry are incredible for large scale projects and Enterprise clients. Flare App is the best Laravel error tracking tool out there, and Oh Dear is the best uptime monitoring tool I've seen in a decade. Forge provisions servers of course its going to offer performance notifications. These tools are all geared just right for their focus.

Mission Control is a simple platform for error monitoring, uptime monitoring, performance monitoring, with custom notifications and custom listeners. I made Mission Control so it can integrate with platforms like the above and help you be in control of the state of your applications. Is Mission Control the best platform out there for this? Nope. But I'll keep trying to make it better one day at a time.
Announcing the Icebreaker Badge! 🧊🔨
Tags: meta, design, badges
Published: 2023-08-21 19:37:04

We're starting off the week right with another badge addition. 🙌

## Introducing the Icebreaker Badge!

![A picture of the Icebreaker Badge... it's a picture of a cartoon ice cube with a big crack in it](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tjiqv808pzs71geyzy9s.png)

**This badge rewards those who regularly leave the first comment on other folks' posts, helping to ["break the ice"](https://www.dictionary.com/browse/break--the--ice) and get discussions going.**

---

### How it works

The best thing you can do to earn this badge is to be the first commenter on a post and leave a thoughtful, engaging comment. While dropping a simple "nice post" is a kind and welcome addition, to get this badge you'll need to put more thought into your comment. We're going to be keeping a particularly sharp eye on [#discuss](https://dev.to/t/discuss) posts as we really appreciate it when folks help initiate discussions there.  Lastly, note that we will not be rewarding folks this badge for commenting on their own posts!

As for logistics, every couple of weeks members of the DEV Team will meet up and pull data on the most frequent first commenters. We'll then manually review those folks, picking out who we believe have shared particularly good ice-breaking comments.   

### Why did we create this badge? 

Like the [Warm Welcome badge](https://dev.to/devteam/introducing-the-warm-welcome-badge-4hnh), we designed this badge to reward folks who help us create a kind, warm, and welcoming community. Being the first to comment on a post helps encourage other folks to open up and share their thoughts too. Comments are an essential part of what makes a community — without you all interacting and sharing ideas on each others' works, this would just be a platform for publishing. So, we really want to reward all those out there helping to break the ice and get conversations flowing.

We're really siked for this badge and hope you are too! If you have any ideas for badges that you think we should add or actions you feel would be worthy of rewarding, don't hesitate to share your thoughts in [this post](https://dev.to/devteam/explore-our-world-of-badges-influence-the-next-addition-1fnf).

**Cheers,
The DEV Team**
A Smarter Way to Write Commits
Tags: git, php
Published: 2023-08-21 19:21:22

Up until a few months ago I wrote my commits the same way most developers do: "Updated README", "Changed the save method", "Fixed issue with links", and all too often "wip". I never really thought much of it, and I'll be damned if I'm going to look through a git log - or so I thought.

My friend Brent Lintner noticed this pattern and suggested I try writing all my commits starting with "because ...". I thought it was brilliant, it was an easy pattern to remember. It makes it clear - for the most part - why I'm submitting the code I'm submitting. Not that I'm expecting many people to read the commits, but sometimes coming back to code, looking at a message of why something is written can be incredibly valuable.

There is however a big limitation in this pattern, and it took another one of my developer friends to point it out. Though it explains why, it really doesn't provide much context. It had never occurred to me that doing so could be valuable. That was until, I had to do a release of a project I work on daily (which currently has about 20 developers working on it). The release process of this app (because it has several business units involved) often requires cherrypicking some commits into the main branch for deployment. While walking through the deployment steps I found myself exploring the git log, where I noticed that my friend Patrick (almostphpamous co-host) always started his commit messages with the ticket he was working on, as he said, it helps him identify what the commits were revolving around. This works wonderfully when exploring the git log, and was exactly what was missing from my commit pattern.

So I've opted to follow my own simple pattern for commit messages.

```
{ticket-number} - because...
```

By utilizing this pattern and following practices of rebasing my code before PRs are issued it keeps my commits in elegant but easy to recognize clusters. These are then easy to visualize if I'm back on deployment doing cherrypicking exploring the git log. It also makes it clear what I was working on and why I wrote or committed that selection of code. There is also some other magic inside this pattern. It provides a clear work history of the tickets I worked on, and often how much work went into each ticket (assuming I'm not doing one commit per ticket). I could easily collect this information from the git log for meetings, client follow ups etc.
Hello (New Artificially Inclined) World
Tags: hellonewworld, webdev, beginners
Published: 2023-08-21 19:21:00

I know its off convention. But I believe we have come a long way in the field of computing. I am a newbie to dev.to, but old enough to understand geeky tech terms. 

Its nice to be part of new space, reach out to techies and get connected by wires and network packets. Will promote human intelligence in this conventional artificial intelligent world.
Indexing JSON Data in MySQL 🐬
Tags: mysql, json
Published: 2023-08-21 19:14:23

In today's data-driven landscape, JSON (JavaScript Object Notation) stands as a pivotal format, offering versatility and agility in representing complex data structures. If you're using MySQL, you're in luck! You can make your data queries faster and more efficient by using indexing. Let's break down the process step by step.

## Step 1: Setting Up the Foundation

To begin, we need a dedicated space to store our JSON data. Let's create a table in MySQL:

```SQL
CREATE TABLE json_data (
    id INT AUTO_INCREMENT PRIMARY KEY,
    data_json JSON
);
```

## Step 2: Adding Some Data

Let's infuse our table with sample data so we can experiment:

```SQL
-- Illustrating Procedure to Generate Mock Data
CREATE PROCEDURE GenerateDummyData()
BEGIN
    DECLARE i INT DEFAULT 1;
    
    WHILE i <= 10000 DO
        INSERT INTO json_data (data_json) VALUES (CONCAT('{"email": "', i, '@example.com"}'));
        SET i = i + 1;
    END WHILE;
END;

-- Invoke the Dummy Data Generation Procedure
-- This Call Should Be Made After the Statement Above.
CALL GenerateDummyData();
```

This procedure generates JSON data with unique email addresses and populates the `json_data` table.

## Step 3: Boosting Performance with Indexing

Now, let's dive into optimizing query speed. When we initiate direct queries on JSON data, we might not get the swiftest results:

```SQL
-- Query Without Indexing
SELECT * FROM json_data WHERE JSON_EXTRACT(data_json, '$.email') = '500@example.com';

| id | data_json |     email_index    |
|----|-----------|--------------------|
|  1 |    500    |  500@example.com   |

```

To make our queries faster, we'll introduce an indexed column:

```SQL
-- Incorporating an Indexed Column for Enhanced Performance
ALTER TABLE json_data
ADD COLUMN email_index VARCHAR(255) GENERATED ALWAYS AS (IFNULL(data_json->>"$.email", 'null_email')) STORED;
```

## Step 4: Expedited Queries

With the indexed column in place, our queries will become quicker and more responsive:

```SQL
-- Optimized Query with Indexing
SELECT * FROM json_data WHERE email_index = '500@example.com';

| id | data_json |     email_index    |
|----|-----------|--------------------|
|  1 |    500    |  500@example.com   |

```

### Conclusion: You're the JSON Jedi Now! 🧙‍♂️

Bam! You've just aced indexing JSON data in MySQL. Your queries are now quick as a flash ⚡, thanks to indexing. JSON data handling just became a whole lot cooler. So go on, rock those databases and impress the data world! 🎸🎉
HTML Semantics to Charsets
Tags: html, design, development, webdev
Published: 2023-08-21 19:00:00

# Comprehensive Guide to HTML: From Semantics to Charsets

HTML (Hypertext Markup Language) is the backbone of the web that allows you to create and display content. In this tutorial, we will explore basic HTML concepts and techniques and practical implementations.

## HTML computer code

When adding code to your HTML content, use the <code> element for internal code snippets:

```
<p> Use the <code> <div></code> element for containers. </p>
```

## HTML semantics

Improve the structure and accessibility of your website using semantic HTML5 elements:

```
<header>
    <h1>Welcome to our site</h1>
</header>
<main>
    <section>
        <h2>About Me</h2>
        <p>Web developers interested in HTML semantics. </p>
    </section>
    <! - ... ->
</main>
<footer>
    <p> Contact me <a href="mailto:contact@example.com"> contact@example.com </a> </p>
</footer>
```

## HTML style guide

Maintain consistent code formatting for readability and continuity:

```
<! - Use lowercase letters for labels ->
<section>
    <h2>Chapter Title</h2>
</section>
<! - Learning to read ->
<article>
    <h3>Article title</h3>
</article>
<! - Double quotes for adjectives ->
<a href="https://example.com">Show example</a>
```

## HTML entities, symbols and puppets

Add special characters, symbols, and emojis using the HTML section:

```
<p><this < </p>
<p> ♥ ♥ </p> meaning
<p>&#128512; represent 😄 </p>
```

## HTML code and URL encoding

Ensure correct symbol encoding and set URL encoding:

```
<! - Show icon set ->
<meta charset="UTF-8">
<! - URL encoding for reserved characters ->
<a href="https://example.com/page?query=Hello%20World"> Visit</a>
```

## HTML vs. Powered by

Understand the difference between HTML and XHTML:

```
<! - HTML5 ->
<p> This is <span style="color: blue;">HTML</span>. </p>
<! - XHTML ->
<p> This is <span style="color:red;">XHTML</span>. </p>
```

HTML is a dynamic language that allows developers to create attractive web content. By mastering these concepts, you'll build websites that are more accessible, structured, and visually appealing.
Using .filter in React
Tags: react, javascript
Published: 2023-08-21 18:39:27

While learning coding in my bootcamp, I found myself stumped by the way .filter works. This blog is both reinforcement of my own learning and will hopefully help prevent someone else from falling into the same holes that I did.

To set up a proper filter in react; first we need state.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0mvrpu06k5v11ma675lz.png)

Using an event handler such as onChange or onSubmit, we update the states search value with the data we are looking for.  
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7ipxv9hwz4dyf73uejwa.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qsddyzwom3d5huimo104.png)

With the event handler in place, we can now create a variable that will house the data we are filtering for.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xrd5h8im52qdrvjguc20.png)

Here, we ensure that we make a copy of our form data as to not accidentally manipulate it permanently in some way. Filter is then written the same way you would write .map as well.

Once we have our data we simply update what react displays.

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

React should now display either all the data or what the filtered results show. If nothing matches the search, react will show nothing.
SQLAlchemy Serializer for Beginners
Tags: python, sql
Published: 2023-08-21 18:39:05

Working with databases and handling data storage in Python can be a daunting task, especially if you're new to programming like I am. Thankfully, there are powerful tools available to make this process much smoother. Enter SQLAlchemy Serializer, a fantastic tool from the SQLAlchemy library that simplifies the way you work with databases. I found myself struggling to grasp this tool so I developed this blog to not only solidify my own understanding but to help those who may have similar struggles.

## Understanding SQLAlchemy Serializer

Before we dive into the details, let's quickly grasp the concept of serialization. Imagine you have a complex Python object, like a dictionary containing various data points. If you want to store this object in a database, you can't just drop it in – databases work with structured data. That's where serialization comes in. It's the process of converting your Python objects into a structured format (like JSON) that can be stored and retrieved easily from a database.

This is where SQLAlchemy Serializer steps in. It's like having a translator between your Python code and the database, ensuring smooth communication and data storage.

Let's say you're building a library management system, and you want to keep track of books. Each book has attributes like title, author, and publication year. Without SQLAlchemy Serializer, you'd have to manually handle the conversion of Python objects to database entries. But with it, you can simplify the process and focus on your application's logic.

## Defining the Model

In SQLAlchemy, a model is a Python class that represents a table in the database. With SQLAlchemy Serializer, you can easily add serialization capabilities to your model. Let's take a look at how you might define a Book model:


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

The SerializerMixin added to the class enables serialization, allowing you to convert instances of this class to a structured format and back.


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

## Conclusion

SQLAlchemy Serializer is an incredible tool that simplifies working with databases in Python, especially for beginners. By automating the serialization and deserialization process, it allows you to focus on building your application's functionality without getting bogged down in the nitty-gritty details of data storage.
Почему yaml c liquibase
Tags: springboot, liquibase, database
Published: 2023-08-21 18:07:18

Пост не про то, что такое liquibase и как с ним работать. В этом посту хочу написать про то, почему именно yaml для liquibase, а не sql, xml или json.

## yaml vs xml, json, sql

Посмотрим на миграцию в yaml (create table) и написанных через json, xml, sql.

`yaml version`
```
databaseChangeLog:
  - changeSet:
      id: 001
      comment: create users table
      changes:
        - createTable:
            tableName: users
            columns:
              - column:
                  name: id
                  type: uuid
                  constraints:
                    primaryKey: true
              - column:
                  name: organization_id
                  type: uuid
                  constraints:
                    nullable: false
              - column:
                  name: name
                  type: varchar(255)
                  constraints:
                    nullable: false
              - column: 
                  name: email
                  type: varchar(255)
                  constraints:
                    nullable: false
```

Не буду описывать версию для xml, json. Версии один в один с yaml вариантом, только больше букв. Также замечу, что xml, json, yaml - они все машиночитаемы, но yaml из перечисленных более человекочитабелен.

Вариант для SQL будет выглядеть так:

```
create table users (
    id uuid,
    organization_id uuid not null,
    name varchar(255) not null,
    email varchar(255) not null
    primary key(id)
);
```
Конечно же меньше букв чем в yaml варианте и читаемо.

А такой текст уже менее читаем
```
insert into users (
  id,
  organization_id,
  name,
  email
) values (
  '7a4efabc-3456-4b0a-8e4b-ead7c5167e29',
  '9d4b0d8b-6fdd-4703-a464-2eed61201c32',
  'John Doe',
  'me@example.com'
);
```

Для наглядности, тот же insert на yaml
```
        - insert:
            tableName: users
            columns:
              - column:
                  name: id
                  value: 7a4efabc-3456-4b0a-8e4b-ead7c5167e29
              - column:
                  name: organization_id
                  value: 9d4b0d8b-6fdd-4703-a464-2eed61201c32
              - column:
                  name: name
                  value: John Doe
              - column:
                  name: email
                  value: me@example.com
```
Букв больше, но намного читабельней. В основном из-за того, что значения находятся рядом с названиями столбцов.

Также плюс к YAML, что он не так сильно привязан относительно БД. При определенных ограничениях, этот же yaml (json, xml) можно применить например к mongodb.

## liquibase для визуальных конструкторов

Вообще считаю, если нужно будет сделать какой-то визуальный конструктор для структуры БД, ну и/или для данных, то liquibase достаточно подходящий продукт.
Navya: Unifying All AI Platforms into One Powerful App – Check It Out!. ( Reducing Prize by 1/10th or FREE )
Published: 2023-08-21 18:01:55

### Introduction to me and motivation behind Navya !

> For more info about me goto https://ashishverse.vercel.app

Hello everyone, I'm Ashish Kumar Verma. Currently, I'm a high school senior in the 12th grade. I recently developed an application called 'NAVYA AI,' inspired by the Sanskrit term 'Navya,' signifying the act of creating something innovative. My main objective in crafting this app was to immerse myself in the realm of generative AI and ascertain my ability to construct my own models that can 'generate content.' I aimed to present this technology in a user-friendly manner, accessible to the general public. This journey led me to delve into various facets, including Android and web development, backend systems, and server management – all of which I tackled independently (although it was demanding, it turned out to be an enjoyable experience). Now Let's get to next part.

### What Did I observed

In the market, there exist several startups engaged in various endeavors like:

- Generating Images: Startup 0
- Creating Videos: Startup 1
- Crafting Digital Talking Avatars: Startup 2
- Generating Voices: Startup 3

I endeavored to unify all of these functionalities onto a single application 🎉🎉. My goal was to offer a user-friendly interface, despite my limited expertise in User Interface design, that would cater to everyone's ease of use. I aimed for simplicity by providing only essential options, as the paradox of choice can sometimes lead to more confusion than clarity.

#### The main problem:
Not everyone was able to leverage, specially who was less digital people because of insanely difficult controls giving bunch of options. Also the major factor was the cost, **for creating avatar of just 15 minutes users have to pay $30, that is quite high !**

So I created Navya AI - https://play.google.com/store/apps/details?id=com.ashishverse.navya

Do try it out and let me know your thoughts and suggestions ! You can Watch these Videos I prepared to understand NAVYA Better, Hope they are not boring ( Also learned video editing in process )

#### What is NAVYA AI

{% youtube v34O4gmS4rQ %}

#### Introducing AI Avatar Feature

{% youtube OJVPYdCMnqA %}


#### How to use it detailed video step by step


{% youtube MEIGNMCxeBs %}


### Thank you !
### Ashish Kumar Verma
Exclusion Constraints in Postgresql
Tags: postgres, apacheage
Published: 2023-08-21 17:59:09

## Exclusion constraints

An `exclusion constraint` is used when comparing two rows on nominative columns or expressions using the nominative operators. The result of the comparison will be false or null.

Consider the following example in which the conflicting tuple is given the AND operation together:

```
warehouse_db=# CREATE TABLE movies
  (
  Title TEXT,
  Copies INTEGER
  );
``` 
Using the `ALTER TABLE` command,we get the following:

``` 
warehouse_db=# ALTER TABLE movies
  ADD EXCLUDE (title WITH=, copies WITH=);
```
We will create an exclusion constraint above the `ALTER TABLE` command. The conditions for a conflicting tuple are `AND` together. Now, in order for two records to conflict, we’ll use the following:

```
record1.title = record2.title AND record1.copies = record2.copies.
```

Next article, we'll consider `primary and secondary key` constraints.