The most simple stack to create basic CRUD web app with users?
Tags: help, discuss, opensource, javascript
Published: 2020-02-11 16:38:55

### Background

I’m a self-taught frontend dev at intermediate level. For my day job and a couple of side gigs, I’ve done user authentication, interacting with pre-existing infrastructure/API not built by me. I also know how JWT works.

However, to my distress, I realised that if I were to build a simple web app _for users_ (think To-Do or Notes, where each user will have their own data) on my own… I’d be clueless and not know where to start 😳. Now I felt it’s time to stop being embarassed and start learning by posting this question here. 

__What is the _most simple stack to create a basic personal CRUD web app_ with the following specs/requirements?__ For the sake of simplicity, let’s assume it’s a Notes app.

__User:__
- App can have many users.
- User can create a new note.
- User can view and manage (edit, delete) their existing notes.
- Only the user can edit or delete their notes.
- User can manage their notes from any browser/device. (So [localStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) or sessionStorage is out.)
- Everyone else can view user’s notes through a public URL.
- Notes shall not contain sensitive data.
- User shall be required to give as little amount of personal data and go through as little steps as possible to use this app.
- User might not be a tech person (= may not have Github/Netlify account).

__Dev (ie. me):__
- I have intermediate skill in JS; near zero skill in backend or DevOps (setting up server, do I need CI/CD, Docker, etc).
	- Yes I know I eventually have to learn the latter. For now though, I hope to create an app with minimum amount of backend & devops work.
	- I do have basic understanding of backend-related JS frameworks like Express and Koa.
- I’ve been into Svelte. But React, Vue, or vanilla JS is also fine.
- I’d like to keep the code open source.
- Free services only please.

_(Sidenote: I know I can create a remixable app on [Glitch](https://glitch.com/). But in this case, I’d like to know how to do it differently.)_

I found my main problem lies with TWO aspects: (1) user authentication and (2) data storage. I did some research and found the following solutions. Now I need help with _how and what to choose_.

### Problem 1: User authentication

- Google Sheets 
- Firebase
- Auth0 (7,000 free active users & unlimited logins, good enough)

### Problem 2: Data storage

- Google Sheets 
- Firebase
- Free tier of Contentful, Sanity, or other similar service? It would not be sustainable if there are many users. 🤔

### …No user authentication?

I found this interesting example in [marinaratimer.com](https://marinaratimer.com):

- User can create a new timer.
- Once a timer is created, user gets two unique links:
	- “viewer link”, eg. marinaratimer.com/KwAuW
	- “administrator link” to edit the timer, eg. marinaratimer.com/iBblB
		- This _is_ a public link; user is simply told to keep it private. 🤯

![screenshot of marinaratimer.com](https://dev-to-uploads.s3.amazonaws.com/i/8zk6acoui2f4oskqcegv.jpg)

---

Would be grateful for any advice, and/or just share your experience building this type of web app! 🙏🏽

---

🍦 __UPDATE:__ Thank you all for the responses! I decided to go with a Svelte + Sapper + Firebase (Firestore and hosting) for this project. For future projects I'd probably look into Express and MongoDB. I hope the answers here may be useful for others, too.