What does the client perceive or not perceive? Node.js, JavaScript, MySQL

For a university project, I am tasked with creating a web application that is compatible with both desktop browsers and mobile devices. The technologies I will be using include HTML, CSS, JavaScript, Node.js, and MySQL. I have recently familiarized myself with node.js, which I understand to function like an apache server responding with an HTTP packet when a client makes a request. Additionally, I have implemented Node Express and integrated MySQL into my project. I have created a page with the .ejs extension that features a for loop iterating over a variable obtained from the database. Now, my questions are as follows: Who is responsible for executing the for loop? Is it the client or the server? Is the list/array of results retrieved from the MySQL query transmitted to the client for JavaScript to determine which rows to display, or does the server generate the HTML page and send it directly to the client?

This is the configuration of the node server:

var express = require('express');
var mysql = require('mysql');
var select;
var app = express();

app.set('view engine', 'ejs');

var con = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "myPassword",
    database: "test"
  });

  con.connect(function(err) {
    if (err) throw err;
    con.query("SELECT nome FROM prova", function (err, result, fields) {
      if (err) throw err;
      select = result;
    });
  });

app.get('/count/:number', function(req, res) {
  res.render('page.ejs', {counter: req.params.number, names: select});
});

app.listen(8081);

This is the content of the requested page:

<html>
    <head>
        <title>Web Page Title</title>
    </head>
    <body><h1>Counting up to <%= counter %></h1>

    <p><% 
        for (var i = 1; i <= counter; ++i) {
    %>

    <%= i %> ...

    <% } %></p>

    <p>Great, I'm done counting. Let me now randomly choose a name from those sent to me.
        <%= names[0].nome %>
    </p>
    </body>
</html>

Answer â„–1

EJS is known as a powerful templating engine.

https://i.sstatic.net/gMCLv.png.

In the scenario of a MySQL query, the list/array of results is transferred to the client. The client then has the choice of determining which row should be displayed using JavaScript, or alternatively, does the server create the HTML page and deliver it directly to the client?

Not quite. The client actually receives the already processed data, so they do not have access to view the original template or NodeJS source code. To put it into perspective, think of templates like a college application form—hundreds of students receive the same form, all they need to do is fill in the information and submit it. The person reviewing the application will not know how it was completed, what writing tool was used, or the time it took; they will only see the final processed data. In your case, the server will handle processing the data and send out the end result as plain HTML.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for achieving JSON formatting with JavaScript or jQuery

To achieve the desired output format, I am required to transform the provided input json. input json: [ { "key a": "value alpha" "key b": "value beta" "key c": "value gamma& ...

Guide to triggering React Material-UI modal and filling it with data from an Ajax request when a button is clicked

Despite my efforts to find a similar question, I couldn't come across one. My apologies if I overlooked it. Currently, I am working on a React Material-UI project to develop a basic web application. Within this application, there is an XGrid that disp ...

Error: The module 'react-scripts.js' could not be located and is unable to be found

Working on my React app, I used the command npx create-react-app my-react-app to set it up. Navigating to the React folder with cd my-react-app, I encountered an error when running npm start: > [email protected] start > react-scripts start &ap ...

What strategies can I use to reduce the amount of event listeners assigned to buttons in jquery?

Currently, I am utilizing jquery 1.6.2 for my project. On one of the pages, I have a structure that resembles the following: <div id="section1"> <fieldset> <ul> <li> <input type="radio" name ...

Executing asynchronous code in a sequential manner

I'm encountering a problem. I have an AngularJS function that calls another AngularJS function which includes a POST request. The issue is that this POST request always fires last, once the first function has completed. It doesn't execute sequent ...

What could be causing the media queries to not take effect at a max-width of 425px?

When I try to apply media queries for max-width 768px and max-width 425px, I noticed that the styles intended for max-width 768px are also being applied when the width is 425px. This results in the al-articles-tags-chip-list-container having a width of 600 ...

Unable to open file:/// on localhost in the browser

I have been working on a website that can display the folders and files on a client's machine in an HTML table. Everything was functioning correctly, but I encountered an issue with creating href links for files on the client's machine which were ...

Tips for validating a string in a URL with Selenium IDE

When I click on a tab on my website, it triggers an AJAX service call where the URL contains parameters related to the data being loaded after the tab is clicked. The data is displayed as horizontal tiles one below the other, with 4 tiles being loaded pe ...

Is it possible to add a class to a child element deep within the component hierarchy while using TransitionGroup/CSSTransition in React?

I currently have a setup like this: Parent Component: <TransitionGroup> { items.map((child, index) => { // do something return ( <CSSTransition key={index} nodeRef={items.nodeRef} timeout={1000} classNames={'item ...

When using Node.js with Nginx, requests are timing out at the Nginx level before the processing is completed in Node.js

I have a setup where I use Nginx and Node.js servers. The process involves uploading a file from a browser to Nginx, which then forwards it to Node.js for processing. However, I've encountered an issue when dealing with large files - the upload crashe ...

the power of using keywords and prototypes

Greetings! I am currently delving into the realm of JavaScript, hailing from a C++ background. The transition has proven to be quite perplexing for me. Below is a snippet of code that I have been troubleshooting: var someArray = []; nameCompare = function ...

How to perfectly align content on a webpage

Can someone help me understand why my webpage is off-centered as it scales up? I have set a minimum width of 1000px, but it still appears to be centered at 30%-70%. Any insights on this issue would be greatly appreciated. <!DOCTYPE html PUBLIC "-//W3 ...

Unleashing the power of node.js methods in Jade templates with Wintersmith

I've searched Google countless times without finding a clear answer... I'm trying to use the following code in my jade template, but it's throwing an error on the first line. Can you guide me in the right direction? Thanks in advance! var f ...

ReactJS is in need of extracting certain values from a promise

Within my Firebase database, I have organized data into two Documents: "users" and "posts". Each post in the "posts" collection is linked to a specific user using their unique id from the "users" collection. My goal is to retrieve user data associated wi ...

Organize every rectangle and text element in D3 into distinct groups

Currently, I am working on creating a bar graph using d3.js. The goal is to display text on top of each bar when the user hovers over it. To achieve this, the <text> and <rect> elements need to be grouped inside a <g> element. For Exampl ...

How to remove an event listener that was added within a function in JavaScript?

I am encountering an issue while trying to remove an event listener that was created inside a function. Oddly enough, it works perfectly when I move the event listener outside of the function. See the example below: <body> <div id='myDiv&apo ...

Press the Instagram Follow Buttons by utilizing Selenium with Java

click here for image description Hello, I am currently working on automating the process of clicking follow buttons using Java. However, I'm encountering difficulties when trying to use JavascriptExecutor within a for loop. Below is the code snippet ...

Handling session expiration in ASP.NET MVC when making an AJAX call by redirecting to the login page

I'm currently learning ASP.NET MVC and I'm a newbie in it, so I'm struggling to find a solution for a specific problem. If anyone has encountered this issue before, I would appreciate any advice. Thank you! In my project, I am using ASP.NET ...

Efficiently Measuring the Visibility Area of DetailsList in Fluent UI

I am currently utilizing the DetalisList component alongside the ScrollablePane to ensure that the header remains fixed while allowing the rows to scroll. However, I have encountered a challenge as I need to manually specify the height of the scrollable co ...

Bringing in a JavaScript file into a Svelte component

Today, I stumbled upon Svelte and I am really intrigued by the concept. However, I encountered an issue while attempting to import a small helper.js file. No matter what I try, whenever I reference the class, I receive the error: ReferenceError: Helper ...