teleren/devto huggingface dataset:
Fashion Cube-Ecommerce Application with React
Tags: fashion, ecommerce
Published: 2023-08-18 07:48:49

---
title: Fashion Cube-Ecommerce Application with React
published: true
date: 2023-08-14 00:38:00 UTC
tags: Fashion,Ecommerce
canonical_url: https://reactjsexample.com/fashion-cube-ecommerce-application-with-react/
---

# Fashion Cube-Ecommerce Application
 ![Fashion Cube-Ecommerce Application with React](https://reactjsexample.com/content/images/2023/08/code_2023-12-11-33-47.jpg)

#General Info

front-end: Reactjs, Redux, Axios, Sass, react-bootstrap

[Live Demo](https://quintuslabs.github.io/fashion-cube)

## This project is created using:

- Monorepo
- Lerna
- Design System
- Hooks
- Redux

## Future Features

- Home (List products)
- Detail products
- Product category
- Recommended products
- Cart
- Login / Register

# ScreenShot

![Fashion Cube-Ecommerce Application with React](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce/raw/master/screen/screen1.png)

![Fashion Cube-Ecommerce Application with React](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce/raw/master/screen/screen2.png)

![Fashion Cube-Ecommerce Application with React](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce/raw/master/screen/screen3.png)

![Fashion Cube-Ecommerce Application with React](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce/raw/master/screen/screen4.png)

![Fashion Cube-Ecommerce Application with React](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce/raw/master/screen/screen5.png)

![Fashion Cube-Ecommerce Application with React](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce/raw/master/screen/screen6.png)

## GitHub

[View Github](https://github.com/PaolaBravo1/Node-Mongo-React-Ecommerce?ref=reactjsexample.com)
Intro to Python: Day 10 - Basic Operators in Python vs Javascript
Tags: python, javascript, webdev, beginners
Published: 2023-08-14 00:11:02

*Hi there 👋 I'm a New York City based web developer documenting my journey with React, React Native, and Python for all to see. Please follow my dev.to profile or [my twitter](https://twitter.com/stonestwebdev) for updates and feel free to reach out if you have questions. Thanks for your support!*

As a developer with a basic background in Javascript, it can be confusing at times learning Python and completing exercises in a course because the syntax is so readable in Python, and so similar to JS, but not the same.

Every development language will have logical operators, and they will follow a simple AND, OR, NOT syntax.

In my native Javascript however, AND is demarcated with `&&`, OR is demarcated with `||` and NOT is demarcated with `!`. These are readable and short. They're so easy to get used to it can be tough to transition out, especially when Python's logical operators `==`, `!=`, `>`, `>=` and so on are nearly identical to Javascript's.

In Python, those operators are simple English: `and`, `or`, `not`. They're so simple it's easy to forget them! Which is the easiest way to get a bug you have no idea how to solve.

Onward and upward!

**If you like projects like this and want to stay up to date with more, check out my Twitter [@stonestwebdev](https://twitter.com/stonestwebdev), I follow back! See you tomorrow for another project.**
Telegram NFT Auctions (Fragment) with C#
Tags: csharp, dotnet, blockchain, ton
Published: 2023-08-13 23:14:17

In my project, I needed to connect to [fragment.com ](https://fragment.com )and read some information about the auctioned numbers in it. So, I started with **_my favorite language, C#_**! In this blog post, I will introduce the C# SDK that I've created to connect to Fragment and read its information in a fully typed way. First, let me explain what Fragment is and why it’s important. Then I’ll show you how I created the SDK. Finally, I’ll include some code snippets and screenshots to make it easier for you to follow along.

## What is Fragment?
Telegram is definitely my absolute favorite messaging app ever! It has a feature called **Anonymous Number**, which are unique phone numbers that can be used to login to Telegram fully anonymously.

That's where [fragment.com](https://fragment.com) comes in. Fragment is a decentralized marketplace that runs on [The Open Network (TON)](https://foundation.ton.run/), a blockchain platform that was initially developed by Telegram's founders. 

![Fragment](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gl3dk7qozdalstqkmlqs.png)


Fragment allows users to bid for Telegram **Anonymous Numbers** and **Usernames** in an auction format. All usernames are represented on the TON blockchain as non-fungible tokens (NFTs), meaning they are unique and indivisible digital assets.

## How to Use Fragment SDK?

To access the data from Fragment in a convenient and efficient way, I decided to create a .NET SDK that can communicate with the TON blockchain and parse the information from Fragment. The result is [TonRadar.Fragment](https://github.com/tonradar/fragment-sdk-dotnet/) **nuget package**, which you can install in your project using the following command:

```csharp
dotnet add package TonRadar.Fragment
```

Here is an example of how to use the SDK to get the details of the current highest bid for the username "ton":

```csharp
// Create an instance of the FragmentClient class auctions.
var client = new FragmentClient();

// Reading all auctions with EndingSoon filter.
var auctionItems = await client.Numbers.GetAuctionsItemsAsync(SortType.EndingSoon);

// Reading all for-sale items.
var saleItems = await client.Numbers.GetSaleItemsAsync(FilterType.ForSale);

// Reading all sold items.
var soldItems = await client.Numbers.GetSoldItemsAuctionsAsync(FilterType.Sold);
```
## Conclusion

In this blog post, I have shown you how to use my C# SDK, [TonRadar.Fragment](https://github.com/tonradar/fragment-sdk-dotnet/), to access and analyze the data from Fragment. For now, I've just added my needed methods to the library. But in the future, I'll add more functionality to it. I will be more than happy if you contribute and add you're required features to it and send some pull requests. You can find the repo [here on GitHub](https://github.com/tonradar/fragment-sdk-dotnet/).

![Fragment .NET SDK on GitHub](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5b75kkffu96qt5s395br.png)
flow To react
Tags: webdev, javascript, beginners, react
Published: 2023-08-13 23:00:10



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rgjilcgst3c4rnuthg25.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1qd9ueqh4yp46i8oaxuk.png)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hdykuw6072bba6ue5nai.png)
The 56th Day of the 100 Days of Code Challenge
Published: 2023-08-13 22:18:43

Hey everyone! The last few days were a bit busy but I was super on the code. Honestly, I forgot to post. Worked on my personal assistant project and handled some issues in the GitHub repo I'm collaborating on. Today, planned out my projects and approach, it's going to be amazing! Not much to say, more to see! Happy coding everyone :)
The SQL Language (Part-2)
Tags: bitnine, postgres, apacheage, devcommunity
Published: 2023-08-13 21:52:52

---

## Querying a Table

A SQL `SELECT` statement is used to retrieve the data from the table. Like to retrieve all the rows of table `weather`:

```
SELECT * FROM weather;

```
Here * showed the all columns.

```
SELECT city, temp_lo, temp_hi, prcp, date FROM weather;

```
The Output should be:

> `city | temp_lo | temp_hi | prcp | date
`
`San Francisco | 46 | 50 | 0.25 | 1994-11-27
 San Francisco | 43 | 57 | 0 | 1994-11-29
 Hayward | 37 | 54 | | 1994-11-29
(3 rows)`

You can write expression, not just simple coulumn references, in the select list, you can do:

```
SELECT city, (temp_hi+temp_lo)/2 AS temp_avg, date FROM weather;
```
This should give:

`city | temp_avg | date`

 `San Francisco | 48 | 1994-11-27
 San Francisco | 50 | 1994-11-29
 Hayward | 45 | 1994-11-29
(3 rows)`

A query can be “qualified” by adding a WHERE clause that specifies which rows are wanted. The WHERE
clause contains a Boolean expression.

```
SELECT * FROM weather
 WHERE city = 'San Francisco' AND prcp > 0.0;
```
It will show:

`city | temp_lo | temp_hi | prcp | date`

 `San Francisco | 46 | 50 | 0.25 | 1994-11-27
(1 row)`

You can sort the result:

```
SELECT * FROM weather
 ORDER BY city;
```
`city | temp_lo | temp_hi | prcp | date`

 `Hayward | 37 | 54 | | 1994-11-29
 San Francisco | 43 | 57 | 0 | 1994-11-29
 San Francisco | 46 | 50 | 0.25 | 1994-11-27`

It may not give full results:

Try this command to:

```
SELECT * FROM weather
 ORDER BY city, temp_lo;
```

You can request duplicate rows be removed from the result:

```
SELECT DISTINCT city
 FROM weather;
```
It will show 

`city`

 `Hayward
 San Francisco
(2 rows)`

You can use `DISTINCT` and `ORDER BY`, together for correct order.

```
SELECT DISTINCT city
 FROM weather
 ORDER BY city;
```
Best Gaming Website
Published: 2023-08-13 21:51:47

APKtoly is widely regarded as one of the best gaming websites available. With its user-friendly interface and extensive collection of games, it has become a favorite destination for gamers of all levels. The website offers a vast range of games across various genres, ensuring that there is something for everyone to enjoy.

One of the standout features of [APKtoly](https://apktoly.com/) is its commitment to providing high-quality and safe game downloads. All games available on the platform are thoroughly vetted to ensure they are free from malware and other potential security risks. This dedication to user safety has earned APKtoly a reputation as a trustworthy source for gaming enthusiasts to discover and download new games.

The website's easy-to-navigate layout allows users to quickly find the games they're interested in, and its search and filtering options make the process even smoother. Additionally, APKtoly regularly updates its game library, ensuring that players have access to the latest titles and updates as soon as they are released.

The community aspect of APKtoly is another reason why it stands out. The website often features reviews, ratings, and discussions about various games, helping users make informed decisions about what to play next. Gamers can also interact with fellow players, share tips and tricks, and participate in forums dedicated to specific games or gaming genres.

Whether you're a casual gamer or a dedicated enthusiast, APKtoly's combination of quality, safety, and community engagement make it a top choice when it comes to gaming websites. It continues to set a high standard for what a gaming platform can offer, making it an essential destination for anyone looking to explore new games and connect with fellow gamers.
Monitor internet speeds with Raspberry Pi
Tags: raspberrypi, kubernetes, python, homelab
Published: 2023-08-13 20:55:13

A great addition to any homelab is being able to track your internet speeds over time and have a nice dashboard to visualize the data for download/upload speeds, latency, and jitter.

We'll use the speedtest.net API for the test itself, a time series database to store our test results, and a dashboard to visualize them from other machines on the network.

To make the deployment easier we'll take advantage of Docker containers to package our apps, Kubernetes for orchestration, and Helm to deploy everything. 

You'll need a Raspberry Pi or some other low-cost, low-energy consumption computer you'd like to leave on to do the speed monitoring. You won't need a graphical desktop on it since you can `ssh` into it to carry out all tasks.

Let's get started! All the details are here:
{% embed https://github.com/santisbon/speedtest %}
Hosting site on httpd and nginx docker container
Tags: docker, devops
Published: 2023-08-13 20:18:37

**Docker Project**
In this project, I created containers using httpd and nginx images using command

```bash
~ docker pull httpd
~ docker run --name httpdproject httpd -d
```
Then I first stop and then remove this container
```bash
* docker stop httpdproject 
* docker rm httpdproject 
```
Then I mount my website content on my container using these commands
```bash
~ docker run --name mywebproject -p 8080:80 -v $(pwd)/web:/usr/local/apache2/htdocs:ro -d httpd
~ docker ps 
```
* We can check our website will be running on 8080 port which it's redirecting to 80 port of container


Same Process, we will do with nginx
```bash
~ docker run --name nginxproject -p 8082:80 -v $(pwd)/web:/usr/share/nginx/html:ro -d nginx
```
Now, we can see our site will be working on 8082 port.

**Dictionary**
**ps** command to check running containers
**images** command to see available images
**-p** this flag with run use for port redirecting
**-v** is used to mount volume on the container
**--name** flag with run is used to name our container
**-d** flag means run container in detached mode. It means that it should be run in the background
Check if any audio is playing with JS
Tags: javascript, howlerjs, audio
Published: 2023-08-13 20:05:05

Check if any audio is playing with JS
-------------------------------------

As a software developer, you may come across situations where you need to check if any audio is currently playing on a webpage. Whether it's for adding custom controls or implementing specific behaviors, having the ability to detect audio playback can be quite useful. In this article, we will explore how to achieve this using JavaScript.

One straightforward approach to determine if audio is playing is by utilizing the `HTMLAudioElement` interface provided by the HTML5 audio element. This interface exposes various properties and methods to interact with audio elements on a webpage.

To check if any audio is currently playing, we can iterate through all the audio elements present on the page and examine their `paused` property. If any audio element has a `paused` value of `false`, it means that audio is actively playing.

 

    
    const isAnyAudioPlaying = () => {
      const audioElements = document.getElementsByTagName('audio');
      
      for (let i = 0; i < audioElements.length; i++) {
        if (!audioElements[i].paused) {
          return true;
        }
      }
      
      return false;
    };
    
    if (isAnyAudioPlaying()) {
      console.log("Audio is playing! 🎵");
    } else {
      console.log("No audio playing at the moment. 🤫");
    }
      

 

In the code snippet above, we define a function called `isAnyAudioPlaying` which retrieves all the audio elements using `getElementsByTagName('audio')`. We then iterate through each audio element and check if its `paused` property is `false`. If we find any audio element with `paused` as `false`, we return `true` indicating that audio is playing. Otherwise, we return `false`.

To demonstrate the usage, we call the `isAnyAudioPlaying` function and log appropriate messages to the console.

With this simple JavaScript function, you can easily check if any audio is playing on your webpage and perform actions accordingly. So go ahead, add some funky audio controls or create interactive experiences based on audio playback!

### References:

*   [MDN Web Docs - HTMLAudioElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement)
*   [MDN Web Docs - getElementsByTagName](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByTagName)
Vulnerability inflation in infosec
Tags: sqlite, infosec
Published: 2023-08-13 19:47:42

---
title: Vulnerability inflation in infosec
published: true
description: How infosec people will grab onto every bug
tags: sqlite,infosec
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-05-25 23:00 +0000
---
FOR a while now, people have been pointing out that security vulnerability reports, especially to the National Vulnerability Database, are getting inflated way beyond their actual level of severity. The SQLite team especially [warn about this](https://www.sqlite.org/cves.html). Here's a good example: https://sqlite.org/forum/forumpost/d2415641c8

Richard Hipp says:

> CVE-2023-36191 was written against this bug, 20 days after the bug was fixed. This post is to refute that CVE.
>
> The error is a bug. It has been fixed. But it is _not_ a vulnerability. You may safely ignore the CVE. Key points:...
> The behavior is the same after the bug fix as it was before - the program issues an error message and stops. The "fix" just makes the error message a little nicer. Instead of printing "Segmentation Fault", it prints "Error: missing argument to --nonce" and then calls exit(1).

Here's the description in [bug report](https://bugzilla.redhat.com/show_bug.cgi?id=2216936) filed to the Red Hat Bugzilla:

> A segmentation fault was discovered in SQLite. This issue exists due to a boundary error within the /sqlite3_aflpp/shell.c which could allow a local user to send a specially crafted request to the database to trigger memory corruption and perform a denial of service (DoS) attack.

Yeah, the local user could perform a denial of service attack against _themselves_ by passing a bad argument to the `sqlite3` CLI tool and making it exit immediately. But 'specially crafted request to the database'? Come on. Here's the 'specially crafted' request:

```
% sqlite3 -nonce
zsh: segmentation fault  sqlite3 -nonce
```

This never even reaches the database. The CLI exits immediately. These are the kinds of vulnerabilities that are getting filed nowadays: https://nvd.nist.gov/vuln/detail/CVE-2023-36191

This is described as:

> sqlite3 v3.40.1 was discovered to contain a segmentation violation at /sqlite3_aflpp/shell.c.

What it fails to mention is that it's a segfault in the CLI tool which causes it to exit immediately. I mean sure, if you explicitly pass the incorrect `-nonce` flag to the tool, you can make it crap out and it will fail whatever script or interactive work you wanted to do. But is this a vulnerability? Come on.
Learn to Test, Test to Learn
Published: 2023-08-13 19:22:06

The past few weeks have been spent studying diligently to learn an unfamiliar stack. I've been taking classes on Angular, Java, Spring Boot and development methodologies. The most intriguing subject I have started to learn is test-driven development, something that I have never used in my work before. 

This week, I've been learning Jasmine, and I'm starting to understand how crucial it is to test your components before deciding to use them. I've had arguments over testing at dinner tables with other developers; some saw its value, while others believed that writing components or code blocks twice would reduce their efficiency. 

Even though writing tests may be tedious, as a new developer I can see the importance of testing. I don't want to accidentally write bad code and have it pushed to production,  or inadvertently be responsible for making bugs and easy mistakes. 

There are a lot of nice features about Jasmine as well! I like that it's written in a plain english format. It's easy to understand the tests that you are writing, and plainly stating what is expected of the tests. 

The importance of writing tests in order to become a better developer is paramount to my personal journey. As I continue learning and growing, I want to put my best foot forward, lear best practices, and writing the best possible code. Creating clean, error free, and creative code is my ultimate goal. 

In closing, I would like to share a quote that I came across while researching test driven development by Kent Beck. 

“If you're happy slamming some code together that more or less works and you're happy never looking at the result again, TDD is not for you. TDD rests on a charmingly naïve geekoid assumption that if you write better code, you'll be more successful. TDD helps you to pay attention to the right issues at the right time so you can make your designs cleaner, you can refine your designs as you learn.”
― Kent Beck, Test-Driven Development: By Example
count(*): The Most Efficient Way to Count Rows in Your Table
Tags: database, sql
Published: 2023-08-13 19:08:37

Have you ever heard people say that `select(*)` is inefficient because it pulls back every column in the table? Well, they're right! But did you know that `count(*)` is actually the most efficient way to count all of the rows in your table?

## Why is `count(*)` efficient?

When you use `count(*)`, the database engine will use an index to count the rows. The index that it uses is called the smallest secondary index available. This means that the database engine will only have to read a small amount of data to count the rows, which makes the query very efficient.

## What if I want to count a specific column?

If you want to count a specific column, you can use `count(column_name)`. However, this will not be as efficient as `count(*)`, because the database engine will have to read all of the rows in the table to count the number of rows that contain a non-null value for the specified column.

## Proof of Concept

To prove that `count star` is the most efficient way to count rows, let's run a quick experiment. We'll create a table with 1 million rows and then use both `count(*)` and `count(id)` to count the number of rows.

```SQL
-- Used PostgreSQL v15
CREATE TABLE my_table (
  id SERIAL PRIMARY KEY,
  name VARCHAR(255) NOT NULL,
  birthday DATE NOT NULL
);

INSERT INTO my_table (name, birthday)
SELECT
  'Name' || n,
  '2000-01-01'::DATE + n * '1 day'::INTERVAL
FROM generate_series(1, 1000000) AS n;

-- Query #1
select count(*) from my_table;

-- Query #2
select count(id) from my_table;
```

The results of the experiment are as follows:

![Query #1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bw2uxi2p0l3k833nka67.png)

![Query #2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u5m4yhq0lh7wl8yp5jiz.png)

As you can see, the results of both queries are the same. However, the `select count(*)` query was much faster. This is because the database engine was able to use an index to count the rows, while the `select count(id)` query had to read all of the rows in the table.

## Conclusion

If you need to count the rows in a table, the most efficient way to do it is to use `count(*)`. This will ensure that the query is as fast as possible, even if the table contains a large number of rows.