teleren/devto huggingface dataset:
National Identity-focused Social Platform
Tags: devchallenge, awschallenge, amplify, fullstack
Published: 2024-05-27 04:35:53

*This is a submission for the [The AWS Amplify Fullstack TypeScript Challenge](https://dev.to/challenges/awschallenge)*

## What I Built

#### General Overview
A social platform that connects people worldwide by celebrating different national identities and cultures. It's perfect for expatriates, global enthusiasts, and anyone interested in exploring cultural diversity. Users can share their traditions, discuss important issues, and learn about various countries in a straightforward and engaging way. This platform aims to build understanding and cooperation among its global community.

#### Technical Overview
This application is built on top of the starter pack environment that AWS Amplify Gen 2 docs provided. It includes all **FOUR INTEGRATIONS** but the UI and everything frontend is done from scratch. 

## Demo and Code

<!-- Share a link to your Amplify App and source code. Include some screenshots as well. -->

### Design 
## Home

![Main Page](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7rjibfrmvu4vukclawde.png)


## Profile and Settings

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

## Login/Signup Page

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

Link to my Github Repository: [Github Link](https://github.com/FloratobyDev/culture-application) 

Link to my app: [Culture Application](https://deploy-branch.d3vdeei8om1244.amplifyapp.com/)

**Note: If you're trying to sign up, you will have to reload the site once you're in and log in. Once you see your email at the top right, that indicates that you are logged in. Sorry for the inconvenience. I tried.**



## Integrations

#### Amazon Cognito
Used mainly for user authentication and preliminary data storage.

#### AWS Lambda
 - Post confirmation trigger that creates a new user to the User table in DynamoDB.

#### DynamoDB
 - Main database for storing new data for connections, messaging, notifications, categories, etc.

#### S3
 - Profile Picture storage

#### AppSync
 - GraphQL and PubSub APIs to connect my application to my data and events.

#### IAM and IAM Identity Center
 - Roles and policies for services and more.

**Feature Full**
Switching to Vite from React-Scripts
Tags: webdev, javascript, react, vite
Published: 2024-05-27 04:19:34


I have a silly react project that I’m working on that I made using [create-react-app](https://create-react-app.dev/). By default, these kinds of projects build and run using [react-scripts](https://github.com/facebook/create-react-app/tree/main/packages/react-scripts) which uses webpack [under the hood](https://github.com/facebook/create-react-app/blob/main/packages/react-scripts/scripts/build.js) for building projects. [Vite](https://vitejs.dev/) is generally known to be faster than Webpack ⚡ so I was curious about how to swap them.

Installation is simple enough, there’s two dev dependency modules that need to be included:
[Vite](https://www.npmjs.com/package/vite) and [Vite’s React Plugin](https://www.npmjs.com/package/@vitejs/plugin-react)

To utilize Vite, start by creating a `vite.config.js` file. Here’s a very basic example of what I added:

```jsx
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
	plugins: [react()].
	root: 'src',
});
```


Since Vite uses `index.html`  as the entry point for the application, I moved it out of my `public` folder and into my `src` folder. I removed the `%PUBLIC_URL%` part from my HTML file and added a script to point to where my react root was created:

`<script type='module' src='./index.tsx'></script>`

All that’s left is to replace the scripts in `package.json` to use [vite commands](https://vitejs.dev/guide/cli.html) instead and remove `react-scripts`  as a dependency. 🎉
Sonoran Sleep Center
Published: 2024-05-27 04:14:45


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hh1btpmuv8pozo1blpvi.jpg)
[Sonoran Sleep Center](https://www.sonoransleep.com/
) in Phoenix, Arizona, specializes in diagnosing and treating sleep disorders for individuals aged four and older. Operated by physicians, the center employs a holistic approach, integrating current scientific research and state-of-the-art technology. A multidisciplinary team, including [sleep specialists](https://www.google.com/maps?cid=12309298806079504130), psychologists, and technologists, collaborates to create customized treatment plans. The center also provides patient education on sleep hygiene and conducts advanced sleep studies for various issues such as insomnia and sleep apnea.

Address : 5620 W Thunderbird Rd Suite B3, Glendale, Arizona, 85306, USA

Phone : (602) 206-6262

Business Email : info@sonoransleep.com

Website : [https://www.sonoransleep.com/](https://www.sonoransleep.com/)

Connect with us:

[Sonoran Sleep Center On Facebook
](https://www.facebook.com/sonoransleep
)
[Sonoran Sleep Center On Instagram
](https://www.instagram.com/sonoransleep/
)
[Sonoran Sleep Center On Linkedin
](https://www.linkedin.com/company/sonoransleep
)
[Sonoran Sleep Center On Twitter
](https://x.com/sonoransleep
)

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6dwzk9k6dm7cbpwyvddn.jpg)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dje4du8ahi7ulthf7hvu.jpg)
Dummy ticket
Tags: dummyticket, dummyairticket, dummyflightticket
Published: 2024-05-27 04:11:42

A legal document that can be used for immigration, evidence of return, visa filing, and other purposes is called a dummy ticket. It has a live PNR that you may view by using Manage My Booking or Manage My Trip on the airline website. It has every detail, including the actual ticket, the travel route, the date of the trip, the contact information, the name of the passenger, and the PNR.
In less than ten minutes, you can obtain a verified dummy ticket for just INR200/$3.
Visit https://www.onlinedummyticket.com to purchase a dummy ticket now.
[DAY 21-23] I Built A Palindrome Checker, Music Player, & Date Formatter
Tags: beginners, learning, javascript, webdev
Published: 2024-05-27 04:02:36

Hi everyone! Welcome back to my blog where I document the things I learned in web development. I do this because it helps retain the information and concepts as it is some sort of an active recall.

On days 21-23, I built a palindrome checker, a music player, and a date formatter to learn basic string, array methods, date objects, and to complete part 1 of the Data Structures & Algorithms certification project.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nerv2vxzyulpmyw3k6da.PNG)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/txqcpgk2sooo4bcs903y.PNG)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1xl7l4vw76xfkkn2rpy1.PNG)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/il18mcphiaz7atlcot26.PNG)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jovra41j8tyfk9nwv49j.PNG)
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3r2c9metuu22jqikruse.PNG)

4 things I learned:

1. Using a spread syntax (e.g. `[…arrayName]`) to call an entire array.

2. To use arrow function/callback function (e.g. `const variableName = (parameter) => {logic;}` or `()=>{}`)

3. Chaining multiple methods together (e.g. `variableName.method1().method2().method3()`);

4. Optional chaining to prevent errors when accessing nested properties that might be null or undefined. (e.g. `arrayName?.array[]`)

I finished part 1 of the Data Structures & Algorithms certification project. Because of that, I was finally able to connect together the concepts of variables, linking DOM elements, functions, and if-else statements. It’s so freaking good to feel a sense of progress by understanding the syntaxes I used in building the palindrome checker.

However, I feel like I need more time and practice with freecodecamp’s coding challenges and keep moving forward with the course. You know what they say, more practice leads to more experience and more experience = more learnings.

Anyways, that’s all for now, thank you for reading. I’ll see you all next blog!
Game Development Diary #6 : Weekend
Published: 2024-05-27 03:41:58

25/05/2024 - Sunday

# Today’s Progress: 
No development work was conducted on the game today.

#Thoughts: 
Even though no direct technical work on the game was done today, I read a book called Theory of Fun for Game Design: Edition 2 by Raph Koster. 

Here is what I've got from this book :

##Understanding Fun: 
Koster examines what makes games fun, suggesting that fun arises from learning, comprehension, and mastery. He proposes that we are evolutionarily programmed to enjoy learning because it has historically improved our chances of survival.

##Learning Patterns: 
The book discusses how games teach us through patterns. These patterns can range from calculating odds and predicting events to understanding social power and status. Games become boring when there’s nothing new to learn or when they’re too easy or too difficult.

##Designing for Engagement: 
Koster emphasizes the importance of creating games that are engaging, entertaining, and addictive. He presents ideas on how to improve game designs to incorporate a high degree of fun.

##Cultural Influence: 
The book also touches on how games serve as powerful learning tools and the influence they have on culture. It encourages designers to think beyond traditional game mechanics and consider the ethical implications of entertainment.

#Plans for Next Session: 
Continue to my GameDevTV's course
3 🎴JAPAN Disease Every Developer Should Know🎎
Tags: webdev, developer, opensource, beginners
Published: 2024-05-27 02:28:47

### Minamata Disease

- Japan city minamata, kumamoto prefecture 1956 - first case

- Acetylene - Acetaldehyde using Mecury-catalyzer 

- By-prouduct - Methylmercury MeHg

- Chisso Co. Ltd. (1932-1950s-1968) - $86 million compensation (by 2004)

- central nervous system is damaged 
	- ataxia (difficulty coordinating movement of hands and feet)
	- concentric constriction of the visual field (narrowing of the field of vision)
	- hearing impairment

- Flowchart
industrial wastewater ↓ Fish shellfish  ↓ minamata Bay & shiranui sea - local population

`Human - 2,265 victims (March 2001)`
`Cats - dancing cat fever` 🐈

---

### Blackfoot Disease
- peripheral vascular disease - arsenic containing artesian well water (natural contaminant in groundwater)
- taiwan - east asia - republic of china

`Arsenic - As (silver grey)- Z=33, M=74.9`
- alloying agent, glass making, textile, paper 

---

### Itai-itai - 1968
- Cadmium polluted Jinzu River basin in Toyama Prefecture
- Severe pain in spine and joints
- cadmium poisoning = softening of bones / kidney failure (mitochondria of kidney cell damaged)
- reason :
   * silver mining, lead, copper & zinc byproduct cadmium
   * Mitsui mining & smelting Co. Ltd company realsed into rivers 

`Cadmium Cd (soft bluish white)- Z=48, M=112.4`
- used for batteries, metal coatings
- most toxic - cancer causing at work (not enterns thru skin)
- accumulates throughout life

---

Hope it helps :)
Need Guidance on Python Package Development | NFTpy
Tags: web3, python, opensource, nft
Published: 2024-05-27 02:21:06

I am new to developing Python packages and am seeking professional insight into my project, as well as some assistance in adhering to best practices and standards for package setup. The package is a toolkit for NFT integration into python scripts. This package is unique because it will eventually support all major chains and also it currently has built-in OpenSea integration and soon to be other marketplaces. I am particularly struggling with organizing the __init__.py files within the package and would greatly appreciate any help you could offer. If you have some time to assist a novice in packaging, I would be incredibly grateful. Feel free to also assist with the development as the more hands the better. Much love <3

Here are the links to my [Github Repository] (https://github.com/CoulterStutz/nftpy) as well as the [PyPI package](https://pypi.org/manage/project/nftpy/releases/)
TryOutfit: Virtual Outfit Try-On with AI
Tags: devchallenge, awschallenge, amplify, fullstack
Published: 2024-05-27 02:20:51

*This is a submission for the [The AWS Amplify Fullstack TypeScript Challenge ](https://dev.to/challenges/awschallenge)*

**TryOutfit**: Virtual Outfit Try-On with AI

I recently built an AI web application called **TryOutfit** that allows users to virtually try on outfits using AI. Powered by the IDM-VTON model from Replicate, TryOutfit provides an interactive experience for users to visualize how different outfits would look on them or on predefined models.

![screenshot of the website tryoutfit](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/30t61m8jn3qhwle9t044.png)


## How It Works

TryOutfit offers a user-friendly interface where users can either upload their own image or choose from a selection of predefined models. Once an image is selected, the application uses the IDM-VTON AI model to generate a virtual try-on of the chosen outfit on the selected image. This enables users to see how the outfit would look on them or on the model without physically trying it on.

All the model generations are automatically deleted after 1hour from database.

## Demo and Code

APP - https://www.tryoutfit.app/
Code - https://github.com/kaarthik108/tryoutfit

The application follows a serverless architecture, leveraging AWS services to handle various functionalities. User authentication is managed by Amazon Cognito, ensuring secure access to the application. User-uploaded images are stored in S3 buckets, while outfit and user data is stored in DynamoDB tables. 

The AI model from Replicate is seamlessly integrated into the application to generate the virtual try-on images. To optimize performance, webhooks are used to poll the inference results instead of waiting for the model to complete the processing. Additionally, TryOutfit offers shareable links to the generated model outfits, which remain accessible for a period of 1 hour, enabling users to easily share their virtual try-on results with others.


<img width="100%" style="width:100%" src="https://mk7iyaq7oqz5ihbw.public.blob.vercel-storage.com/tryoutfitgif-eiuPhSbL44vuZ2MIqgYeIzlZLmrZrF.gif">


## Integrations

- NEXTjs 14 (with server actions)
- AWS s3 (To store image files)
- AWS Dynamo DB (To serve product data and persist inference data)
- AWS Cognito (API Key auth)
- Replicate (AI model)
- AWS Amplify (Hosting)

**Connected Components and/or Feature Full**

StorageImage from Amplify UI was used to display the images using path from s3.

## Conclusion

Building TryOutfit using AWS Amplify and various AWS services has been a rewarding experience. Amplify simplifies the development process by providing a set of tools and services that make it easy to build scalable and feature-rich applications. The integration of AI models, such as the one from Replicate, adds an exciting dimension to the application, enabling users to virtually try on outfits from the comfort of their own devices.
HTML may be adding a native switch attribute to checkbox inputs!
Published: 2024-05-27 01:59:21

In an article called " Switching it up with HTML's latest controls" written by Daniel Yuschick. I learned that HTML may be adding a native switch attribute to checkbox inputs. Developers for years have had to use Checkbox hacks for forms that toggle between two different states. These developments have taken years but have finally been announced they are pushing the matter. Safari has also released new pseudo elements for styling hooks. Please check out the article on smashingmagazine.com for further information.
What's the method to hook into the side panel to add panels in the settings group?
Tags: elementor, help
Published: 2024-05-27 01:37:53

I want to add panels to the settings group but cannot find the hook required after viewing the dev pages. Is this possible?

![Custom settings panel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7zpmbcc9wdquxahuwkm9.jpg)
Issue with User Role-Based Authorization in ASP.NET Core 5 REST API using JWT
Tags: webdev, javascript, beginners, programming
Published: 2024-05-27 01:35:22

I am developing a REST API using ASP.NET Core 5 and have implemented JWT authentication for user login. While basic JWT authentication is working, I am facing challenges with implementing and managing role-based authorization. I need assistance to correctly set up and enforce role-based access control (RBAC) using JWT in my API.

Goals:

Implement role-based authorization in my ASP.NET Core 5 REST API.
Ensure different user roles have appropriate access to specific endpoints.
Learn best practices for managing and verifying user roles within the JWT token.
Specific Areas of Assistance Needed:

Role Management:

How can I define and manage user roles within my ASP.NET Core application?
What is the best way to include roles as claims within the JWT token?
Token Creation and Role Claims:

How should I modify the token generation process to include user roles as claims?
What steps are necessary to ensure these claims are securely included in the token?
Authorization Middleware:

How do I configure the ASP.NET Core middleware to enforce role-based authorization using the roles included in the JWT token?
What changes are needed in the Startup.cs file to support role-based policies?
Protecting Endpoints:

How do I protect specific API endpoints to allow access only to users with certain roles?
What are the best practices for applying role-based authorization attributes to controller actions?
Testing and Debugging:

How can I test role-based authorization to ensure it functions correctly for different user roles?
What tools or techniques are recommended for debugging authorization issues?
Security Considerations:

How can I secure the role claims within the JWT token to prevent tampering?
What are the best practices for handling token expiration and role updates?
Context:

Current Setup: ASP.NET Core 5, Visual Studio 2019
Project Type: Secure REST API for a multi-role web application
Existing Code Base: Basic JWT authentication implemented, need to expand to role-based authorization
Request for Assistance:
I would greatly appreciate detailed guidance, code examples, or tutorials that can help me implement role-based authorization in my ASP.NET Core 5 REST API using JWT. Specific examples of configuring roles in the [libgenis.net](https://libgenis.net), generating tokens with role claims, and securing endpoints based on roles would be extremely helpful.

Additional Information:

If needed, I can provide current code snippets related to JWT authentication for more targeted advice.
I am also open to suggestions on any additional libraries or tools that could facilitate role-based authorization.
Guidance Needed: Implementing JWT Authentication in ASP.NET Core 5 REST API
Tags: webdev, javascript, beginners, programming
Published: 2024-05-27 01:32:25

I am working on developing a secure REST API using ASP.NET Core 5 and need to implement authentication using JSON Web Tokens (JWT). I am looking for a detailed, step-by-step guide to properly set up JWT authentication, including configuration, middleware, and best practices to ensure robust security.

Goals:

Successfully implement JWT authentication in my ASP.NET Core 5 REST API. [PUBLIC SITE](https://iliteblue.us)
Ensure secure and efficient handling of user authentication and authorization.
Gain a deeper understanding of JWT and its integration with ASP.NET Core.
Specific Areas of Assistance Needed:

Initial Setup:

How do I set up the basic structure of an ASP.NET Core 5 project for REST API development?
What are the essential NuGet packages required for JWT authentication?
JWT Configuration:

How do I configure JWT authentication in the Startup.cs file?
What settings should be included in the appsettings.json file for managing JWT tokens?
Token Generation:

How can I implement a service to generate JWT tokens upon successful user login?
What are the best practices for setting token expiration and claims?
Authentication Middleware:

How do I integrate JWT authentication middleware into the ASP.NET Core request pipeline?
What steps are necessary to protect specific endpoints and ensure they require authentication?
Authorization:

How can I implement role-based and policy-based authorization using JWT?
What are the best practices for managing user roles and permissions within the API?
Security Best Practices:

How can I secure my JWT tokens to prevent common vulnerabilities such as token theft or tampering?
What are the recommended practices for refreshing and invalidating tokens?
Testing and Validation:

How do I test the JWT authentication implementation to ensure it works correctly?
What tools or frameworks are recommended for automated testing of JWT-secured endpoints?
Context:

Current Setup: ASP.NET Core 5, Visual Studio 2019
Project Type: Secure REST API for a web application
Existing Code Base: New project setup, focusing on user authentication and data protection
Request for Assistance:
I would greatly appreciate detailed guidance, code snippets, or tutorials that can help me implement JWT authentication in my ASP.NET Core 5 REST API. Specific examples of configuring the Startup.cs, generating tokens, and securing endpoints would be extremely helpful.

Additional Information:

If needed, I can provide the current state of my project or specific sections of code for more targeted advice.
I am also open to recommendations on any additional tools or libraries that could enhance security or simplify the implementation process.
Thank you in advance for your assistance!
Education and Visa Services: Shaping Your Academic and Professional Journey
Published: 2024-05-27 01:25:56

In the competitive world of academics and careers, an Education Consultancy is your key to success. An Education Consultancy is more than just a service; it's your personal narrative, your aspirations, and your unique journey. This is where our [Education Consultancy in Sydney](https://bjeducation.com.au/about) truly shines. Our Online Education Consultancy Services transcend mere words; we are your storytellers and partners in this journey. We specialize in transforming your experiences and goals into a captivating narrative that grabs the attention of admissions committees and employers.
where can I buy baby clothes from?
Published: 2024-05-26 21:41:50

As the [best children's clothing site](https://fingilii.com/) and online store for children's clothing and baby clothes with more than a decade of experience, Fingili's children's clothing site has succeeded in keeping up with the stores by adhering to three principles, easy payment, 7-day return guarantee and guaranteeing the originality of the goods. world-renowned, to become the largest branded children's clothing online store in Iran. As soon as you enter the Fingili baby clothes shopping site, you will be faced with a world of beautiful children's clothes! For every taste, there are high-quality and excellent products on the Fingili baby clothing site. Fingili's cheap children's clothing site is like a glamorous showcase with all kinds of products such as boys' clothes, girls' clothes, children's socks, children's watches, boys' sportswear sets, boys' formal wear, girls' formal wear, clothes Sportswear for girls, children's wedding dresses, home and comfort clothes, children's room signs, etc. are arranged. You can order all your needs in the field of buying children's clothes with just a few clicks and order them at home in the shortest possible time. Receive it.