The latest articles on Forem by Vivek (@vivek_z9). https://forem.com/vivek_z9 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3948703%2Fd0fa8de2-9ff1-4dd2-830d-4acb3029532b.jpg https://forem.com/vivek_z9 en Vivek Mon, 25 May 2026 12:29:04 +0000 https://forem.com/vivek_z9/i-built-stashly-a-full-stack-content-manager-with-a-rich-text-editor-published-false-tags-45fj https://forem.com/vivek_z9/i-built-stashly-a-full-stack-content-manager-with-a-rich-text-editor-published-false-tags-45fj <p>I wanted one place to save links from YouTube, Twitter, and LinkedIn, and write notes alongside them. Nothing I found did both well, so I built Stashly.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzt0p0qe78zyjmfc6e2um.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzt0p0qe78zyjmfc6e2um.png" alt=" " width="800" height="408"></a><br> <a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fro9vnufnd8bvwi54eqhi.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fro9vnufnd8bvwi54eqhi.png" alt=" " width="800" height="408"></a><br> <a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Font25ob5plqdcbfwua91.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Font25ob5plqdcbfwua91.png" alt=" " width="800" height="406"></a></p> <h2> What it does </h2> <ul> <li>Save links from YouTube, Twitter, LinkedIn — with auto-embeds</li> <li>Write and edit notes with a full rich text editor (Tiptap)</li> <li>Auto-saves notes with a 2s debounce</li> <li>Share any saved item via a public slug URL</li> <li>Sign in with Google or GitHub OAuth</li> <li>Works on mobile (pill nav) and desktop (sidebar) ## Tech stack</li> </ul> <div class="table-wrapper-paragraph"><table> <thead> <tr> <th>Layer</th> <th>Tech</th> </tr> </thead> <tbody> <tr> <td>Frontend</td> <td>React 19, TypeScript, Vite, TailwindCSS v4</td> </tr> <tr> <td>Editor</td> <td>Tiptap 3</td> </tr> <tr> <td>State</td> <td>Redux Toolkit</td> </tr> <tr> <td>Backend</td> <td>Express 5, TypeScript</td> </tr> <tr> <td>Database</td> <td>MongoDB + Mongoose 9</td> </tr> <tr> <td>Auth</td> <td>Better-Auth (Google / GitHub OAuth)</td> </tr> <tr> <td>Validation</td> <td>Zod</td> </tr> </tbody> </table></div> <h2> The editor </h2> <p>Tiptap handles the heavy lifting — headings, lists, code blocks, text alignment, color highlights, images, and links. Notes auto-save in the background so you never have to think about it.</p> <h2> Saving content </h2> <p>Paste a YouTube, Twitter, or LinkedIn URL and Stashly stores it with an embed. You can filter your saved content by platform and delete anything you don't need.</p> <h2> Auth </h2> <p>Better-Auth handles OAuth for both Google and GitHub. The session flow was straightforward to set up and the library keeps things out of your way.</p> <h2> Running it locally </h2> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code><span class="c"># Backend</span> <span class="nb">cd </span>backend npm <span class="nb">install cp</span> .env.example .env npm run dev <span class="c"># Frontend</span> <span class="nb">cd </span>frontend npm <span class="nb">install </span>npm run dev </code></pre> </div> <p>You'll need Node 18+ and a MongoDB instance (local or Atlas). The <code>.env.example</code> covers all the required variables — DB URL, Better-Auth secrets, and OAuth credentials for both providers.</p> <h2> What I'd improve </h2> <ul> <li>Full-text search across notes and saved links</li> <li>Browser extension for one-click saving</li> </ul> <h2> - Folders or tags for organizing content </h2> <p>Source is on GitHub if you want to take a look or contribute. Feedback welcome.</p> webdev programming react typescript