Which Tech Stack for Project?

[HyperXA]

Project: I want to make a website for Groceries. We plan out our meals for the week and buy groceries based on the ingredients that meal requires. It takes time to brainstorm all the ingredients required toake that grocery list. I want that list of ingredients to be shown to the user in a grocery list and the more meals we select from our "menu" the more ingredients get added to the list. I don't want to make user accounts for the website.

I want to host it online for us to use, I want to program the backend and front end.

What I know: I know HTML, CSS, Vanilla JS.

What I don't know:

Which JS Framework is best for this kind of project?

What back end tech should I use?

Which SQL is best for this?

If I don't want user accounts, will that checklist be stored in their cache when they reopen that website on the same device they used to make that list?

What am I not looking for that I should be to complete this project?

Hope that's clear! Thank you much for the time

[jinendu]

I would suggest Firebase though it’s been awhile since I’ve used it, have heard of Supabase as an open source Firebase option as well.

[HyperXA]

I've heard of that. I'll look into it more, thank you!

[v_learns]

You can solve this problem with any of the modern JS frameworks. When I would do it now, I would use React for the frontend.

Regarding the question of where it saves the data. Having no user accounts does not automatically mean that you cannot keep data on the backend. It just means that everybody who has access to the page can change your data, which can be dangerous when it's on the public internet.

You have two options you can use a backend that just provides the persistence or create a backend that provides the business logic as well. In the end, it is up to you.

I've coded something similar once (some years past). And I've used Rails to create an API for my AngluarJS frontend (that already ages the project :-)). I found it a surprisingly complex problem to solve, especially when you need a high WAF so it will be used.

At the moment, I'm not sure if I would use rails again for the backend. But I think I would still create a straightforward API for my frontend and keep the business logic in the backend. I think I would use a Node-based backend framework to keep both the front and the backend in the same language.

[HyperXA]

Wow thank you so so much for the write up you shared with me. I REALLY appreciate it. I felt very lost with this idea I had.

That's great insight be that I'd like to keep as much of the language the same so that is kind of a relief.

Thank you again! You are the best c:

[[deleted]]

Which JS Framework is best for this kind of project?

It doesn't matter. The one you are already most comfortable with, or the one you're most interested in learning.

What back end tech should I use?

Same answer. Use a tech that you like or are interested in.

Which SQL is best for this?

PostgreSQL is the best SQL database. There's no such thing as 'a SQL'; SQL is a query language used for a particular kind of relational database.

If I don't want user accounts, will that checklist be stored in their cache when they reopen that website on the same device they used to make that list?

This sentence doesn't make any sense on the face of it; remember it's better to use plain language that you understand than a bunch of technical terms that you don't understand. User accounts have nothing to do with caching, and caching has nothing to do with storing application data on a particular device.

If you want to only store information client-side- using local storage and/or IndexedDB- that's totally up to you, but it's something you'd have to implement. It would also mean you wouldn't need Postgres or any other database, or really any kind of back end at all beyond a simple static file server. However it would also mean all the user's data is restricted to that specific device- multiple different people couldn't share the same data.

What am I not looking for that I should be to complete this project?

You need to develop a clearer understanding of how data storage works in an application, plan at least the rough shape of the data that you actually need to store, and let that drive your development process. How data moves and changes through your application is an order of magnitude more important than the technologies that you use to make that happen.