https://github.com/do-community/funko-showcase-workshop
Launch, Scale, Succeed: Mastering DigitalOcean in 4 Hours
https://github.com/do-community/funko-showcase-workshop
autoscaling mongodb nextjs
Last synced: 11 months ago
JSON representation
Launch, Scale, Succeed: Mastering DigitalOcean in 4 Hours
- Host: GitHub
- URL: https://github.com/do-community/funko-showcase-workshop
- Owner: do-community
- Created: 2024-09-24T14:22:42.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-31T15:26:12.000Z (over 1 year ago)
- Last Synced: 2025-05-12T12:48:38.784Z (about 1 year ago)
- Topics: autoscaling, mongodb, nextjs
- Language: TypeScript
- Homepage:
- Size: 8.71 MB
- Stars: 3
- Watchers: 1
- Forks: 27
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Launch, Scale, Succeed: Mastering DigitalOcean in 4 Hours
## Funko Showcase Workshop
### Presenters
Jeff Blankenburg - [Twitter](https://x.com/jeffblankenburg) | [Bluesky](https://bsky.app/profile/jeffblankenburg.com)
Chris DeMars - [Twitter](https://x.com/saltnburnem) | [Bluesky](https://bsky.app/profile/chrisdemars.net)
### Schedule
| **Time** | **Topics** |
| ------------------------ | ------------------------------------------------------------------------------ |
| Setup - 1:00 | |
| | 0:15 - Introductions, Explanations, Resources, Credit Codes |
| | 0:05 - Setting Up Your DigitalOcean Account |
| | 0:10 - Make sure you have a GitHub account that you currently have acecess to. |
| | 0:30 - Presentation |
| Workshop time - 3:00 | |
### What are we building?
The app we are building is to showcase/inventory any type of collection or memorabillia you own. For this workshop we are going to focus around Funko Pops. We all love those right? The app will display a card component using MaterialUI that has a picture, the medium, character name, year released, and number in line.
You will also have the ability to add a funko or edit one.
There is also search funtionality that you will be build in order to quickly find the item you are looking for.
### What are we going to learn?
- How to build a next.js card component app using MaterialUI to display data
- Setting up a Managed MongoDB on DigitalOcean
- Taking a dataset and ingesting that in Compass
- Deploying the site and database to the cloud using DigitalOcean
- Enabling Autoscaling to handle traffic influx
### Prerequisites
- Set Up Your [DigitalOcean Account](https://cloud.digitalocean.com/registrations/new)
- Set Up Your [GitHub Account](https://github.com/)
- Download and Install [Node LTS (comes with npm)](https://nodejs.org/en)
- Install [git](https://git-scm.com/) if not already installed
- Download and install [Compass](https://www.mongodb.com/try/download/compass)
- Install [VS Code](https://code.visualstudio.com/)
- Install the [DOTENV extension](https://marketplace.visualstudio.com/items?itemName=dotenv.dotenv-vscode) in VS Code
### Slidedeck
[Launch, Scale, Succeed: Mastering DigitalOcean in 4 Hours](https://slides.com/chrisdemars/funko-showcase/fullscreen)
### Workshop Lab Guide
The lab guide is broken up into various markdown files that will guide you through the process. Each file will have a series of steps that you will need to follow to complete the lab. If you have any questions, please feel free to ask the presenters.
To start the lab, open the [Setup](SETUP.md) file and follow the instructions.
We hope you enjoy the workshop!
### Useful Links
- [DigitalOcean Sign-Up](https://www.digitalocean.com/)
- [Material UI Documentation](https://mui.com/)
- [Node.js Download](https://nodejs.org/en/)
- [GitHub CLI](https://cli.github.com/)
- [MongoDB Compass](https://www.mongodb.com/products/compass)
- [DigitalOcean Spaces](https://www.digitalocean.com/products/spaces/)
- [DigitalOcean App Platform](https://www.digitalocean.com/products/app-platform/)