We Keep Coding

A question about how web applications work and how server-client is implemented

This is kind of a weird question I think to ask, but I have browsing about for the past some time and cannot find a clear definite answer.
I understand that a client connects to its own server and communicates with the web-server through sockets and I kind of see how that works in php (I have never used php but have used sockets before so I understand the concept).
The issue is I'm trying to get a real view of this.
The question is, do websites generally use sockets and contact a web-server to fetch data or the actual html? Or is it a rare choice made in some areas?
If it is generally used, then is the "real" js usually in the server? or is it client-side (for performance sake)?
Context:
Let me explain a bit where I'm coming from, I'm not a web expert, but I am a computer engineering student so most concepts are easy to understand. A "real"-er view of this would be very helpful.
Now, onto why I'm asking this. I'm developing a web-app as part of a project and have done a fair bit of progress on it but everything was done on a local dev server (so basically a client?)
I've started wondering about this because I wanted to use a database for my website and since I want to connect to something, I will need to connect to a web-server first (for security sake).
My question's intent is to guide me on how and most importantly, where, to setup this server.
I don't think showing any code would be of help here, but assume I have my client running on localhost:1234, my database on localhost:3306, I think I should have a web-server on another port so I can establish this communication, but I want to do it in a clean and legitimate way so all of my current solutions can be ported online with little to no changes (except the obvious)

There's a bunch to unpack here.
First of all, servers can be distant or local. Usually they are distant, local server are mostly used for development purposes.
Even if your server is on your local machine, it still isn't the client. The client is the part that is connecting to your server. For web development it is usually the user browser.
Javascript is a language that can be used server-side, with a NodeJS server, but more often client-side, in your user browser.
Your website, or web application, communicate with your server through various means. Most common one is the HTTP protocol, used to make server requests such as data request to populate your page (in case of an API server, REST or otherwise), or simply request the actual page to display in the browser. The HTTP protocol works by resolving URLs, and making requests to your server registered to this url using special methods such as GET, POST, DELETE, etc...
Sockets are used to create a persistent connection with your server that works both ways. It is mostly used for realtime updates, such as a live chat, as it allows you to push updates from the server instead of having the client request everything.
In most cases the database can be found on the same server as the one serving the website or application, as it is a lot easier to handle, and often faster without the extra networks requests to get the data. However it can be placed on another server, with it's own API to get the data (not necessarily web related)
Ports such as 1234 or 3306 are often used for local development, however once your move your project to a host service, this is usually replace by urls. And the host service will provide you with a config to access the associated database. Or if you are building your own server you might still use ports. It is heavily dependent on your server config.
Hope this clear some things up.

In addition to #Morphyish answer, in the simplest case, a web browser (the client) requests an URL from a server. The URL contains the domain name of the server and some parameters. The server responds with HTML code. The browser interprets the code and renders the webpage.
The browser and the server communicates using HTTP protocol. HTTP is stateless and closes the connection after each request.
The server can respond with static HTML, e.g. by serving a static HTML file. Or, by serving dynamic HTML. Serving dynamic HTML requires some kind of server language (e.g. nodejs, PHP, python) that essentially concatenates strings to build the HTML code. Usually, the HTML is created by filling templates with data from the database (e.g. MySQL, Postgres).
There are countless languages, frameworks, libraries that help to achieve this.
In addition to HTML, the server can also serve javascript that is interpreted in the browser and adds dynamics to the webpage. However, there could be 2 types of javascript that should not be mixed. NodeJS runs on the server and formats the server response, client javascript runs on the browser. Remember, client and server are completely isolated and can communicate only through an HTTP connection.
That said, there ways to make persistent connections between client and server with WebSockets, and add all kinds of exotic solutions. The core principle remains the same.
It does not matter if server software (e.g apache, nginx) is running on your local machine or anywhere else. The browser makes a request to an address, the DNS and network stack figures out how to reach the server and makes it work.

Is it possible to create a LAN connection between clients, with a browser application and a running program as the 'server'?

Suppose I create a client application in html and javascript. Each user in the same building, on the same Local Area Network (LAN) has the client application on its computer. The web app is running in the browser, like you can open a html file in your browser. (Example of what you could type in the adress bar C://users/username/.../app.htm)
Then, one client is the server, like in a multiplayer game where you can play together on the LAN.
Javascript can send http requests or connect via a socket, but you need something like a http adress to get a connection to another device in the LAN, via the LAN-network. This can be easily done in a java* application.
My idea is to create a java program that handles the connection via the LAN.
The application running in the browser has to communicate to the java program, and the java program communicates to the server/clients via the LAN.
Is it possible to create something like this? I think the point is in the communication between the in-browser app and the running java program.
[*] Java not to be confused with javascript
So, is it actually possible to create something which runs in the browser, and can communicate to an independent program on the same device?

NodeJS chat server interacting with non-node hosted html page

The node.js chat example is ubiquitous. However, they all serve the static html page with which the chat feature is integrated.
What about an html page that is served via apache, php, .net, or other which interacts with a node.js based chat server. How would this be implemented?
For instance, the html page contains a form used to login. The form's action points to the node server which provides the authentication and message handling. How does this chat server communicate with the client-side when it is not also providing the static html content?

Yes, it's possible. If I understand you correctly, you'll probably want to use this approach:
Run the apache server on a different port from the node.js server, and have the static server serve the chat page. Then, you have two main options for how to get data from the static page to the node.js server: either use XMLHttpRequest directly from the static page with CORS (you'll need it because you're running from different ports, but it's still possible to have CORS allow from different ports on the same domain but nothing else, so it can still be secure), or have an invisible iframe of the node.js page on the static page, and then send data to it with postMessage, and then the iframe (which is on the same port as the node.js server, as it's being served by node.js) will forward the data from the postMessage to the server with XMLHttpRequest
You can also do a proxy, but it won't be as good for this type of situation I think, because if Apache is running the proxy, it completely erases how node.js does well with comet and things, but if you run node.js as the main server proxying to Apache, it would be easier just to do everything with node, so I'm guessing you don't want that

Here is a simple solution I found that works to add socket.io real-time interactivity to any existing html page, even when that page is hosted on another server.
Include a reference to socket.io in the head of the html page. The IP address and port number should be the location of your node.js server that is running socket.io.
<script src="http://xxx.xxx.xxx.xxx:xxxx/socket.io/socket.io.js"></script>
[NOTE: localhost doesn't work, you must use the actual IP address - don't forget the port]
Then, within a script block on the same html page, open a connection to the socket:
<script>
var socket = io.connect('http://xxx.xxx.xxx.xxx:xxxx');
</script>
That's it, you're connected!

Client-side browser socket communications for web app - Best method?

Sorry for the cryptic title, struggling to summarise my problem in a single line...
I wish to deploy an online, hosted website to serve a series of remote terminals which will be equipped with Chip & Pin payment card readers (aka pinpads). The pinpads are driven by some software on the PC within the terminal which is written by a 3rd party. The integration methods supported by this software are either text file based or socket based with a "request" and "response" workflow.
I have successfully carried out similar integrations in the past using client side VB Script to instantiate client side COM objects which communicate via socket connection with the local 3rd party software but this approach ties me to Windows and I would prefer to keep my options open.
My web server will be Ruby On Rails based and I intend to use HTML5 and CSS3 to provide a rich experience on the payment terminals and wondered if I can use web sockets for client side communications? From what I understand, this is not what they are designed for and so I think the answer is no.
So, what are my options? Can i use client side JavaScript to carry out socket communications or is this prevented by browser security measures? From the browser's perspective it would be communicating with a specific numbered port on "localhost"
If socket comms is not possible, can I use JavaScript to create client side text files to integrate that way?
Or am I stuck with VB script and local COM objects?
Any suggestions would be most welcome and please let me know if you need clarification on any aspect of my question.
Kind regards,
Craig.

I don't think you can write a text file with JavaScript. And you can't put arbitrary bytes on a socket either. I don't completely understand you scenario. It sounds like you have Ruby sunning on a server and JavaScript and this third party pinpad thing running on a client. And you need the two client entities to be able to talk to each other. Could you have the browser communicate with your Ruby server (using one of many web technologies) and then have your Ruby server relay the data back to the pinpad socket. Or is the pinpad only a local socket?

The only type of socket-based connection you are allowed to open on a standard web page that runs javascript is an HTTP socket. You'll have a lot more freedom to use sockets if you develop a browser plugin, which is written in javascript. Firefox, I know, supports sockets in extensions.
https://developer.mozilla.org/en/XPCOM_Interface_Reference/nsISocketProvider

Execute a Application On The Server Using JavaScript

I have an application on my server that is called leaf.exe, that haves two arguments needed to run, they are: inputfile and outputfile, that will be like this example:
pnote.exe input.pnt output.txt
They are all on the same directory as my home page file(the executable and the input file). But I need that a JavaScript could run the application like that, then I want to know how could I do this.
I'm using just Apache, I don't have any language for web installed on it. My goal is to do a site using just JavaScript, without the help of anyother language than it, HTML and CSS.

You would need to make an Ajax request to the server - the server would then have a handler that would then invoke the executable with the appropriate parameters.
Without know which web server technology you are using, it's harder to give a more concrete answer (ex: ASP.NET, PHP, Ruby, etc).
EDIT: If you're talking about doing this without any kind of server side resources, then this is impossible, and for good reason. Think of the security exploits!

Any other way to this without using other languages that need to be installed on the server?
No, but you almost certainly already have languages on the server. If it's a Linux, BSD or OSX server you've got shell script; if it's a Windows server you've got JScript and VBScript via Windows Scripting Host (using a cscript.exe hashbang).

JavaScript is for Client Side of a web application, so you won't be able to directly use javaScript to access server side files. As mentioned by Tejs, you should use Ajax to make a call to server side and then use appropriate server side routine to do the task.
Even at client side, most browsers don't allow accessing of any resource( e.g files) by javaScript code.

For server side javascript in Apache you could use Sun ONE Active Server Pages, formerly known as Chili!Soft ASP. For an IIS server, javascript is plainly available as asp-language.

Look into Rhino and node.js. I dont know a lot about this, but thats a route you can use for serverside javascript.