DEV Community

Iretii
Iretii

Posted on

Help.

How can I make a train ticket application more than one page? How do I add links that take the user to the other pages?

Top comments (21)

Collapse
 
joelbonetr profile image
JoelBonetR πŸ₯‡ • Edited

I'll assume you have (by convention) index.html, with a main.css attached (the html name matters, the css name doesn't. index.html is the default entry point on a server directory, so you can get the content with domain only i.e. joelbonetr.com/ will give you the index.html without specifying, if I set another name you'll get a 404 and must specify joelbonetr.com/filename.html).

You can add another html at the same level, let's say you have a directory with 3 files: main.scss index.html and second.html.
On the index.html you add a link (relative or absolute) to the second one like this:

Click <a href="second.html"> here </a> to visit second view.

then, on the second one you should have the following back link:

<a href="index.html"> Go back </a>

Now you have both pages connected. :D

Collapse
 
ireti03 profile image
Iretii

I'm sorry, I don't understandπŸ˜”

Collapse
 
joelbonetr profile image
JoelBonetR πŸ₯‡

Can you share a screenshot of your project to clarify?

Thread Thread
 
ireti03 profile image
Iretii

I haven't started. I wasn't sure how to, that's why I came here

Thread Thread
 
joelbonetr profile image
JoelBonetR πŸ₯‡ • Edited

well you must go for an html tutorial then a CSS one (or one that combines both).

These two technologies combined (HTML and CSS) will let you create interfaces / views. Then you will need to learn PHP (for example) to back your project and add functionality (manage data: create, read, update and delete pieces of data) and MySQL (for example) to store this data somewhere (you connect a server side language to a database for this).

I think PHP is the easier server side language to start with and the same on databases with MySQL (or MariaDB which is the same with different implementation).

You can use usbwebserver to have a place to start coding your project if you are with Windows OS or easily installing Apache server (that runs PHP) and MySQL driver for Linux, there are tones of tutorials (which in fact consist on throwing few commands into the system terminal).

Thread Thread
 
ireti03 profile image
Iretii

Oh I already learnt html and CSS and I was planning to host it on github. Those are the only two languages I know right now

Thread Thread
 
joelbonetr profile image
JoelBonetR πŸ₯‡

With this two you can't add functionality (ser interaction) more than linking html pages together using <a> tag for structuring information across different static views.

Thread Thread
 
ireti03 profile image
Iretii

So what do you suggest I do?

Thread Thread
 
joelbonetr profile image
JoelBonetR πŸ₯‡ • Edited

Build the views first so you can get a little bit of practice with html and css, then learn basic PHP and MySQL for adding functionality.

Finaly go for security on PHP environment to make sure you don't have security holes on your application

Thread Thread
 
ireti03 profile image
Iretii

Okay, thank you very much.

Thread Thread
 
joelbonetr profile image
JoelBonetR πŸ₯‡

you're welcome

Collapse
 
deciduously profile image
Ben Lovy

There's two strategies. You can either use a backend server to create the other pages, and then put links in your webpage to request them directly. Alternatively, you can use JavaScript to dynamically update the page that's already loaded. This is usually easier with a framework, the larger frameworks tend to have a solution for this built-in. The specifics will depend on the tool you use, and I think the simpler solution is to build a backend that can build each page you need.

Collapse
 
ireti03 profile image
Iretii

Thank you. It's an assignment to test my css skills so I'm going to push it to github. Also, I don't know javascript

Collapse
 
deciduously profile image
Ben Lovy • Edited

If the purpose is to exercise your CSS, and you dont want to branch out into a whole other tool, unfortunately I think you'd have an easier time if you can restrict your design to one page. While there are some relatively smooth ways to get started writing a backend, it is still going to involve learning some very non-CSS-related topics.

Thread Thread
 
ireti03 profile image
Iretii

Oh my teacher said it had to be more than one page while using just html and CSS

Thread Thread
 
deciduously profile image
Ben Lovy • Edited

Well, you can create multiple web pages each in isolation. Then, you can use the <a> tag to create links. Without a server, I think what your teacher wants is to use relative paths. So, if you have an index.html and a history.html, or whatever your other page will be, you can create an HTML element Like <a href="history.html">History Page</a> on your main page. When you open it locally in your browser, that link should work as long as your HTML files are stored in the same folder.

EDIT: looks like you got this answer several times!

Thread Thread
 
ireti03 profile image
Iretii

Alright this looks simple enough. I'll get to work on it. Thanks a lot!

Collapse
 
mranyx profile image
MrAnyx

Could you give us more informations. Which technology are you using : React, Vue, Php, plain html ... Are you using a framework : symfony, laravel, express ... Without those information, we will not be able to help you πŸ˜”

Collapse
 
ireti03 profile image
Iretii

I'm using just html and CSS. It's a check in application for booking train tickets

Collapse
 
mranyx profile image
MrAnyx

If you're using html and css, you can create multiple html files. Then you can call them using a tags like this.

Assuming you have 2 files one called index.html and one called ticket.html

In the index.html file you can call the ticket.html file using this :

<!-- rest of your code -->

<a href="ticket.html">link</a>

<!-- rest of your code -->
Thread Thread
 
ireti03 profile image
Iretii

Oh wow, this sounds pretty simple. Thank youu