teleren/devto huggingface dataset:
Tailwind CSS basic usage
Published: 2023-08-16 10:21:57

**Tailwind CSS ** is an open source CSS framework. It enables us to implement CSS in our application in a much simpler way. The way it does this is by giving us utility-classes(meaning you just have to name a class accordingly to implement a specific style in a component or element and does not have to define the style completely write the style for that component or element). This will be cleared by seeing the examples below.
      Tailwind CSS differs from different frameworks like Bootstrap in the way that in Tailwind, utility classes are build upon style elements unlike in Bootstrap where utility-classes are build upon components. Like 'bg-blue-400' gives style blue background style when applied on an element like button where as in bootstrap, we write '<button type="button" class="btn btn-primary">Primary</button>' which gives an already defined button with specific style. So, this enables us to more specifically design our component while writing our html in our own way.
     Here are some basic utility classes which are used to implement CSS property in our project.

**1. Margin and padding -** 
Tailwind CSS Classes: m-{size}, p-{size} 
```
<div class="m-4 p-6 ">Lorem ipsum dolor sit amet</div>
```

**2. Width and Height -**
Tailwind CSS Classes: w-{size}, h-{size}
```
<div class="w-64 h-32 "></div>
```

**3. Background and Text Color -** 
Tailwind CSS Classes: bg-{color}-{strength}, text-{color}
```
<div class="bg-green-300 text-white">Colored Content</div>
```

**4. Font size and font weight -**
Tailwind CSS Classes: text-{size}, font-{weight}
```
<p class="text-lg font-semibold">Large Bold Text</p>
```

**5. Borders and Border Radius -**
Tailwind CSS Classes: border, border-{size}, rounded, rounded-{size}
```
<div class="border border-gray-400 rounded-lg ">
  Bordered and Rounded
</div>
```

**6. Positioning -**
Tailwind CSS Classes: top-{size}, right-{size}, bottom-{size}, left-{size}
```
<div class="absolute top-0 left-0 ">Top Left</div>
```

**7. Flexbox -**
Tailwind CSS Classes: flex, inline-flex, flex-{direction}, flex-wrap, justify-{content}, items-{alignment}
```
<div class="flex justify-center items-center ">
  Centered Content
</div>
```



  These are some of the basic CSS properties. If you want to know about more properties, go to tailwindcss.com and search for the property you need to implement.
Deploy Docker Application to Virtual Machine Using Github Actions (CI/CD)
Published: 2023-08-24 02:52:20

<p>Hi there! A quick question. Have you ever been unexpectedly productive during weekend? I remember spending all day doing a research on whether or not cereal was a soup 🥁.</P>

<p>Back to the topic, Microservice architecture has been quite popular for years. When building an application for Microservices, we probably want it to be deployed on a virtual machine let's say for scalling purposes. </p>

<p>In addition, a server automation can be very useful for us since it automates our application build, test, and deployment pipeline before deploying it to a virtual machine.</p>

<p>This post will help you carefully how to deploy your containerized application on a virtual machine using GitHub actions (CI/CD).</p>
<hr/>

<h3>Prerequisites</h3>
<ul>
<li>Virtual machine - A running virtual machine instance. For this demo, I'm using a DigitalOcean droplet as I have it running already. But there shouldn't be a big difference with other virtual machine running on cloud platforms such as Amazon and Google Cloud Platform.</li>
<li>Docker - An open source software that consist of useful tools to containerize and manage our application. The docker software needs to be installed in the running virtual machine instance.</li>
<li>Git - A distributed version control system to manage our application code.</li>
<li>Web Application - An application server. A code example solely for demo can be viewed on github <a href="https://github.com/wildanazz/demo-web-application" target="_blank">here</a>.</li>
</ul>
<h3>What are the steps?</h3>
<p>There are three files that are important for our deployment process.</p>
<p>workflow.yml tells us how our application deployed in a virtual machine.</p>
<img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/28whbton44qz5nxvrvf6.png" alt="workflow" />
<p>Dockerfile is a set of instructions that run in a sequence in order to build an image of our application.</p>
<img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wc6aw90kquwvos0uzvwb.png" alt="dockerfile" />
<p>.dockerignore is a file that tells the docker what file(s) are not to include in the build process</p>
<img src="https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f0dz8ij4epm4wy1ok27i.png" alt="dockerignore" />
Creating a type safe `objectKeys` function
Published: 2023-08-24 02:35:49

In the world of TypeScript development, encountering the Object.keys function can sometimes lead to a frustrating experience. Consider a scenario where you have an object with keys `apple`, `banana`, and `cherry`. When attempting to iterate over these keys extracted from Object.keys, TypeScript treats the keys as strings. That means that when I try to access it I get this horrible long type error. `No index signature with parameter of type string was found in type '{ apple: string; banana: string; cherry: string;}'`.

```typescript
export const fruitBasket = {
  apple: "Apple",
  banana: "Banana",
  cherry: "Cherry"
};

Object.keys(fruitBasket).forEach((key) => {
  console.log(myObject[key]);
});
```
In this snippet, we're encountering the issue. Even though the keys are `apple`, `banana`, and `cherry`, TypeScript treats them like ordinary strings. This leads to frustrating type-related problems when trying to use these keys to access the actual properties.

So let's build our own `objectKeys` function that plays well with TypeScript's rules. This custom function uses TypeScript's generics and the `keyof` operator (which grabs the real key types) to ensure things are typed properly.

```typescript
function objectKeys<O extends object>(obj: O): (keyof O)[] {
  return Object.keys(obj) as (keyof O)[];
}
```
Here's what's happening with the function:

- `objectKeys` is what we've named our function.
- `<O extends object>` is a generic type parameter. It allows us to accept various types of objects while retaining the original type information.
- `(obj: O)` is a function parameter named obj with the type O. This means the function can take an object of any type.
- `: (keyof O)[]` specifies the return type of the function. It's an array containing keys of type (keyof O).

Now, when we use `objectKeys(fruitBasket)`, each key inside the loop is treated as `apple`, `banana`, or `cherry`.

```typescript
objectKeys(fruitBasket).forEach((fruit) => {
  console.log(fruitBasket[fruit]);
});
```
Keyword Researcher - SEO Software / Finds Long Tail Keywords
Tags: softwaredevelopment, softwareengineering, development, engineering
Published: 2023-08-24 02:27:40

"Uncover your website's hidden potential effortlessly with Keyword Researcher - our top-notch SEO software! Packed with advanced features, this tool enables you to discover untapped long-tail keywords, unveiling new opportunities to boost your site's rankings and traffic. Don't miss out on this chance to fine-tune your content with the right keywords and dominate in search results. Get access now and start optimizing your online presence!" See more in :https://8cb44jtforz7sy7zzz86yfll6f.hop.clickbank.net
Part 2: Integrating MariaDB in GoLang RestAPI Project: A Comprehensive Guide
Tags: mariadb, go, api, backend
Published: 2023-08-24 02:11:45

Databases are the backbone of most applications, and integrating them seamlessly is crucial for functionality and data persistence. MariaDB, a popular open-source relational database, offers robust features and performance. In this article, we'll guide you through integrating MariaDB into your GoLang RestAPI project, setting up a solid foundation for data management.

## Section 1: Introducing MariaDB for Data Storage

MariaDB is a widely used relational database management system and a fork of MySQL. It offers features such as ACID compliance, high performance, and scalability, making it a suitable choice for various applications.

## Section 2: Installing MariaDB

Install MariaDB using the package manager relevant to your operating system. During installation, you'll set up the root password and configure the database.

## Section 3: Creating the Database and Tables

After installing MariaDB, log in to the MySQL shell using the root user and the password you set during installation. Create a new database for your project and design the tables according to your application's data model.

Example SQL commands:

```sql
CREATE DATABASE mydb;
USE mydb;

CREATE TABLE users (
    id INT PRIMARY KEY AUTO_INCREMENT,
    name VARCHAR(255),
    email VARCHAR(255)
);
```

## Section 4: Connecting to MariaDB in GoLang

Install the `github.com/go-sql-driver/mysql` package to connect to MariaDB in your GoLang project. Create a connection pool and manage database connections efficiently.

Example code snippet:

```go
import (
	"database/sql"
	"fmt"
	"log"

	_ "github.com/go-sql-driver/mysql"
)

func main() {
	db, err := sql.Open("mysql", "username:password@tcp(localhost:3306)/mydb")
	if err != nil {
		log.Fatal(err)
	}
	defer db.Close()

	// Test the connection
	if err := db.Ping(); err != nil {
		log.Fatal(err)
	}
	fmt.Println("Connected to MariaDB!")
}
```

## Section 5: Performing CRUD Operations

Implement CRUD operations (Create, Read, Update, Delete) in your GoLang project using SQL queries. Use prepared statements for security and efficiency.

Example CRUD operations:

```go
// Create
_, err := db.Exec("INSERT INTO users (name, email) VALUES (?, ?)", "John", "john@example.com")

// Read
rows, err := db.Query("SELECT id, name, email FROM users")
for rows.Next() {
    var id int
    var name, email string
    err := rows.Scan(&id, &name, &email)
    if err != nil {
        log.Fatal(err)
    }
    fmt.Println(id, name, email)
}
```

## Section 6: Conclusion

Integrating MariaDB into your GoLang RestAPI project opens the doors to efficient data storage and retrieval. With proper database design and structured SQL queries, you can ensure data integrity and optimize performance. In the next article, we'll dive into [writing unit tests and integration tests for your GoLang RestAPI project with MariaDB](https://dev.to/suranisaunak/part-3-ensuring-data-integrity-unit-and-integration-testing-in-golang-restapi-with-mariadb-30o2).
Every Taylor Swift album and its corresponding programming language
Tags: discuss, swift, watercooler, jokes
Published: 2023-08-24 02:07:56

Debut: Swift 🪕
Fearless: Java 💛
Speak Now: C# 💜
RED: Ruby🧣
1989: C 🕶️
Reputation: Python 🐍
Lover: Go 🦋
Folklore: Rust 🧥
Evermore: Elixir 🌿
Midnights: Dark 🕰

Thoughts?
Manager Handbook for Distributed AntDB-T - P20–4
Published: 2023-08-24 01:48:55

Data backup
Back up a datanode
If there are multiple datanodes to be backed up, this command needs to be executed separately. If the user wants to restore based on barrier points later, he needs to log in to any coordinator and create a barraier before backing up.

```
[antdb@localhost1 ~/barman]$ barman backup dm0 
Starting backup using rsync-exclusive method for server dm0 in /home/antdb/barman/data/dm0/base/20190129T150740 
Backup start at LSN: 0/1C000060 (000000010000000000000007, 00000060) 
This is the first backup for server dm0 
WAL segments preceding the current backup have been found: 
        000000010000000000000005 from server dm0 has been removed 
Starting backup copy via rsync/SSH for 20190129T150740 (3 jobs) 
Copy done (time: 2 seconds) 
This is the first backup for server dm0 
Asking PostgreSQL server to finalize the backup. 
Backup size: 207.2 MiB. Actual size on disk: 207.2 MiB (-0.00% deduplication ratio). 
Backup end at LSN: 0/1C000130 (000000010000000000000007, 00000130) 
Backup completed (start time: 2019-01-29 15:07:41.584111, elapsed time: 3 seconds) 
Processing xlog segments from file archival for dm0 
        000000010000000000000006 
        000000010000000000000007 
        000000010000000000000007.00000060.backup 
```

View all backup data of a node

```
[antdb@localhost1 ~/barman]$ barman list-backup dm0 
dm0 20190129T150740 mode: rsync-exclusive tar:None - Tue Jan 29 15:16:29 2019 - Size: 207.3 MiB - WAL Size: 0 B 
```

View the details of a particular backup, where 20190129T150740 is the backup_id.

```
[antdb@localhost1 ~/barman]$ barman show-backup dm0 20190129T150740 
Backup 20190129T150740: 
  Server Name            : dm0 
  Status                 : DONE 
  PostgreSQL Version     : 100004 
  PGDATA directory       : /home/antdb/pgdata_xc/datanode/0 
 
  Base backup information: 
    Disk usage           : 207.2 MiB (207.3 MiB with WALs) 
    Incremental size     : 207.2 MiB (-0.00%) 
    Timeline             : 1 
    Begin WAL            : 000000010000000000000007 
    End WAL              : 000000010000000000000007 
    WAL number           : 1 
    WAL compression ratio: 99.89% 
    Begin time           : 2019-01-29 15:16:25.814768+08:00 
    End time             : 2019-01-29 15:16:29.837834+08:00 
    Copy time            : 2 seconds 
    Estimated throughput : 86.0 MiB/s (3 jobs) 
    Begin Offset         : 96 
    End Offset           : 304 
    Begin LSN           : 0/1C000060 
    End LSN             : 0/1C000130 
 
  WAL information: 
    No of files          : 0 
    Disk usage           : 0 B 
    Last available       : 000000010000000000000007 
 
  Catalog information: 
    Retention Policy     : VALID 
    Previous Backup      : - (this is the oldest base backup) 
    Next Backup          : - (this is the latest base backup) 
```
How to Unleash 🚀 the force of curiosity and understand complex concepts quickly.
Published: 2023-08-24 01:45:00

How to Unleash 🚀 the force of curiosity and understand complex concepts quickly.

This blog shares my mental model for harnessing your innate curiosity, leading you (hopefully) to a deeper 🧠 and richer understanding of the world.


https://ccorrales.com/2023/08/how-to-unleash-your-inner-curiosity-to-master-understanding/
What is utility writing?
Published: 2023-08-31 15:56:15

---
title: What is utility writing?
published: true
date: 2023-08-24 00:00:00 UTC
tags: 
canonical_url: https://blog.brainstory.ai/utility-writing/
---

When we think about what writing can be used for, it’s easy for us to list examples:

- Recipes
- Website copy
- Resumes
- Blogs
- Scripts

As humans, we wouldn’t expect someone who is great at journaling to be great at website copy. But when we think about AI writing tasks, we often blend all types of written output together.

## What is utility writing?

The goal of utility writing is to communicate some information to a target audience. All resume writing is utility writing. Most website copy is utility writing. Some blogs are utility writing. No screenplay is utility writing.

![A line depicting a range of writing from utility to creative](https://contenda.co/blogimages/utility.png)

## What are the challenges of utility writing?

1. Utility writing has to be done by everyone
2. People who are good at writing don’t always have the required information
3. People who have the required information aren’t always good at writing
4. Utility writing needs to be done quickly and at scale

## Why should AI do utility writing?

Humans have improved technology to facilitate better, faster communication for thousands of years. As early as 4000 B.C., people looked for ways to scale their utility writing:

> The Uruk archives may reflect a later period when writing “took off” as the need for more permanent accounting practices became evident with the rapid growth of large cities with mixed populations at the end of the fourth millennium B.C.
> 
> — [The Met Museum](https://www.metmuseum.org/toah/hd/wrtg/hd_wrtg.htm)

The advancements in abstraction to create letters over pictographs allowed more complex information to be communicated to more audiences. Paper and ink made it faster to write than carving clay tablets. The year 1440 saw another incredible leap forward with the printing press— suddenly writing could be created _at scale_.

AI is the aggregation of all of those leaps into one. It can make our utility writing better, faster for less cost.

## What about creative writing?

Humans should do creative writing. At the moment I’m writing this, the Writer’s Guild of America is on their longest [strike](https://www.nytimes.com/2023/08/23/business/media/hollywood-writers-strike-negotiations.html) in history over wages. Studios are considering using AI to replace certain writers. This is the wrong use case for AI.

Writing might have been invented for accounting and city signs, but people have been using writing as a creative outlet for thousands of years. AI can be used for idea generation or as an editing assistant, but it should not replace creative writing.
How to use video compression algorithms to optimize screen monitoring data management
Published: 2023-08-24 01:22:35

Managing screen monitoring data is like tidying up a study room – you want to boost efficiency and save on storage costs. Video compression algorithms are like magical tools on the bookshelf. They can trim down the data size without wrecking the pictures, making data management a breeze. Here are some ways to spruce up screen monitoring data management using video compression algorithms:

Choose the right compression algorithm: Get familiar with various types of video compression algorithms, like lossless and lossy compression. For monitoring data, you usually opt for lossy compression algorithms, as they can sacrifice a bit of image quality for higher compression rates. Common lossy compression standards include H.264, H.265 (HEVC), and more.
Adjust resolution and frame rate: Lowering the resolution and frame rate of monitoring screens can significantly shrink data size. Usually, it won’t affect grabbing essential information in monitoring scenes. For instance, you can dial down the high-resolution cameras to standard or lower resolutions, along with suitable frame rates.
Bitrate control: Employ bitrate control to cap the data transfer per second. This ensures stable transmission even with limited network bandwidth, even if it means some image distortion in high-action scenes.
Motion compensation: Motion compensation is a nifty technique in video compression. It encodes the differences between consecutive frames, instead of encoding each frame individually. This effectively trims data size, particularly in monitoring scenarios with lots of similar consecutive frames.
Region of interest (ROI) compression: In monitoring scenes, only parts of the screen might carry vital info. Applying compression algorithms to the areas of interest, and higher compression to the rest, further reduces data volume.
Dynamic parameter adjustments: Based on various monitoring scenes and needs, tweak compression parameters on the fly to achieve optimal compression and image quality.
Storage strategy: When storing compressed video data, pick suitable storage formats and codecs to maintain the compressed state during storage and transmission.
Smart analysis and filtering: Monitoring data often has repetitive or irrelevant scenes. Employ smart analysis and filtering techniques to retain only critical events and information, reducing storage and transmission load.
Regular data cleanup: With limited storage resources, cleaning up redundant monitoring data periodically can free up space and ensure smooth system operation.
In a nutshell, acing this game of screen monitoring data management involves thinking about compression tactics, managing resolution and frame rates, and not forgetting the storage strategy bigwig. Based on our needs and wallet thickness, select the right compression methods and settings to capture the best visuals while saving some bandwidth.
Seeking Strategies to Master Enterprise-Level Development in Angular and TypeScript
Tags: angular, typescript
Published: 2023-08-23 22:55:36

I'm eager to elevate my skills in Angular and TypeScript to an advanced level. My goal is to create enterprise-level applications that are not only scalable but also adhere to industry best practices and optimal architecture. However, it can be challenging to identify the best approaches to achieve this. I've realized that simply building a large number of apps isn't enough; it's easy to fall into the trap of using outdated methods.
So, I'm curious to hear your strategies for mastering these technologies. Do you recommend reading books, exploring other repositories, podcasts or perhaps something else? I'd really appreciate any advice or suggestions you might have.
An update on Speech Labs
Published: 2023-08-23 22:54:23

Hey folks!

I promise this announcement isn't as worrying as it seems - we're just giving a few quick updates on the state of Speech Labs and the place we're at with it right now.

## Platform Progress
Development is a long, iterative and incremental process. At Speech Labs, one of our Standard Operating Procedures is to follow the iterative development process to a tea, so it takes a **long time** to push new features to production.

This is the diagram that explains Speech Labs' internal iterative development process
![iterative and incremental development process](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4rgg9kk8gsmapg4jh05x.png)



We promised that we'd release on August 17, however, implementing new features and following this process is incredibly hard. This is why we're pushing our release to **September 1, 2023**. By pushing our release back, we can promise a few more things than we could if we were to release August 17.

1. Firstly, we can promise that a chunk of our users who signup will be invited to our iOS [TestFlight](https://developer.apple.com/testflight/) beta for our app. For now, our app will be iOS only (sorry Android users!)
2. We can promise we'll have a wider database of businesses you can call. We'll be telling you more about how calling will actually work in a mo'
3. We can focus more on UX and bugs than implementing more critical features and refining code.

## Calling: explained
For the first while, we will only have a select amount of businesses that you can call with Speech Labs. This is in order to be able to refine the AI while not having to worry about people attempting to abuse or evade our protective measures we've implemented.

Speech Labs' availability area will be as follows:

### United Kingdom
* East Midlands
* Scotland
* East of England
* Greater London
* South East England
* West Midlands
* Yorkshire and the Humber

![UK Availability Map](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jt2s74tyarns2ko7frax.png)

### United States
* California
* West Virginia
* Delaware
* Florida
* Hawaii
* Maryland
* Massachusetts
* Washington
 
![USA Availability Map](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cen6nu0nevejmemmok4q.png)

We will be expanding as Speech Labs grows.

## Closing

We'll update this if we have any more information for you guys to know.

In addition, we'll publish a support article soon for everyone to show availability maps in more specific detail, including expansion and how to show interest for your area.

Until then, thank you all for staying with us through this.

See you soon!
How I make dark/light theme
Tags: javascript, webdev, react, programming
Published: 2023-08-23 22:52:21

I'm developing a website that requires a dark/light theme switch, and I've come across various approaches to achieve this, including:

- Using Tailwind CSS
- Creating a Context to store the theme
- Utilizing an external React library
- Employing TypeScript styled components
- Simply using CSS

How would you choose an approach for a small application? I opted to use just CSS because it's the method I'm less familiar with. Now, I realize that it's actually the simplest way to accomplish this task. I used the :root:has(#theme-switch:not(:checked)) selector, and it worked smoothly in all my module.css files.