Starter Code Explained!

Setting Up Stripe


Making Your Stripe Account

Setting Up The Server


<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

We do not have to do crazy stuff to get access to a server!

In our case, we use Glitch, a free cloud-based coding platform, to deploy a Node.js and Express backend that handles HTTP requests. This backend receives requests from our iOS app, processes payment intents with Stripe, and returns the necessary client secret to complete transactions.

Click on the link below to get started:

https://glitch.com/

If you are new to Glitch, Sign up on the top right corner and log in with your google account.

</aside>

Screenshot 2025-02-07 at 11.04.44 AM.png

<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

Then click on “New project” and select “glitch-hello-node”:

</aside>

Screenshot 2025-02-07 at 11.05.35 AM.png

<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

You will reach the dashboard that looks like this:

</aside>

Screenshot 2025-02-07 at 11.08.55 AM.png

<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

Next step, go to package.json file and add the following packages:

<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

How to add a package?

</aside>

<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

On the left hand menu of your dashboard, you can see the given files.

Go to “package.json” file and click on “add package”

</aside>

Screenshot 2025-02-07 at 11.17.48 AM.png

<aside> <img src="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" alt="notion://custom_emoji/b483512c-e260-41d3-b5ff-36d0dc5fa090/169e981a-0297-8019-be6b-007aa264a5c0" width="40px" />

In the search bar, search for “express” or other packages you want to add. Once you click on it, the package will automatically be added.

</aside>

Screenshot 2025-02-07 at 11.18.14 AM.png

Screenshot 2025-02-07 at 11.13.52 AM.png