Profile Website

Introduction

I was interested to demonstrate my abilities by creating a small application that I could use to help present myself professionally.

I have used a bootstrap template as the basis of my profile site and then have used this to deliver the front end content of what is essentially a profile content management system.

Once logged onto the back end of the profile site it is possible to modify the introduction text, contact information as well as the image that is used to help present the site.

The Brief

  • Create a profile website which can be used as an online CV. It should include a portfolio section where content can be inserted and updated as required.

The Requirements

  • Web Application - so that it is accessible to internet users
  • Dynamic Content - so that the information can be easily updated and edited
  • Responsive Design - so that it can be viewed on mobile devices as well as desktops
  • Must have an authentication system
  • Secure Content (Via SSL)
  • Portfolio presentation - so that images and text for a personal project can be showcased

The Implementation

  • AWS Lightsail VPS running Centos has been used to host the application
  • A bitnami supplied LAMP stack has been installed and configured
  • Amazon's Route53 has been used to register a domain and forward traffic to the VPS
  • Server side:
    • A vhost definition has been created for the site on the server as there are other applications deployed on it
    • PHP has been used to create the CMS aspect of the site
    • A small mariadb database has been created to hold the site content
    • Files and folders that are not to be publicly available have been restricted using Apache configuration
    • PHP-FPM has been configured to help reduce the servers loading
  • Client Side
    • Bootstrap3 has been used to deliver the responsive dynamic content
    • On the backend the CMS sections make use of asynchronous requests so that the content can be easily saved in situ without having to wait for page reloads
    • jQuery has been used to help with delivering the content

The Results

I am happy with the solution that I have been able to create. It has taken approximately 2 weeks of effort in my spare time to prepare the backend CMS side of things and around 2 days to create the front end with its current look and feel.

I would like to expand the CMS section in the future to allow for more settings to be entered such as google analytics tokens and some site styling options

  • PHP
  • Apache
  • Mariadb
  • jQuery
  • Bootstrap3 CSS
  • AWS Lightsail
  • Domain Management
  • VPS Installation and configuration
  • LAMP stack deployment


Screenshot from 2019-07-01 21-10-37.png

Screenshot from 2019-07-01 21-10-37.png

Screenshot from 2019-07-02 11-05-20.png

Screenshot from 2019-07-02 11-05-20.png

Screenshot from 2019-07-02 11-05-10.png

Screenshot from 2019-07-02 11-05-10.png

Screenshot from 2019-07-02 11-04-38.png

Screenshot from 2019-07-02 11-04-38.png

Screenshot from 2019-07-02 11-04-27.png

Screenshot from 2019-07-02 11-04-27.png

Screenshot from 2019-07-02 11-04-21.png

Screenshot from 2019-07-02 11-04-21.png

Screenshot from 2019-07-02 11-04-11.png

Screenshot from 2019-07-02 11-04-11.png

Screenshot from 2019-07-02 11-04-04.png

Screenshot from 2019-07-02 11-04-04.png

Screenshot from 2019-07-02 11-03-52.png

Screenshot from 2019-07-02 11-03-52.png