So, I’m really confused. I already completed all of the API challenges and wanted to create a project of my own to practice mixing front-end and back-end.
Let’s say I already have the HTML and CSS files done. How would I add NodeJS and express, to my project? What files would I need? How do I know which port to connect to? How do I test the project, do I always need Glitch (for example)?
The dependencies I’m guessing it’s only express, for now.
I’m looking at the API challenge’s files and code in VSCode and there are a lot of files. I know how to add packages and so on with npm but I have no idea on how to create a project that has backend in it.
Your backend is usually hosted on a server of some sort (unless you go down the serverless route, but ignore that for now, it’ll just complicate things).
That server might be managed for you and abstracted away, like glitch. It might be a little more open, but still managed like Heroku. It could be a virtual private server like an AWS EC2 instance (typically a Linux machine ‘in the cloud’ that runs your code), or even a Raspberry Pi running in your bedroom. The point is, you have something running a web server and handling your web requests.
That might also be serving your front end, so they could be on the same ‘box’ and talking to each other, or your front end might be hosted elsewhere and it just relies on your backend as an API.
How you connect these depends on the technology you use.
Full stack frameworks typically do everything for you - so the logic processing, database transactions and UI views are all handled by a single server / app. At their simplest, Rails, Laravel, Django, and Express all do this.
If you use the backend as an API, then your static frontend will send requests to the API endpoints you write and then render the data as it’s received.
Maybe finding a tutorial that walks you through making a simple full stack app and deploying it to Heroku would be a good next step for you?