Going Live with your final project for Intermediate Web Programming

Before getting started, make sure everything is working on your dev environment (localhost).

You'll need to be able to login to your cPanel dashboard.

Create a sub domain for your final project.

In the cPanel dashboard, scroll down to the section on 'Domains' and click on Domains

  1. Click the Create a New Domain button.
  2. Set the Domain to intwebdev followed by YOUR domain name (so, for example, if your domain is 'example.com' then you would enter intwebdev.example.com).
  3. Make sure to uncheck the checkbox to 'Share document root' (we don't want to share the document root).
  4. The textbox next to /public_html/ should automatically populate for you (it should be the same as what the Domain textbox is set to).
  5. Click Submit

Note that this will create a folder inside the public_html folder (on your server) that matches what you entered for the Domain.

Create a node application

In the cPanel dashboard, scroll down to the Software sections and click on the Setup Node.js App

  1. Click the Create Application button
  2. Set the Node.js version to 20.10.0
  3. Set the Application mode to Production
  4. Set the Application Root to intwebdev-final-project (this will create a folder for your application files, it will be a sibling of your public_html folder on the server).
  5. For the Application URL, choose the subdomain that you created previously
  6. Set the Application startup file to app.js
  7. Click the Create button

Register an application in cPanel

In the cPanel dashboard, scroll to the Software section, and click on Application Manager

  1. Click the Register Application button
  2. For the Application name, enter nodeAppForIntWeb
  3. For the Deployment Domain, select the subdomain you created previously
  4. You can leave the Base Application URL alone (it should default to a forward slash)
  5. Set the Application Path to intwebdev-final-project (this is the folder that has all files/code for your app)
  6. Click the Deploy button

At this point, in theory, you would be able to open a browser and enter your subdomain to see your app. But we have to do one more (strange) thing to get the app to work.

Deleting entries from the application's .htaccess file

In the previous step we registered an application in cPanel, which created some files and put them in the intwebdev.yourdomain.com folder (which should be inside your public_html folder). One of the files created in this folder is named .htaccess and we need to edit it.

Use FileManager in cPanel to edit the .htaccess file

In the cPanel dashboard, look in the Files section and click on File Manager. You should see all of the files on your live server.

  1. Double click on the icon for the public_html folder, to open the public_html folder
  2. You should see a folder with the same name as the subdomain that you created, open this folder.
  3. You should now see an .htaccess file, right-click on it and choose Edit, then click the Edit button that appears.
    • If you don't see the .htaccess file, then you might have to change a setting to see 'hidden' files
    • Click the Settings icon in the upper right corner of File Manager
    • Click the checkbox to 'view hidden files'
  4. Comment out all the lines that begin with 'Passanger'. To do this put a hash tag # at the beginning of the line.
  5. Click the Save Changes button

Now, if you visit your subdomain in the browser, you should see a message saying that the application works!

Copy your files to the live server

The application that you just made a request to from your browser is the sample one that gets created when you setup a NodeJS application in cPanel.

Now we'll replace this sample app with the code for you node final project.

The following files/folders must be copied from your node-final-project on our development computer to the intwebdev-final-project folder on your live server:

  1. app.js
  2. package.json
  3. modules
  4. public
  5. views
  6. blog

Notice that we did not include the node_modules folder. You can install the packages that the app depends on in cPanel by following these steps:

  1. In the cPanel dashboard, scroll down to the section for 'Software' and click on Setup Node.js App
  2. Click the pencil icon to Edit the Node app you created earlier.
  3. Click the button to Run NPM Install
  4. This should create a node_modules folder on your live server, and install the required packages (based on what's in the package.json file)

It may take a few mintues for the packages to install.

You may have to wait a minute, but try opening a browser and navigating to your subdomain. Hopefully you'll see your final project running on your live server!

Updating the app on your live server

If you add .md files, or make changes to the code, then you'll need to update the files to the intwebdev-final-project folder on the live server AND you might have to stop and start the app. After you upload the files, you can restart the app by logging into cPanel and clicking on Setup Node.js App. From there you can click the icon to restart your app.