Explain deploying a web application Like I'm Five

Okay, I've deployed a few sites to github and a few others to heroku. But, I see suggestions (example) to deploy the front-end to one place and the back-end somewhere else, and I really do not understand. Do I need to be doing this?

Hey Jess, I wrote an entire guide to this that explains it via starting a microbrewery!


From the link that you gave, it said
app.domain.com and

So I'm going to assume that you're asking about how a client app interacts with an api.

So if you are not familiar with what is an API, it is basically a software used to interact with other software. In other words, API alone is useless. Something needs to use the API such as a mobile application or a website (like the front-end being mentioned there).

Actual ELI5:

Think of API as a butler.
API = Butler
Client Application / Front-end application = You

Part 1:

You (the front end website) call for the butler (make a request to the API) and tell him to bring you chicken for dinner.

Code equivalent:

Front-end website makes a /GET request to the /dinners/chicken API endpoint.

Part 2:

The butler receives a request and understands it. He goes to the kitchen (Makes a database call) and sends you back your chicken dinner (Sends you a response). Now you decide what you want to do with your dinner.

Code equivalent:

The API receives your request. This is mostly through cURL or XMLHttpRequest/Ajax call. The API processes your request and fetches data from the DB. In return, he sends back the data (mostly JSON string) to the Client application. With the response now received, the client application can do whatever it wants with the data. Such as, display it, or do something else.

The API & the Application can be hosted any server. It doesn't really matter because the client application is actually calling the API via XMLHttpRequest. So whether the API is hosted on the same server or in another server, or in facebook's server, it doesn't matter (in a technical sense).

But of course, taking in performance issues, the load will double because 2 softwares are sharing the same resources. (Probably won't matter unless you have millions of requests)

You don't care what the butler does as long as he understands your request and you get what you need in return.

Hope that helps.

thanks. I'm really trying to understand why/how we choose to deploy the front and back end different places, but your analogy is helpful!

Think of it like this. What if your API is getting consumed by 5 different applications? And those applications reside at the same server as your API? As my previous example, the load will x6 now, and your server might have difficulty handling such load. 😬 So it's a good idea to separate the API so it doesn't share resources with other applications. 😊