Help Me Understand the Process

My 83 year old brain is too fuzzy today. I need help.

I’m trying to create input forms, process them, and pass data entered to the backend where SQL Server will update a database. I have some grasp on creating the forms. I’m beginning to see how javascript can validate the entries, but this is where the process is unclear for me.

HTML and CSS create the screen displays and set up the form with action and method definitions that javascript uses to parse form input. I’ve used data element names in the HTML/Javascript code that I used in SQL to create tables. I think that javascript can somehow pass the data (or pointers to the data) to backend code, but what backend code then creates the SQL queries to update the database. Is this what php does?

I need to understand this process better. Can someone, please, give me an education on how this happens? Or, better still, if you know of an article that explains it, please point me to it.

are you familiar with SQL? if you are not you may want to start there

the Relational Database Curriculum has SQL and how to use SQL programmatically, you could learn that

You would need to use server-side JavaScript, known as Node.js, to post data to a database. You can learn more about it here.

Node.js

fCC has a “Backend Development and APIs” certification that covers Node, Express, and MongoDB. BTW, MongoDB is typically used with Node rather than SQL Server.

1 Like

It sounds like you have started writing the frontend (called the Presentation Layer in the diagram below). This is the code that runs in a user’s browser (“client”) and controls appearance and user interactions. This is the “website”-y part of a web application.

Your database, of course, does not exist in your users’ browsers. It is on a server that you control. The real application part of a web application also runs on a server that you control. The backend (aka “web server”, “application layer”, etc) has HTTP endpoints that the frontend uses to request or submit data. It should be responsible for complex computation, as well as communicating with the database(s). This application can be written in any number of languages, but since you’re already learning JavaScript you probably would prefer using a Node.js server.

3 Likes

Great explanation. The picture helps a lot.

Thanks for the responses. I agree; the graphic helps.

I have the first few screens designed and coded (HTML/CSS) for my project. These include data input screens (without any frontend or backend code to process them) and output screens that currently have content embedded in the HTML. I did this as an exercise in learning HTML and CSS.

From things I had read, my initial understanding was that I would need 1) a database engine (I chose MSSQL) to store data; 2) backend code to edit data and to drive the SQL database, which I thought would require php; and 3) frontend code to process and edit user actions, which I thought would require Javascript.

I’m reading conflicting information here and elsewhere. Am I wrong about needing both Javascript and php? If so which should I drop, Javascript or php?

I have a web hosting site, IONOS. I have MSSQLS and SSMS installed on my local system for learning and testing. I’ve done a couple of tutorials on SQL Server so far. I’ve read one book on the subject. I do not yet have a php server. I’ve about completed the W3Schools tutorial on php. I’ve got a couple of books on the way, too. Will I be able to add that to my SQL Server?

Is this taken from the OSI model? The only reference to the Application Layer I can find refers to its position in the OSI model as the 7th or top layer.

This diagram confuses me a bit because I had read that web servers and application servers were 2 different things. Were they combined here to simplify presentation? In fact, what I read I took to mean that a web server is the client side or frontend and the application server is the server side or backend, conceptually. Further, the web server is where the HTML and CSS and whatever frontend processes (like Javascript editing and selection processing) take place; and the application server is where data involved processes like apps and database interaction take place.

These are conceptual but not necessarily physical things. IOW the same PC on my desktop can run both, or my desktop might just be the client side running the HTML/CSS/Javascript but might send information to an entirely different system configured in a network (local or remote) that processes data sent to it, runs apps, updates and/or retrieves data and sends it back to the frontend.

If my description is correct then it might be said that php, applications and database management take place in the backend/application server whereas pages are served, input is accepted and client-side processing (ie, error checking and user messaging) take place.

Am I close?

You don’t need to learn php, but you can. It’s largely fallen out of favor. We’re already using JavaScript to write our frontends, so being able to write our backend in JavaScript too tends to improve our developer experience. If you’re following a tutorial or course that uses php instead, there’s nothing wrong with that though. You can always try it the other way next time.

I grabbed that particular graphic just based on it breaking the application into the client ↔ server ↔ database flow visually at a very high level.

Typically, any kind of a “server” is going to be a machine that you control . A “web server” would be an application that serves data (everything is data) to a web client. It can be thought of as the top of the “backend” stack. How deep that stack goes and how many independent services it’s broken into is where you get into architectural design considerations. Choosing to write different components in multiple languages can certainly inform that decision process. As a novice, use whatever model feels straightforward and approachable.

1 Like

I would clarify:

Web server: server side A web server might execute both frontend and backend code.

Web browser: client side Typically executes frontend code

Frontend: Code that could be executing in the browser, served to the browser from the web server, but deals with user interface or user facing functions. Some of this might execute on the server but still to communicate with the user.

Backend: typically executing on the web server itself, might communicate with local db or db on another server or other web servers. Typically processing that does not directly communicate with the user or web browser

https://www.geeksforgeeks.org/frontend-vs-backend/

https://www.geeksforgeeks.org/difference-between-server-side-scripting-and-client-side-scripting/

https://www.cloudflare.com/en-ca/learning/serverless/glossary/client-side-vs-server-side/

2 Likes