Static websites and PHP #

For general devweb documentation, see the main devweb page.

To setup a static or PHP-based site, copy your content into ~/DEVWEB/2024/. It'll then be immediately accessible at https://devweb2024.cis.strath.ac.uk/~USERNAME.

The web server expects to find an index.html, index.htm or index.php file at the site root. If you'd like more information about the current PHP version, you can create a file with the following contents (e.g. called ~/DEVWEB/2024/info.php):

<?php
    phpinfo();
?>

and access it in your browser to see configuration information for your PHP container.

CGI #

You can run classic-mode CGI scripts by copying them into your ~/DEVWEB/2024/ folder, making sure they have a .cgi extension and making them executable (e.g. chmod +x myscript.cgi).

Many languages and frameworks (including Perl, Ruby and C) support running web apps in CGI mode (although performance will be poorer than running as an app server).

React, Angular and other frontend JavaScript frameworks #

When deploying JavaScript apps built in frontend frameworks like React and Angular, make sure you copy the build output to your devweb directory, and not the source code. Usually this will be in a dist folder (for Angular and Vue) or a build folder (for React), after running the appropriate build command.

Setting the base URL #

Most JavaScript frontend frameworks assume your application will be running at / (the root of the web server). However, on devweb your app will be running in /~yourusername. You need to configure your app to build with the correct base URL.

For Angular apps, you can do this by passing the --base-href- parameter to ng build, e.g. ng build --base-href '/~abc12345/myproject/' (where abc12345 is your username, and assuming you are deploying your application to the subdirectory myproject within your ~/DEVWEB/2024 directory). Note the trailing forward slash / - it will not work without this. See the Angular docs for more information.

For React apps, how you achieve this depends on how you initially create your app. If you're using the Create React App tool, you need to add the homepage configuration value to your package.json file, e.g.:

  "homepage": "https://devweb2024.cis.strath.ac.uk/~abc12345/myapp",

See the Create React App docs for more information.

For Vue (vuejs) you need to set the publicPath config as per the Vue docs.

For Vite apps, you should add base path to your vite.config.ts file as per the Vite docs, for example:

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), WorkerPlugin()],
  base: "/~abc12345/myapp/"
})