feat: Added customizing with AI should also take js code and customize it with css successfully Issue 266

[MeetDOD]

Pull Request Resolves [#266 ]

Title: Added customizing with AI should also take js code and customize it with css.

Description

1. Removed ai controller and routes + packages from the backend.
2. Implement all functionality in the frontend at CustomizeWithAi.tsx. so, that it will not give stress to the backend and now the request timeout problem will get solved in deployed webapp.
3. Updated .env.example in frontend as well as in backend also add .env in frontend gitignore. for safety.
4. Now User can give JS + HTML code in input and gemini will give output according to prompt provided by the users.

Related Issues

Fixes #266

Changes Made

New features: Added customizing with AI should also take js code and customize it with css successfully.

Screenshots

Video

https://github.com/VaibhavArora314/StyleShare/assets/120380073/995dbb40-47f2-4132-b6bb-9295651e34a3

I certify that I have carried out the relevant code of conduct and provided the requisite screenshot for validation by submitting this pull request.

Thank You for this contribution.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
style-share	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 23, 2024 9:34am

[github-actions[bot]]

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

[MeetDOD]

@VaibhavArora314 I think i did the same mistake as of previous all the push of follow/unfollow is also here 😭, sorry bruh first you merge #250 then do this if any problem i will do it 🙂/😢

[MeetDOD]

looking good overall, give me some time to completely review this. in the meanwhile, just one suggestion keep the generation logic in backend since providing such secrets on frontend can be risky.

also to remove the time constraint problem maybe we can do one thing, when user customizes post, a modification is created and stored in db then after 30 sec client fetches from backend. this way we can counter the timeout request problem.

It is safe unless and untill user will not secret key, also it will stress the backend very much.

1. old

react => node => gemini => node => react

2. new

react => gemini => react

[VaibhavArora314]

looking good overall, give me some time to completely review this. in the meanwhile, just one suggestion keep the generation logic in backend since providing such secrets on frontend can be risky. also to remove the time constraint problem maybe we can do one thing, when user customizes post, a modification is created and stored in db then after 30 sec client fetches from backend. this way we can counter the timeout request problem.

It is safe unless and untill user will not secret key, also it will stress the backend very much.

1. old

react => node => gemini => node => react

2. new

react => gemini => react

I get what you are trying to say but there are other issues also with passing env variables in frontend since we are serving the build of website through express server

[MeetDOD]

looking good overall, give me some time to completely review this. in the meanwhile, just one suggestion keep the generation logic in backend since providing such secrets on frontend can be risky. also to remove the time constraint problem maybe we can do one thing, when user customizes post, a modification is created and stored in db then after 30 sec client fetches from backend. this way we can counter the timeout request problem.

It is safe unless and untill user will not secret key, also it will stress the backend very much.

1. old

react => node => gemini => node => react

2. new

react => gemini => react

I get what you are trying to say but there are other issues also with passing env variables in frontend since we are serving the build of website through express server

Ohh ! okay i got it now the build is with the express okay so, i will leave the code to default as previous and I will add just JS code for customization GOT IT 👍

[github-actions[bot]]

🎉 Your pull request has been successfully merged! 🎉 Thank you for your valuable contribution to our project. Your efforts are greatly appreciated. Feel free to reach out if you have any more contributions or if there's anything else we can assist you with. Keep up the fantastic work! 🚀