teleren/devto huggingface dataset:
It's A Circus
Tags: javascript, html, css, tailwindcss
Published: 2023-01-06 15:27:17

This project was unusual in that I decided I would style it first and then write the logic for it.

I began by walking through a Tailwind course over the holiday break and found I enjoyed using their shortcuts to make mobile responsive elements. Having everything on one page so I could visualize what it would look like as I created it went a long way towards preventing any frustration with CSS.

Once I had a working page I could pull bits and pieces from, I went back to my approved idea. I’d chosen several APIs that didn’t require an API key and settled on a simple concept I knew I could execute after the APIs brought to mind a big top circus “guess your age/weight/name” game.

Using the Tailwind course as a base allowed me to show/hide elements and update the class name to change the styling instead of hopping from html to html page when I wanted something changed. In the end, the most challenging part of the project was the creation of two side by side buttons with links in JavaScript, and even though they don’t do exactly what I’d envisioned, I spent so much time on them I reworked my idea just so could keep them.

Although I ended up with seven HTML pages (two which gave fun facts from a number), after uploading to GitHub an odd bug showed up where the innterText didn't update on those two pages. It would be visible through LiveServer, but not Replit or Pages so I ended up pivoting and removing both.

Since all my code was based on the same general structure, I just shuffled the fortune teller section from one function to another, removed the two pages, and it worked on the first try. 

Looking back, choosing to use Tailwind, key-free APIs, and an un-obscure theme at the beginning saved me time and headaches with styling and logic. The more projects I do the more I understand how important it is to spend time on editing your idea, then confirming your data, before ever sitting down to code.

The code: 
https://github.com/Meg-Div/ItsACircus

Play it:
https://meg-div.github.io/ItsACircus
11. Container With Most Water
Tags: java, leetcode, 100daysofcode, programming
Published: 2023-01-06 15:25:36

**Problem Statement:**

You are given an integer array height of length n. There are n vertical lines drawn such that the two endpoints of the ith line are (i, 0) and (i, height[i]).

Find two lines that together with the x-axis form a container, such that the container contains the most water.

Return the maximum amount of water a container can store.

Notice that you may not slant the container.

 

**Example 1:**
**Input:** height = [1,8,6,2,5,4,8,3,7]
**Output:** 49
**Explanation:** The above vertical lines are represented by array [1,8,6,2,5,4,8,3,7]. In this case, the max area of water (blue section) the container can contain is 49.

**Example 2:**
**Input:** height = [1,1]
**Output:** 1
 

**Constraints:**

- n == height.length
- 2 <= n <= 105
- 0 <= height[i] <= 104

**Solution:**
**Algorithm:**

1. Initialize the maxArea to 0
2. Initialize the left pointer to 0 and the right pointer to the length of the array - 1
3. Loop through the array while the left pointer is less than the right pointer
4. Calculate the area by multiplying the minimum of the height of the left and right pointer by the difference of the right and left pointer
5. Update the maxArea by comparing the maxArea and the area
6. If the height of the left pointer is less than the height of the right pointer, increment the left pointer, else decrement the right pointer
7. Return the maxArea

**Code:**
```
class Solution {
    public int maxArea(int[] height) {
        
         int maxArea = 0;
         int left = 0;
         int right = height.length - 1;
         while (left < right) {
              int area = Math.min(height[left], height[right]) * (right - left);
              maxArea = Math.max(maxArea, area);
              if (height[left] < height[right]) {
                left++;
              } else {
                right--;
              }
         }
         return maxArea;

    }
}
```
**Time Complexity:**
_O(n)_
**Space Complexity:**
_O(1)_
Follow Friday: Conferences Edition (6 January 2023)
Tags: meta, writing, career, events
Published: 2023-01-06 15:17:53

---
title: Follow Friday: Conferences Edition (6 January 2023)
published: true
description: 
tags: meta, writing, career, events 
series: Follow Friday
---

_Happy Friday, friends! 🎉 Follow Friday is your weekly opportunity to shout out fellow DEV Community members doing awesome work. Check out the comments and follow someone new!_

Inspired by this week's Top 7 post on [speaking at conferences when you're afraid of public speaking](https://dev.to/blackgirlbytes/how-to-speak-at-a-conference-when-youre-scared-of-public-speaking-562f) by @blackgirlbytes, this week we're talking about **conferences**!

Whether you attend them or not, conferences are a big part of tech career culture. Come for the networking and inspiring talks, stay for the swag and afterparties (or maybe the other way around? 🤔). There are no shortage of DEV community members with tips on how to give an amazing talk, or how to prepare for your first-ever conference experience.

Plus, I always enjoy reading conference recaps from folks on DEV to learn more about how different organizations get people together to learn and celebrate. 

So, devs: who are your favorite DEV community members sharing about conferences?

_**Formatting tip**: to populate a card with a follow button, use the liquid tag syntax `{% embed https://... %}` and insert the URL of your favorite author's profile._

Join in on the #FollowFriday fun by @mentioning your favorite author to follow on the topic of conferences (and letting us know why you love their posts!) ⤵️
What was your win this week?
Tags: discuss, weeklyretro
Published: 2023-01-06 15:04:00

Hey y'all! 👋

Enjoy your weekends!

Looking back on this past week, what was something you were proud of accomplishing?

All wins count — big or small 🎉

Examples of 'wins' include:

- Starting a new project
- Fixing a tricky bug
- Making a new years resolution ✊

---


![cartoon dog in sweatpants dancing, the words "new year, same sweatpants" are written across the pic](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2wtyw5fj2rl3pdyu04tw.gif)
2's Complement 101: A Beginner's Guide
Tags: programming, computerscience, tutorial, datascience
Published: 2023-01-06 15:02:02

  As a new programmer, you may have heard the term "2's complement" thrown around, but may not fully understand what it means. In this post, we'll explore what 2's complement is and why it's useful in computer science.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/57n5bs1hekncrgsbdv9r.jpg) <br/>

In computer systems, we often need to represent negative numbers. One way to do this is to use a system called "signed magnitude representation," in which the leftmost bit represents the sign of the number (0 for positive and 1 for negative) and the remaining bits represent the magnitude.

However, this system has a major drawback: there are two ways to represent zero (000000... for positive and 100000... for negative). This can lead to confusion and extra complexity when working with these numbers.

To solve this problem, we can use a system called "2's complement representation." In 2's complement, negative numbers are represented by the complement of their absolute value, plus 1. Confused? Let's take a closer look with an example.

Consider the number -5. In 8-bit 2's complement representation, it would be represented as follows:

1. First, we find the binary representation of the absolute value of -5, which is 5. This is 101 in binary.

2. Next, we take the complement of this value by flipping all of the bits. This gives us 010.

3. Finally, we add 1 to the result. This gives us 011, which is the 2's complement representation of -5.

To convert a 2's complement number back to its original value, we can follow the reverse process:

1. Take the complement of the number by flipping all of the bits.

2. Add 1 to the result.

3. If the leftmost bit is 1, the number is negative. If it is 0, the number is positive.

2's complement representation has several advantages over signed magnitude representation. It allows for easier arithmetic operations, as we only need to use the same techniques for positive and negative numbers. It also eliminates the problem of having two representations for zero.

In summary, 2's complement is a system for representing negative numbers in binary. It allows for more efficient arithmetic operations and eliminates the issue of having two representations for zero. As a new programmer, it's important to understand this concept as you may encounter it in your work.

Learn more [Youtube Videos](https://www.youtube.com/watch?v=sJXTo3EZoxM)
Customize your PowerShell and Neovim [Microsoft]
Tags: vim, tutorial, productivity, motivation
Published: 2023-01-06 14:58:14

Hey 👋
This is my first blog in the new year, and wanted to start off by wishing everyone a happy new year 2023.

The topic of this blog post accompanied by a step-by-step video guide is `how to customize your PowerShell` for your new computer `for Windows 10/11 users`.
I was asked by lots and lots of friends who watched my videos on how to create this gorgeous-looking terminal, I have a written blog for that but even it is not that complete.
So, I decided to record each step of the process, to document the important points in less than 30 minutes. 

{%youtube fviSilPKIhs %}
And it's not only PowerShell but more than that, and here is the list of topics covered in this video with timestamps: 
01:11 Install PowerShell Core 7 [Microsoft Store]
02:08 Reboot terminal and customize position in JSON file
02:24 Move PowerShell to Chevron top
03:00 Customize PowerShell appearance
03:59 Make Tab Row acrylic
04:42 Install patched nerd fonts [CaskaydiaCove NF]
05:48 Changing terminal font
06:25 Changing the terminal color [customized in JSON]
07:53 Install Neovim
08:48 Create init.vim file 
10:03 Plug Installation
10:52 Install Git for Windows [Gitbash]
11:41 Create SSH key
12:06 Neovim setup for autocompletion [js, ts, css, etc...]
12:56 Install NodeJS
13:29 Install NVM with Chocolatey
14:06 Install Yarn for COC (Neovim)
15:34 Install COC-Python (Neovim)
16:35 Install Oh My Posh (Prompt theme engine)
17:12 Make a user profile ($PROFILE)
18:07 Customize prompt (Aliases)
19:17 Create my_profile.omp.json
19:42 Change themes
22:13 Install Terminal Icons
23:10 Install z - Directory jumper
23:46 Install PSReadLine - Autocompletion
25:10 Add a utility command - `whereis`
26:14 Try `whereis`
26:40 Update the profile
27:25 VSCode integrated terminal

Hope you enjoy this guide, and let me know if anything you wanted is missing; I also like to be taught and educated by you for mutual benefit.
Thank You :)
What Is the Difference Between Absolute and Relative XPaths?
Tags: webdev, beginners, programming, tutorial
Published: 2023-01-06 14:48:32

In this tutorial, We are going to learn about the major difference between Absolute and Relative XPaths.

{% embed https://youtu.be/ZNgvR-Vbxjk %}

Absolute Xpath: It uses Complete path from the Root Element to the desire element. Relative Xpath: You can simply start by referencing the element you want and go from there. Always Relative Xpaths are preferred as they are not the complete paths from the Root element. ... So Always use Relative Xpaths in your Automation

-----------------------------------------------------
👪 Join our Community - http://bit.ly/learntesting2019

✅ Automation Community - https://thetestingacademy.com

🐦Follow us on Twitter  - https://twitter.com/itstechmode

📖 Like us on Facebook - https://www.facebook.com/scrolltest

🎤  Listen to our Podcast - https://anchor.fm/thetestingacademy

------------------------------------------------------
#automationtesting #manualtesting #testautomation #thetestingacademy #scrolltest
🚀 Tools and services I recommend:
Some of the courses that I recommend to become better Automation Tester 🙌🙌

✅Selenium Training and Certification -
https://scrolltest.com/go/edureka


✅Learn Jenkins for QA -
https://bit.ly/learnjenkins-p1


✅Programming Java -
https://bit.ly/learnjava2020-p1


✅Test Automation - 
https://bit.ly/learnautomation2020


✅API Testing - 
https://www.learnapitesting.com


✅Cypress Tutorial with LIVE Projects -
http://cypresstutorial.com
How to get base64 encoded string of a certificate in C#
Tags: security, csharp, dotnet
Published: 2023-01-06 14:40:42

In the last few weeks I worked a lot with certificates and authentication with C# and console application.
For a lot of reasons, sometimes, I need a base64 encoded string version of the certificates I have installed locally on my machine.

```csharp
	public string GetEncodedStringFromCertificate(string certThumbprint, string certPassword)
	{
		var store = new X509Store(StoreName.My, StoreLocation.LocalMachine);
		store.Open(OpenFlags.ReadOnly);
		
		var certificate = store.Certificates.Find(X509FindType.FindByThumbprint, certThumbprint, false).First();
		var exp = certificate.Export(X509ContentType.Pfx, certPassword);
		var base64 = Convert.ToBase64String(exp);
		store.Close();
		
		return base64;
	}
```

I have created this function above to retrieve a certificate with a Thumbprint and a password.
By the way it's not important the way to retrieve the certificate, but how to export to a base64 encoded string.

In my case I have a lot of Pfx, but you can choose the right certificate type for you.

---

Thanks for reading this post, I hope you found it interesting!

Feel free to follow me to get notified when new articles are out 🙂

{% embed https://dev.to/kasuken %}
448. Find All Numbers Disappeared in an Array
Tags: java, leetcode, 100daysofcode
Published: 2023-01-06 14:39:39

**Problem Statement:**
Given an array nums of n integers where nums[i] is in the range [1, n], return an array of all the integers in the range [1, n] that do not appear in nums.

 

**Example 1:**
**Input:** nums = [4,3,2,7,8,2,3,1]
**Output:** [5,6]

**Example 2:**

**Input:** nums = [1,1]
**Output:** [2]
 

**Constraints:**

- n == nums.length
- 1 <= n <= 105
- 1 <= nums[i] <= n

**Solution:**
**Algorithm:**
1. Create a HashSet
2. Create a List
3. Add all the elements of the array to the HashSet
4. Iterate from 1 to the length of the array
5. If the HashSet does not contain the number, add it to the List
6. Return the List

**Code:**

```
public class Solution {
    public List<Integer> findDisappearedNumbers(int[] nums) {
        HashSet<Integer> hs = new HashSet<>();
        List<Integer> result = new ArrayList<>();
        for (int i = 0; i < nums.length; i++) {
            hs.add(nums[i]);
        }
        for (int i = 1; i <= nums.length; i++) {
            if (!hs.contains(i)) {
                result.add(i);
            }
        }
    }

}
```
**Time Complexity:**
O(n)
**Space Complexity:**
O(n)
On the twelfth day of Enhancing: Debugging
Tags: enhance, webdev, webcomponents
Published: 2023-01-06 14:21:11

---
title: On the twelfth day of Enhancing: Debugging
published: true
description: How to debug your remote applications.
tags: enhance, webdev, webcomponents
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/whru9xindo8vwknc7291.jpg
canonical_url: https://blog.begin.com/posts/2023-01-06-on-the-twelfth-day-of-enhancing
series: 12 Days of Enhancing
---

We are at the end of our 12 Days of Enhancing series. We’ll give you some short instructions on debugging your new Enhance application.

## Debugging

Since your Enhance application is running in the cloud, it’s not exactly like you can attach a debugger. Instead, we rely upon our old friend `console.log`. By judicious use of `console.log` we can inspect the crime scene that my code so often emulates.

To get logs from recent executions of your app, run the following command:

```bash
begin logs --env staging
```

That output might get a bit verbose if you have a lot of traffic. Luckily, you can filter the logs by adding a filter parameter to the command.

```bash
begin logs --env staging --filter "my keyword"
```

You might even want to [wrap](https://gist.github.com/robatron/5681424) `console.log` in a function so you can turn on and off the output with an environment variable like we discussed yesterday.

## Next Steps

Take some of the tidbits we’ve given you over the past 12 days and make something great with Enhance yourself. We'd love to hear about your project. Connect in our [Discord server](https://enhance.dev/discord) or on Mastodon [@enhance_dev@fosstodon.org](https://fosstodon.org/@enhance_dev).
AWS Certifications
Tags: aws, cloud, webdev, javascript
Published: 2023-01-06 14:02:36

Getting started in the Cloud might be overwhelming at first since AWS is boasting over 200+ services (growing every year)! Currently, there is a lot of information on the web about AWS like white papers, courses, books, and videos.

But if you’re a beginner in the Cloud industry, all the available content might be overwhelming and you don’t know if the information is of high quality and helps you become a better engineer.

To solve that problem I’ve created this AWS Cloud Practitioner exam guide. In this guide, I’ve curated the right study materials based on my 8+ years of experience. So you can make sure that whatever is provided here is of great quality.

So you just have to focus on studying and preparing for the AWS Cloud Practitioner exam instead of looking for the right learning resources.
Some Common SQL commands!
Published: 2023-01-06 14:01:16

**SQL** (Structured Query Language) is a programming language used to manage and manipulate data stored in relational database management systems (RDBMS). It is a standard language used to perform various operations on databases, such as creating new tables, inserting data, updating data, and deleting data.

In this blog, we will discuss some of the most common SQL commands that are used to manage and manipulate data in a database.

**SELECT**
The SELECT command is used to retrieve data from a database. It allows you to specify the columns that you want to retrieve, as well as the rows that meet certain criteria.

For example, the following SQL statement retrieves all the rows from the "Customers" table, and displays the "CustomerName" and "City" columns:

```sql
SELECT CustomerName, City FROM Customers;

```
You can also use the WHERE clause to specify criteria for selecting rows. For example, the following SQL statement retrieves all the rows from the "Customers" table where the "Country" is "Germany":

```sql
SELECT * FROM Customers WHERE Country='Germany';

```
**UPDATE**
The UPDATE command is used to modify data in a database. It allows you to change the values of specific columns in a table.

For example, the following SQL statement updates the "Address" and "City" columns in the "Customers" table for the customer with the "CustomerID" of 1:

```sql
UPDATE Customers
SET Address='Tverskoy Boulevard, 32', City='Moscow'
WHERE CustomerID=1;

```
**DELETE**

The DELETE command is used to delete data from a database. It allows you to remove specific rows or all rows from a table.
For example, the following SQL statement deletes the row with the "CustomerID" of 4 from the "Customers" table:

```sql
DELETE FROM Customers WHERE CustomerID=4;

```
If you want to delete all rows from a table, you can use the TRUNCATE TABLE command. For example:

```sql
TRUNCATE TABLE Customers;

```
**INSERT INTO**

The INSERT INTO command is used to insert new data into a database. It allows you to add one or more rows to a table.

For example, the following SQL statement inserts a new row into the "Customers" table:

```sql
INSERT INTO Customers (CustomerName, ContactName, Address, City, PostalCode, Country)
VALUES ('Cardinal', 'Tom B. Erichsen', 'Skagen 21', 'Stavanger', '4006', 'Norway');

```
**CREATE DATABASE**

The CREATE DATABASE command is used to create a new database.

For example, the following SQL statement creates a new database called "MyDatabase":

```sql
CREATE DATABASE MyDatabase;

```
**ALTER DATABASE**

The ALTER DATABASE command is used to modify a database. It allows you to change the name of a database, as well as other characteristics such as the file location and the maximum size.

For example, the following SQL statement changes the name of the "MyDatabase" database to "NewDatabase":

```sql
ALTER DATABASE MyDatabase
MODIFY NAME = NewDatabase;
```
Amazon Simple Storage Services
Tags: aws, s3
Published: 2023-01-06 13:46:36

## Amazon S3:
A simple cloud storage services that is highly available . _Objects (files)_ which can be made public or private are stored in _buckets(directories)_ . **S3** holds unlimited storage that can store millions of objects per bucket. 

## Features

1. **Security**: S3 offers protection for each of the bucket levels or objects level. Security at the buckets level or objects level can be set using access control lists (ACLs), bucket policies, or access point policies.

2. **S3 access log**: This is used to track access to the buckets and objects.

3. **Multiple Version**: This feature can be enable to prevent accidental deletion of files by creating multiple versions of the files.

4. **Durability and Availability**: These are the most important aspects of Amazon S3 which the files or objects are never compromised or lost and quick access to the files when required at the needed time.

## S3 Storage Classes:

1. S3 Standard
2. S3 Intelligent-Tiering
3. S3 Standard-Infrequent Access (IA)
4. S3 One Zone-Infrequent Access (IA)
5. S3 Glacier
6. S3 Glacier Deep Archive
7. S3 Outposts
CSS Loaders
Tags: html, css, webdev, tutorial
Published: 2023-01-06 13:43:06

Hello Everyone today I will show you some Loaders created with CSS.
After understanding the logic, you can also create your own Loaders with some creative Stylings.

Let's get Started...

# Loader 1 - 
{% codepen https://codepen.io/shubhamtiwari909/pen/yLqVpyd %}

# Loader 2 - 
{% codepen https://codepen.io/shubhamtiwari909/pen/bGjBaMy %}

# Loader 3 - 
{% codepen https://codepen.io/shubhamtiwari909/pen/yLqVKoR %}

# Loader 4 - 
{% codepen https://codepen.io/shubhamtiwari909/pen/wvxomzq %}

# Loader 5 - 
{% codepen https://codepen.io/shubhamtiwari909/pen/vYaypRr %}

You can check the CODE in the codepen examples, Its not that complicated and you will get idea how to create more of these loaders.

THANK YOU FOR CHECKING THIS POST
You can contact me on -
Instagram - https://www.instagram.com/supremacism__shubh/
LinkedIn - https://www.linkedin.com/in/shubham-tiwari-b7544b193/
Email - shubhmtiwri00@gmail.com

^^You can help me by some donation at the link below Thank you👇👇 ^^
☕ --> https://www.buymeacoffee.com/waaduheck <--

Also check these posts as well
https://dev.to/shubhamtiwari909/css-iswherehas-and-not-2afd

https://dev.to/shubhamtiwari909/theme-changer-with-html-and-css-only-4144

https://dev.to/shubhamtiwari909/swiperjs-3802

https://dev.to/shubhamtiwari909/going-deep-in-array-sort-js-2n90
Laravel - Maintenance Mode (artisan)
Tags: webdev, laravel, programming
Published: 2023-01-06 13:41:18

If you want to enable maintenance mode on your page, execute the down Artisan command:
```
php artisan down
```
Then people would see default 503 status page.

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


You may also provide flags, in Laravel 8:

- the path the user should be redirected to
- the view that should be prerendered
- secret phrase to bypass maintenance mode
- retry page reload every X seconds
```
php artisan down --redirect="/" --render="errors::503" --secret="1630542a-246b-4b66-afa1-dd72a4c43515" --retry=60
```
Before Laravel 8:

- message that would be shown
- retry page reload every X seconds
- still allow the access to some IP address
```
php artisan down --message="Upgrading Database" --retry=60 --allow=127.0.0.1
```
When you've done the maintenance work, just run:
```
php artisan up
```