The architecture map
What physically exists when you have a Bubble app.
Anything that happens in a Bubble app touches some combination of services: the browser, app server, database, file storage, and CDN.
This lesson helps you understand how they fit together. We'll go into more detail on each in later lessons, but it's helpful to have a high-level understanding of which service is responsible for each piece of functionality in your Bubble app.
What each service does
Browser. Runs the editor when you are building your app, or the app when using run-mode. It fetches the source code and Bubble engine for your app from the CDN.
CDN. This serves the JSON for your app, as well as the Bubble engine that powers all Bubble apps. The browser pulls these quickly to begin rendering the page.
App server. The app server gets things done. It handles workflows, API calls, and routing data requests to the database.
Database.The Postgres database stores your app's data in tables.
File storage. When you save a file to storage, it is not stored in the database. Instead, it is stored in a file storage bucket in Amazon S3, which can be globally distributed. This means your browser can fetch files directly from there, rather than needing them to be returned by the app server.
Why geography matters
When something feels mysterious - why does this take so long, why can the user see data they shouldn't, why didn't my action fire - the answer almost always reduces to where is this happening. Get used to asking it. The next two lessons turn that question into a habit: lesson 3 traces the path a page takes through these boxes, and lesson 4 makes you choose between them every time you put down an action.