DEV Community: JAI NIRESH J

A Time Voyage for Tunes 🎵

JAI NIRESH J — Thu, 19 Dec 2024 11:40:32 +0000

This is a submission for the DevCycle Feature Flag Challenge: Feature Flag Funhouse

What I Built

Welcome to our Time-Traveling Music Store, where every visit takes you on a nostalgic journey through the decades. Leveraging a dynamic feature flag, the store adapts to showcase music from any chosen year, immersing you in an authentic experience of that era.

For example, select 1999 to explore the hits of the late '90s, accompanied by a website design reminiscent of that era’s retro aesthetics. If you choose 1945, the store transforms into a vintage interface, echoing the charm and style of mid-century design, while displaying iconic music from the time.

For modern-day enthusiasts, the experience updates with sleek and cutting-edge designs for 2023, 2024, and beyond, offering the latest tracks and an ultra-modern interface.

You can refresh the page or click a dedicated button to fetch new music from the year you’ve selected, keeping your musical exploration as dynamic as time itself.

Demo

Demo walkthrough on the application :

Live website link :
https://time-travel-shop-react.onrender.com

When you travel back to 1990, here is how the website would look, a real 1990 feel , and the retro styles would make you feel nostalgic.

A space themed timeline that conveys your current position in time, and has the TIME TRAVEL button on it. (Click it)

The slider that allows you to choose, the year that you wanna time travel to , therefore choosing 1956 as your destination year , and click on "Travel here":

Hold tight, your into quantum space ....

The olden 1956's website, with music from the same year :

Feeling enough of olden music, travel back to the modern era to listen to modern music !

The Modern era website :

Click on change carousel, to display new styles of carousel :

My Code

jainiresh / time-travel-shop-react

This is a submission for the DevCycle Feature Flag Challenge: Feature Flag Funhouse

What I Built

For modern-day enthusiasts, the experience updates with sleek and cutting-edge designs for 2023, 2024, and beyond, offering the latest tracks and an ultra-modern interface.

You can refresh the page or click a dedicated button to fetch new music from the year you’ve…

View on GitHub

jainiresh / time-travel-shop-react-server

This is a submission for the DevCycle Feature Flag Challenge: Feature Flag Funhouse

What I Built

For modern-day enthusiasts, the experience updates with sleek and cutting-edge designs for 2023, 2024, and beyond, offering the latest tracks and an ultra-modern interface.

You can refresh the page or click a dedicated button to fetch new music from the year you’ve…

View on GitHub

Other tools used

MusicBrainz API : I made use of the MusicBrainz API, for fetching the music from different years.
Redux : I made use of Redux for state management varying from music to time year managing.
archive.io : I made use of archive.io to fetch the thumbnail images of the music that were fetched, to be displayed.
Youtube Search API : I made use of the Youtube search api key, to search, fetch and play the video music of the selected track.

My DevCycle Experience

We leveraged the YEAR (as time), as our feature flag variable, and used this variable as a feature flag, changing the current era of experience on the website.

Changing the YEAR in the website, would trigger a feature flag update API (Refer devcycle's management API for more info), and updates the year on the feature flag.

This update internally rerenders the whole application, making it feel as if the website had time travelled to any year possible.

Working with devCycle was super easy, especially with their documentation.
We personally feel this would be a game changer on the world of feature flags, provided their support to multiple client and server side SDKs, which are becoming and have become quite popular.

Additional Prize Categories

OpenFeature Aficionado : My submission is also eligible to the above mentioned Additional Prize category, since my application is using OpenFeature of React client SDK from dev cycle.

Security headers

JAI NIRESH J — Thu, 21 Nov 2024 13:13:57 +0000

SafeTransfer Hub: Contactless and Secure End-to-End Encrypted File Sharing

JAI NIRESH J — Mon, 14 Oct 2024 05:44:03 +0000

This is a submission for the The Pinata Challenge

What I Built

I built SafeTransfer Hub, a secure file-sharing application where users can create accounts, and without sharing any personal information like phonenumbers, emails with other users can send and receive files securely. The core idea is that files can be uploaded and targeted to specific recipients in the app, with top-tier security through encryption.

Encryption Mechanism

SafeTransfer Hub employs a hybrid encryption approach using both symmetric and asymmetric encryption for robust security. The process is as follows:

Upon registration, each user is assigned a public key and a private key.
When a sender uploads a file targeting a recipient, the file is encrypted with the recipient's public key.
The encrypted file is stored on Pinata and added to a global file pool visible to all users, including the recipient.
While anyone can view file entries, all files remain encrypted. Users can attempt to decrypt files using their private key.
If the file is not intended for that user, their private key cannot decrypt it, ensuring privacy and security.
The application provides an abstraction in the form of "Unlock" and "Unlock All" buttons, which automatically handle the decryption process in the background. The "Unlock All" feature attempts to decrypt all files in the system, but only files intended for the user are successfully unlocked, as only their private key can decrypt them.

Global Pool, Yet Secure

All users in the system can view a global pool of files—entries for every file uploaded—but files remain completely inaccessible unless the user is the intended recipient. When someone tries to access a file they don’t own, they won’t be able to decrypt it because the file is locked with the recipient’s public key, and only that recipient can use their private key to unlock it.

This ensures that files can be securely stored and transferred between users without any unauthorized access, making it an ideal platform for sharing sensitive information.

Demo

Here is the live website link : Live website

Client side code :

jainiresh / pinata_Secure_Vault_Client

This is a submission for the The Pinata Challenge

What I Built

Encryption Mechanism

SafeTransfer Hub employs a hybrid encryption approach using both symmetric and asymmetric encryption for robust security. The process is as follows:

Upon registration, each user is assigned a public key and a private key.
When a sender uploads a file targeting a recipient, the file is encrypted with the recipient's public key.
The encrypted file is stored on Pinata and added to a global file pool visible to all users, including the recipient.
While anyone can view file entries, all files…

View on GitHub

Server side code :

jainiresh / Pinata_secure_vault_server

This is a submission for the The Pinata Challenge

What I Built

Encryption Mechanism

SafeTransfer Hub employs a hybrid encryption approach using both symmetric and asymmetric encryption for robust security. The process is as follows:

Upon registration, each user is assigned a public key and a private key.
When a sender uploads a file targeting a recipient, the file is encrypted with the recipient's public key.
The encrypted file is stored on Pinata and added to a global file pool visible to all users, including the recipient.
While anyone can view file entries, all files…

View on GitHub

More Details

SafeTransfer Hub is built with simplicity, security, and user privacy in mind. Users can safely store and share files with recipients while being assured that no one else can access their data.

Detective Simulator - Powered by pinata

JAI NIRESH J — Thu, 10 Oct 2024 06:44:19 +0000

This is a submission for the The Pinata Challenge

What I Built and Why

This is a full fledged crime investigation scenario simulation game, mocking a real life crime investigation, using AI , Email apis and PINATA , managing file uploads and displays to give you a simulation of a real investigation scenario.

Haven't each and everyone, dreamt about investigating and finding clues, leading to the ground breaking discovery of the villains/culprits, like the ones they show in the movies.

well, this one is a complete crime solver, leveraging AI to give yout the exact simulation you need, along with the frontend magic that make you feel you are investigaing a real crime scene.

Demo

Live Deployed version : https://ai-solvethecase-clientside.onrender.com

Code

Our client : https://github.com/jainiresh/AI-SolveTheCase-Client
Our server : https://github.com/jainiresh/AI-SolveTheCase

jainiresh / AI-SolveTheCase-Client

This is a submission for the The Pinata Challenge

What I Built and Why

Haven't each and everyone, dreamt about investigating and finding clues, leading to the ground breaking discovery of the villains/culprits, like the ones they show in the movies.

well, this one is a complete crime solver, leveraging AI to give yout the exact simulation you need, along with the frontend magic that make you feel you are investigaing a real crime scene.

Demo

Live Deployed version : https://ai-solvethecase-clientside.onrender.com

Code

Our client : https://github.com/jainiresh/AI-SolveTheCase-Client Our server : https://github.com/jainiresh/AI-SolveTheCase

{% embed https://github.com/jainiresh/AI-SolveTheCase-Client %} {% embed https://github.com/jainiresh/AI-SolveTheCase %}

Feature Workflows

Since this is a crime investigating simulation game, we used Nylas…

View on GitHub

jainiresh / AI-SolveTheCase

This is a submission for the The Pinata Challenge

What I Built and Why

Haven't each and everyone, dreamt about investigating and finding clues, leading to the ground breaking discovery of the villains/culprits, like the ones they show in the movies.

well, this one is a complete crime solver, leveraging AI to give yout the exact simulation you need, along with the frontend magic that make you feel you are investigaing a real crime scene.

Demo

Live Deployed version : https://ai-solvethecase-clientside.onrender.com

Code

Our client : https://github.com/jainiresh/AI-SolveTheCase-Client Our server : https://github.com/jainiresh/AI-SolveTheCase

{% embed https://github.com/jainiresh/AI-SolveTheCase-Client %} {% embed https://github.com/jainiresh/AI-SolveTheCase %}

Feature Workflows

Since this is a crime investigating simulation game, we used Nylas…

View on GitHub

Feature Workflows

Since this is a crime investigating simulation game, we used Nylas API and an AI agent to form a thread of emails, for each case, which has the content of the crime story, context, input or the investigation , along with a descriptive image of the crime.

Each of the case that you newly open, a new thread is opened for the current user, and is maintained throughout untill the case gets solved.

There are a lot of features implemented here, which will be discussed below.

Here is a sample workflow,

Make sure you provide access to your account, and proceed.

Read the INSTRUCTIONS carefully, to start playing the game.

You can choose to enter your own input, or click to copy the AI generated one, and paste it.

Now you will be redirected to the main Rules and Engagements page, which you have to look carefully and understand the game, about how to play it.

Upon closing the previous dialog, you will be presented with the actual AI created story context, with help of your input as below.

Additionally, for portable view and summarized view, you would also be receiving the case details in your inbox , that has a well formatted structure, like :

You can start investigating about the people you met, referring the sample suggestions, in the investigation input

This is how you would receive the response, of your investigation. A well written response, along with a safe image generated, that matches with the response.

You would also receive each investigation of yours, in your email as well, as a snigle thread of emails per case.

Similarly, you can perform any number of investigations as you please, and you would have a neatly arranged investigation panel, with all of them at your ease of access

Your email inbox thread would look like this :

Feeling fun, or difficult to solve it yourselves ? You can choose to invite your friends, using the button

All your investigations will be shared with your friend's email as well, and he can read your investigations from the email itself as well, or he can choose to login to the game with his invited email to investigate more by himself.

The case gets solved / closed, if atleast one player per case submits an answer.

Close the final dialog box, to exit the case and start a new one.

Feature overview

User can start with just their SSO email address with well known third party hosted authentication.
User can input their own custom day's experience, or opt to choose an AI generated one.
Users receive awesome text images, in response to the investigations, and the story.
Each of the gerenated image is been uploaded to pinata, and pinata powers and drives the file uploads and retrieval for the application.
Users can choose to view their friends, to invite to the game.
Invited friends, and Uninivited friends are segregated in the UI
Investigations performed, upto the point of inviting will be shared the invited friend.
The UI shows only the investigation made by the current logged in user.
The email thread of a particular case shows the investigations made by all the people who are invited to that case.
You can revisit the rules, story context, or the day input whenever you please.

More details

PINATA

Pinata is used to store , upload and retrieve the AI generated images that are being sent via the email, as well as to the frontend for simulation.

AI products

gemini-1.5-flash , for story and investigation text generation.
@cf/stabilityai/stable-diffusion-xl-base-1.0, for image generation.

Third party products have been used for efficient email communication, and contacts retrieval.

PINA-AI : A simple AI generated image hosting solution

JAI NIRESH J — Tue, 08 Oct 2024 18:26:58 +0000

This is a submission for the The Pinata Challenge

What I Built

Many AI image generation models output only image blobs, which can create a significant challenge for developers seeking reliable hosting solutions. This often involves a tedious series of steps to find an appropriate hosting service and integrate it into their workflow.

Enter PINA-AI Image hosting: my project streamlines this process by providing a comprehensive solution for generating and hosting AI images in one seamless package. I have packaged this functionality into an npm module, making it even easier for developers to access and utilize.

With PINA-AI Image hosting, users can effortlessly generate images of various open-source tools such as Hugging Face, OpenAI, and Cloudflare, etc.,. Developers can choose any of these options to generate images through a simple function call, which returns the hosted URL as a response. This integration eliminates the hassle of managing separate hosting arrangements and allows developers to focus on their projects rather than the complexities of image management.

By combining image generation and hosting into a single, user-friendly npm package, Pina-AI Image Hub serves as a valuable resource for developers looking to enhance their workflows and showcase their projects with minimal effort.

Demo

Npm package link :

ai-generate-and-pinata-host - npm

> Smart solution for hosting AI generated images. Latest version: 1.1.1, last published: 6 days ago. Start using ai-generate-and-pinata-host in your project by running `npm i ai-generate-and-pinata-host`. There are no other projects in the npm registry using ai-generate-and-pinata-host.

npmjs.com

My Code

Source code :

jainiresh / AI-ImageUploader-Pinata

ai-generate-and-pinata-host

Smart solution for hosting AI generated images

Why

Offers popular integrated AI image generation options from Hugging Face, OpenAI, and Cloudflare.
Automatically hosts generated images on Pinata’s Web3 platform, returning a usable URL immediately.
Solves the hosting problem for developers who need to quickly store and access AI-generated images.
Flexible, decentralized hosting without the need for centralized storage services.

Why not

Requires setting up Pinata API keys for hosting, which adds a bit of configuration overhead.
You may need to manage API rate limits depending on the image generation tool used (e.g., OpenAI, Hugging Face).

Prerequisite

A valid Pinata account with access to API keys for file hosting.
API keys or access tokens from Hugging Face, OpenAI, Cloudflare, or any supported AI image generation service.

Install

npm install ai-generate-and-pinata-host@latest

Config

Make sure you have your .env file populated with the mandatory and…

View on GitHub

More Details

Pina-AI Image Hub leverages the Pinata IPFS service to provide seamless image hosting. Here are some clear examples of how Pinata is integrated into the project:

1. Image Uploading:
After generating an image blob using one of the supported AI models (e.g., Hugging Face, OpenAI, Cloudflare), the package automatically uploads the image to Pinata. This is done through a NODE JS SDK's functional call, ensuring that users don't have to deal with complex hosting configurations.

2. Quick Access: Once uploaded, the hosted image is immediately accessible via the returned URL. This allows developers to integrate the generated images into their projects without waiting for manual uploads or other delays.

*3. Pinata Service Integration: *
The package utilizes the Pinata node js sdk service to handle uploads. When the user calls the function to generate an image, the image blob is sent directly to PinataSDK, which returns a unique IPFS URL. This URL can then be used anywhere—be it in documentation, presentations, or shared with others.

4. Example with Multiple Tools:
Users can easily switch between different AI models when generating images. The package abstracts the complexity, allowing for straightforward usage.

5. Error Handling: The integration includes robust error handling to manage potential issues during the upload process. If an upload fails (e.g., due to network issues), the package provides informative error messages, guiding users on how to resolve the problem.

RESUME SPAMMER - No more stressing over sending resumes

JAI NIRESH J — Mon, 02 Sep 2024 07:06:27 +0000

This is a submission for the Nylas Challenge: Galaxy Brain.

What I Built and Why

I have built an job applying automation setup, that helps unemployed people out there to apply to any number of job vacancies , leveraging from "Naukri"'s api, via email.

You no more need to modify each resume, depending on the job you are applying for.

Just login to the application, allows email access via nylas , and fill up the necessary information once, and you can generate more than 50, even a hundred ready to send unique resumes, each one different and unique adaptable to the role you are applying for.

You no more need to modify each resume, depending on the job you are applying for.

Demo

Code

This is my public github repo containing my code.

jainiresh / JobAutomator

Who is it for ?

Unemployed, or people who search for another job while in a job, can utilize this, and can create hundreds of draft resumes, to apply for current in vacant job positions, that are hosted in Naukri.

TECH STACK

Naukri's endpoint is used, to send a keyword and get the current intrend job vacancies, and google's gemini flash model has been used to create resumes, with your skills, and the expectation of the naukri posted job requirements, to give you an unique resume for each and every job, directly to your email draft box.

You can directly include the company's email to the draft, and send it quickly.

Your Journey

It was a really an amazing learning cum thinking out of the box, when everyone creates email related schedulers etc., i thought to help the unemployed out there, and this actually helps me myself

MYSTERY TRAILS - Bring out the detective in you

JAI NIRESH J — Mon, 26 Aug 2024 19:52:56 +0000

This is a submission for the Nylas Challenge: AI Expedition, and Galaxy Brain

What I Built and Why

This is a full fledged crime investigation scenario simulation game, mocking a real life crime investigation, using AI and Nylas api's to give you a simulation of a real investigation scenario.

Haven't each and everyone, dreamt about investigating and finding clues, leading to the ground breaking discovery of the villains/culprits, like the ones they show in the movies.

well, this one is a complete crime solver, leveraging AI to give yout the exact simulation you need, along with the frontend magic that make you feel you are investigaing a real crime scene.

Demo

Live Deployed version : https://ai-solvethecase-clientside.onrender.com

Code

Our client : https://github.com/jainiresh/AI-SolveTheCase-Client
Our server : https://github.com/jainiresh/AI-SolveTheCase

jainiresh / AI-SolveTheCase-Client

This is a submission for the The Pinata Challenge

What I Built and Why

Haven't each and everyone, dreamt about investigating and finding clues, leading to the ground breaking discovery of the villains/culprits, like the ones they show in the movies.

well, this one is a complete crime solver, leveraging AI to give yout the exact simulation you need, along with the frontend magic that make you feel you are investigaing a real crime scene.

Demo

Live Deployed version : https://ai-solvethecase-clientside.onrender.com

Code

Our client : https://github.com/jainiresh/AI-SolveTheCase-Client Our server : https://github.com/jainiresh/AI-SolveTheCase

{% embed https://github.com/jainiresh/AI-SolveTheCase-Client %} {% embed https://github.com/jainiresh/AI-SolveTheCase %}

Feature Workflows

Since this is a crime investigating simulation game, we used Nylas…

View on GitHub

jainiresh / AI-SolveTheCase

This is a submission for the The Pinata Challenge

What I Built and Why

Haven't each and everyone, dreamt about investigating and finding clues, leading to the ground breaking discovery of the villains/culprits, like the ones they show in the movies.

well, this one is a complete crime solver, leveraging AI to give yout the exact simulation you need, along with the frontend magic that make you feel you are investigaing a real crime scene.

Demo

Live Deployed version : https://ai-solvethecase-clientside.onrender.com

Code

Our client : https://github.com/jainiresh/AI-SolveTheCase-Client Our server : https://github.com/jainiresh/AI-SolveTheCase

{% embed https://github.com/jainiresh/AI-SolveTheCase-Client %} {% embed https://github.com/jainiresh/AI-SolveTheCase %}

Feature Workflows

Since this is a crime investigating simulation game, we used Nylas…

View on GitHub

Feature Workflows

Each of the case that you newly open, a new thread is opened for the current user, and is maintained throughout untill the case gets solved.

There are a lot of features implemented here, which will be discussed below.

Here is a sample workflow,

Make sure you provide access to your account, and proceed.

Read the INSTRUCTIONS carefully, to start playing the game.

You can choose to enter your own input, or click to copy the AI generated one, and paste it.

Now you will be redirected to the main Rules and Engagements page, which you have to look carefully and understand the game, about how to play it.

Upon closing the previous dialog, you will be presented with the actual AI created story context, with help of your input as below.

Additionally, for portable view and summarized view, you would also be receiving the case details in your inbox , that has a well formatted structure, like :

You can start investigating about the people you met, referring the sample suggestions, in the investigation input

This is how you would receive the response, of your investigation. A well written response, along with a safe image generated, that matches with the response.

You would also receive each investigation of yours, in your email as well, as a snigle thread of emails per case.

Similarly, you can perform any number of investigations as you please, and you would have a neatly arranged investigation panel, with all of them at your ease of access

Your email inbox thread would look like this :

Feeling fun, or difficult to solve it yourselves ? You can choose to invite your friends, using the button

The case gets solved / closed, if atleast one player per case submits an answer.

Close the final dialog box, to exit the case and start a new one.

Feature overview

User can start with just their SSO email address with Nylas hosted authentication.
User can input their own custom day's experience, or opt to choose an AI generated one.
Users receive awesome text images, in response to the investigations, and the story.
Users can choose to view their friends, to invite to the game.
Invited friends, and Uninivited friends are segregated in the UI
Investigations performed, upto the point of inviting will be shared the invited friend.
The UI shows only the investigation made by the current logged in user.
The email thread of a particular case shows the investigations made by all the people who are invited to that case.
You can revisit the rules, story context, or the day input whenever you please.

Nylas and AI Role in the project

NYLAS products

Nylas EMAIL API has been utilized to send email investigations, story contexts to the players.
(https://github.com/jainiresh/AI-SolveTheCase/blob/master/service/nylasService.js)

Nylas CONTACTS API has been utilized as a means to share the case with your contacts/friends.
(https://github.com/jainiresh/AI-SolveTheCase/blob/master/routes/contactRouter.js)

Nylas Hosted Authentication is used to authenticate users, fetch their grantIDS and email and other information about them.

AI products

gemini-1.5-flash , for story and investigation text generation.
@cf/stabilityai/stable-diffusion-xl-base-1.0, for image generation.

Journey

It has been an incredible learning cum out of the box thinking experience.
The first challenge was the usecase.

DP - Memoization, The Esoteric concept, busted out in a line.

JAI NIRESH J — Sat, 22 Jun 2024 19:05:57 +0000

This is a submission for DEV Computer Science Challenge v24.06.12: One Byte Explainer.

Explainer

Memoization is like a Tile Fall Race, where the initial runners spend their lives clearing out the fake tiles, making it easy, time effective, and fast for the latter people to run on the right tile. Though they start from the start, they finish off fast.

Additional Context

Tile fall :
It is a fictious race, popular on games, like "Stumble Guys" .
Where group of players try to reach from one end to the other, trying to cross a look alike group of tiles.
Only to find, only a few are strong, and others fall on being stepped on.

The MoodScout, An innovative invention for those unplanned lazy geeze

JAI NIRESH J — Sat, 22 Jun 2024 18:22:47 +0000

This is a submission for the Twilio Challenge

What I Built

We have built a Mood Scout web application, which takes in your mood or "what you feel like doing, right now", as an input, and suggests you the best places according to your mood, around you with their directions, sent right down to your phone for easy navigation.

The AI catch of our application

Unlike the exisiting location finders, place finders, maps, blah, blah, etc.,
This application leverages Google's Gemini AI, in getting suggestions of places, according to the user's mood !
Whose data is then processed along with the geo location and returned.

A Simple Yet Innovative Idea ...

TECH STACK

Twilio (Our sponsor)

Handling our messaging service, and delivering instant directions and links to our consumers.

Python 3.11

Used due to it's Robust and fast natured theme, and optimized perfomance.

Flask
Gemini AI

Our AI providing the life to our application, giving the AI'esthetic touch we need, in our place suggestions.

OpenCage Maps

Improved accuracy, on getting precise locations

Google Maps

The distance matrix api key, providing with real time distance, and time information between source and the destination.

The Architecture

Demo

GitHub github.com
Web URL Live Url

Short video of the application

The Head

The Protagonist

The content page, that lists down all the releveant places your mood would love to be.

The cameo

Using our awesome Twilio's api to send directions right down to our phone number :

The Feel Good

Here comes our directions.

Twilio and AI

The traditional fetch from API / DB is so boring, and redundant.
How about leveraging our AI, to pickup the scent of our mood, and automatically suggest places around us for the best feel.

Not to mention, our awesome Twilio's SMS integration, allowing a free flow of SMS to the consumers, for instant directions and sending other links.

Additional Prize Categories

Yes, our submission qualifies for

"Impactful Innovators" and
"Entertaining Endeavors"

The reason for "Impactful Innovators" being :
A lot of foreigners or ourselves when we visit a new place, or a city end up getting unplanned for the day, most of the time.
Our application, gets just your mood as an input via a web interface, and suggests you the best spots/places, to feel your best.

This is a must use application, for all those unplanned travellers, to explore a lot on every new place they travel to.

The reason for "Entertaining Endeavors" being :
Not only it does cover the spots like, temples, forts, etc.,
But also it can take in your mood to give you good pubs, drink bars, and fun activity malls, which gives you the real fun of new places.