This is my app: Here’s a concise breakdown of the StogieMatch app architecture:
Core Structure:
Key Components:
Frontend Layer:
App.tsx
: Main component with routing logicLayout
: Shared UI structure with navigationAgeVerification
: Age gateSearchByName
: Name-based searchRecommendationForm
: Preference-based matchingCigarList
: Display resultsHumidor
: Saved cigars managementBackend Layer:
server/index.js
: Express server setup/api/search-by-name
: Name search/api/recommendations
: Preference matchingData Layer:
cigars
: Cigar detailssearches
: Search historyrecommendations
: Match resultsuser_preferences
: User settingsState Management:
useLocalStorage
hookFeatures:
The app follows a clean, modular architecture with clear separation of concerns and reusable components.
This textbox defaults to using Markdown to format your answer.
You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!
These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.
Sign up for Infrastructure as a Newsletter.
Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.
Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.
Heya,
There are two ways to go about it. Have a Droplet which you can configure or use the MarketPlace
https://marketplace.digitalocean.com/apps/nodejs
and eventually, support yourself or go for the App Platform with a managed DB which would have DigitalOcean manage the server side you’ll need to focus only on the application.
Both are a really good option and your choice should be based on your server knowledge and finances.
My advice if you don’t have good experience with managing a server, you should go for the App Platform and Managed DB. If you have a smaller budger, you should look into Droplets.
Hey there!
For this kind of setup, I would suggest the App Platform:
For a React frontend with Vite, App Platform’s static site component is perfect. It’ll serve your static assets (HTML, CSS, JS) efficiently and comes with automatic SSL and CDN support to ensure fast load times. You can find the details for setting up a static site here: Deploy a Static Site.
For the Node.js + Express backend, go with the App Platform’s web service component. This will handle your API endpoints for the search and recommendations, and it’ll easily integrate with your OpenAI setup for recommendations. With auto-scaling and zero-downtime deployments, your backend will be resilient, especially as more users join. Here’s a guide on setting up a web service: Deploy a Web Service.
For the MySQL database, DigitalOcean’s managed MySQL cluster is your best bet. It’s fully managed, with automatic backups and point-in-time recovery, so your app’s data will be safe. You can focus more on building features rather than maintaining the database. Check out the managed database setup here: Managed Databases.
Using the App Platform means you get benefits like auto-scaling and automatic deployments directly from GitHub, which is ideal if you’re planning to grow:
But if you’re interested in keeping things on a single Droplet, that’s also an option! A single Droplet could run your entire stack, though it’d lack the ease of scaling and the out-of-the-box deployment automation you get with App Platform:
Hope this helps you get started, and let me know if you have more questions!
\– Bobby