Current best practice when building a multi-page website

Current best practice when building a multi-page website
0.0 0

#1

To practice my refreshed HTML and CSS skills, and new Bootstrap info, I redesigned a website I haven’t revisited since 2015.

Back then, to not have to update 10 pages of individual code of a reused feature (like navbar) on an update, I used php to <?php include("nav.php"); ?> for instance, so all updates to the navbar could be done in one place for all pages using the navbar.

Is this still a common method, or is there a better way now than using PHP?

Also, is there a good resource that can run through your site/code for browser compatibility (or any other testing) prior to going live? Or maybe this can be done through my IDE (Adobe Brackets)?

Thanks in advance.


#2

The freeCodeCamp curriculum moves towards using EJS (embedded JavaScript) in the full stack apps (or at least that’s what I used), or React.

EJS is the most similar to having PHP includes for resusable HTML.

React is a different beast, but lets you create reusable components that react to changes in state in your web apps.

If you’re focussing on front end, React is a good starting point :slight_smile:


#3

It’s much the same whatever you use. Chop your site up into generic components (header, nav, footer etc). Reuse those. If your just building websites, by all means stick with PHP - you’re just rendering static pages so it’ll work great for that.

Re browser testing, yes, but it costs $$$ if you don’t want to keep signing up for a free trial period under different emails every hour (Browserstack for example). Normally very much cheaper to manually test in browsers, only costs time. Test ideally in Chrome, Firefox, IE/Edge, Android and OSX. Chrome has a pretty good emulator for mobile devices, and is excellent for a debugging Android phones/tablets. If you’re on a Mac, Safari has excellent support for debugging iPhones/Pads and XCode has a pretty good device emulator.

Note that on a Mac, you need a VM to get IE/Edge, and if you’re on Windows you can’t get Safari.

Edit: re front end frameworks like React etc, if you’re building a traditional website you don’t really need to think about them. Multi page traditional websites are basically a solved problem, and PHP does just fine, with a sprinkling of JS for the interactive parts. But if you want to start thinking about removing things like actually opening a new page every time you navigate to a different part of the site, making it more app-like, that’s where they come in: doing stuff like that without a framework tends to get hairy and you end up with a big ball of JS mess.