We Keep Coding

How to pass values from one web page to another

I am new to web development and there is something I'm very use to doing in mobile dev and I wanted to know if it is applicable to web development(Html, CSS & Javascript).
It is basically code reuseability, but in this case I want to pass the data(String) I get from a database to another web page where I act on those data.
I would like to implement It with a single web page whose job is to load the data e.g a web page that shows user profile or a web page that show chat history of 2 users.
I really hope you understood what I was trying to say, I honestly suck at type explaining.
Thanks guys.
A code example of what I'm trying to implement.
example language Flutter(dart).
...
final string userId;
const ShowUserProfile(this.userId);
....
Text('Welcome ${widget.userId} to your profile screen', style: ....);
....

If you want to pass data from one page to another using only HTML, and JS (client-side) code and not use any server-side code you can accomplish this in two ways:
1) Store data in the URL. Example:
HTML
some link
JS
const data = 'abc';
const link = document.getElementByID('mylink');
link.href += '?data='+ data;
this method is detailed in another question here How to store data as a url parameter using javascript?
2) The preferred method is to store the data as a cookie in the user's browser because this method does not pass the data over the network. Example:
JS
document.cookie = "data=abc";

Two methods, one is the data can be part of the http link such as https://yourwebsite/iampage/thisisthevalue. But this method is so messy and your users will see the value and also spaces are replaced with %20....
Method 2 is using localStorage or session or indexedDB. Easiest is localStorage. More information on localStorage can be found in this link https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage.

You can also make a separate css document with all the code and then go like this:
<source src="name.css" type="text/css">
Then you can get the same CSS document on 2 diffrent pages

How would custom user links work?

By custom user links, i mean like for example when a user registers to the website, a page is created specifically for that user with a link.
For Example
https:/domain.com/users/customerName
Then after creating the link, the website will automatically customize the website by using a clone of a specific webpage.
*Btw i've already took Care of the Login/Register part. I just need to know how custom user links would work.

Option 1: example.com/user
Use a single PHP file and an .htaccess file. Check out How to create friendly URL in php?
Option 2: user.example.com
Create sub-domains for each user, also uses .htaccess. Check out How to let PHP to create subdomain automatically for each user?
Option 3: example.com?user=name
Create a single php file and use $_GET parameters. This is the most usual and easiest way to customize the website based on the user who registered and logged in. (usually using user ID number: example.com/profile.php?user=71)
Of course there's also Session handling.

I think you searching for URL rewriting concept.
If user login the page no need to clone the page.you could access the same page with this user data and specification(dynamic page).Many the page content with php functions
URL rewriting
you could the function in .htaccess
if user enters the page
http://example.com/someuser
its rewrite the url with
http://example.com?q=someuser
if you see the url bar its like special page for the user.

It's actually fairly simple. You just use GET within PHP and the URL would be something like http://example.com/user?id=4453623 - If you've ever been on facebook you'll notice they use PHP for the profile pages and much other things too. If you go to your profile page, you'll notice a "id=" variable up in the URL and that's how they determine which profile page to display to you.
This is basically what #Granny commented.

Using data from webpages to make a calculation

I would like to extract specific data from a webpage then open a specific webpage based on what that data is. In the form of an if statement.
Say for example I google the olympics (https://www.google.com/#safe=off&hl=en&q=olympics&btnK=Google+Search)
It says it is in "Rio" right now. Say based on "Rio" I have a link that directs to Wikipedia and if it said something other than "Rio" it directs to www.google.com. I need to find a way to be able to pinpoint the data I need from another webpage then make a decision based off of that. The hard part being assigning that data to a variable.
I would like to do this in jQuery if at all possible. If not what language what I need to do this? Is there a specific name for this type of thing (pulling data off of webpages) and are there any resources so I can learn more about it?
Thank you

I think its what you are looking for. Correct me if i'm wrong
You can use the PHP method on a file called go.php
<?echo get_file_contents($_GET['a']); ?>
and call it from AJAX using:
$.get("go.php?a=https://google.com", function(data){
//Your code....
});
IMPORTANT: DON'T FORGET THE HTTP OR HTTPS, if you forget it, go.php will try to find google.com in your server.
This method doesn't load the images because it tries to load them from your server

How to fill another website's form with the data in my own website

Here is the thing, I have a form in my web site looks like something like this:
Name: ----
Last name: ----
.
.
.
something like this, I work with a site that I have to send this information and type this requests again in that site with the same fields.
It means I want to copy my forms data to the target website's form with the same fields.
I do not have the access to target website's codes and I'm just a user there.
So I want to know if there is a way using Jquery, javascript or anything help me make a button that When I click that the data copy from my site to the target website.
Is it possible to access another browser's page tab inside another one??!! with jqyery?
Thank you in advance

I haven't tried your problem, and this is just an opinion.
If that website is using a get() method, you are saved. You can form a query string in the same format and execute it, else if you are trying to do something like that automatically if there is some captcha check you may fail, and the server will be blocking you thinking it's a DOS attack.
And this is something which may be helpful to you.
Javascript communication between browser tabs/windows

var w2 = window.open("Website you need to fill the form");
Now use w2 as owner window, in order to access the elements.

Javascript, jquery, ajax url query string rewrite

I thought this would be easy but I guess I was wrong. I have a url;
http://www.example.com/aa/bb.html?uid=123
using javascript jquery and html, I am able to retrieve data from a json api with the uid in the sample url above. However, I don't want that url displayed like that in the address bar after the data has been parsed. Rather, I need it to display as;
http://www.example.com/aa/item-title
where item-titleis the title of the data referenced by uid=123.
A php mod-rewrite would have been ideal, but this project does not make use of server side scripting.
Thanks in advance

If you change or modify the URL then the browser try to fetch data fro the new URL. You can do something with the part of URL after # mark.
Like :
http://www.example.com/aa/bb.html?uid=123#old_part
to
http://www.example.com/aa/bb.html?uid=123#newpart
I can see only one solution to your problem as you don't want to use mod_rewrite. You can redirect from first page just changing the URL based on the given uid value to the next page you want to display.
First page - read parameter uid and build the redirect URL based on the title(not any other stuff in your first URL page)
Redirect to the built URL
In redirected page do the rest of page specific stuff.