Application Development

The goal of this project was to create a schedule tool suitable for deploying to the cloud where the user has the ability to create events with an event title, select the start and end dates, select the number of activity slots per day, the duration of each spot, and a brief description of each. The application was created over a number a number of weeks with each member contributing and taking an active role during each stage of the development. The application was written using PHP, JavaScript, HTML and CSS, with the finished product being launched on the Amazon Web Cloud Development platform.

            Our first task in creating this scheduling tool was to create some mock-ups of how we wanted the final product to look. These mock-ups included a calendar interface where we could view all the days of a month and select the date we wanted. It would also include a “New Event” button that would allow us to add an event for that date, along with details such as “Title”, “End Date”, “Activity Slots per day” and the “Duration of Slots”. When the details are entered and submitted, we wanted a table to display all the events created and their details.

(Fig 1. Our Design Mock-up)

            We then began to work on creating the code for our application. We researched examples online and consulted programming tutorials and forums such as “w3schools.com” and “stackoverflow.com” for tips and inspiration on how to get our Scheduling Tool working. We discovered a very useful tutorial for creating a calendar from YouTube, which can be found here: https://www.youtube.com/watch?v=xjrVf_kMFl8&index=1&list=PLE5528CC893BD650D

We had to tailor the calendar to suit our earlier designs, and these included altering the day and date format and setting up the CSS file to correctly position the calendar and give it a more modern and user friendly layout and design.

(Fig 2. Improved Layout Design)

Gradually, we started adding more and more functionality to the application. Once we had the calendar complete, the input and buttons created and the layout designed, we worked on having the data entered to be submitted to a database and stored. This was one of the most challenging parts of the project and required a lot of research and trial and error. We used phpmyadmin and MySQL to create our database and to store and display our data.  When we successfully had the Submit button working and saving data, we worked on developing the application to show on screen the activities we had created. This capability would allow users to view the activities were planned for that day and ensure the inputs are correct. Upon clicking the “View Details” button, users will be able to both add and view activities for that date.

(Fig 3. Event Details, Before and After)

The final stage of the application development was developing a way to add activity descriptions and time slots to the specific activities. To address this problem, we developed a smart process which would allow users to add as many activities as they wished on that data and can also add a time slot for each individual activity. Each activity can have a duration of 10, 15, 30 or 45 mins and must at least contain one entry. For this reason, we made the first input field mandatory so there would be no blank data entries.

(Fig 4. Adding Activity Details)

            As a group, we operated and interacted well. We worked as a team and met regularly to discuss the project and what aspects each member was going to undertake. On beginning the assignment, each team member was added to the Amazon Cloud Deployment, including the launch of the instance and connecting to the instance. We feel we have developed a very effective and useful tool that could prove beneficial to any event managing company.

(Fig 5. The finished product)

 

Cloud Deployment

Launching Our Instance:

To get started, we each Googled Amazon EC2 and read about how to create an account. Once we were each aware of how to achieve this, we created an AWS account. In registering, we were required to enter an email address along with bank details to ensure the registration was successful and legit. We had to launch an instance, which involved opening the Amazon EC2 console @http://console.aws.amazon.com/ec2/. Each group member was present for this stage as we all wanted and needed to get an idea of how setting up was done and to be aware of this when it came to the application development.

The next step involved was hitting the “Launch Instance” button followed by selecting the Amazon Linux AMI. We chose this particular AMI because each group member had experience in working with Java, PHP and MySQL which the Amazon Linux AMI possessed. Upon selecting the Linux AMI we had the option to select the hardware configuration of the instance. We decided as a group to allow the wizard to complete the configuration settings for us because it was recommended and the research we had completed as a group pointed us in this direction. The wizard sets up a security group automatically which we had to edit to gain access to the server from our own IP Address. This involved changing the inbound and outbound rule. On one instance, Kevin encountered a problem connecting to the server because his IP Address was constantly changing; therefore we decided to allow access from “Anywhere” to solve this issue. We were made aware of this option further the research based on cloud deployment by Shane. After this was solved, on the “Review Instance Launch” page, we chose “Launch”.

Following “Launch” we were prompted for a pair key, we had the option to “Choose an existing pair key” or “Create a new Key”. We choose “Create a new key” again based on our research which was done by Conor this time. We had to enter a name for the key pair (project.pem) and then had to download the key.

Below is an example of how we chose to “choose and existing pair”, given the option of downloading our “key pair” and launching the instance. This stage of the deployment was completed together by each team member. We organised a meeting which we all attended again to ensure that we were all aware of how to set up an account on AWS.

After the download was finished we stored the key in a safe place for future reference. This was an important part of the process as we had to upload our key file to “putty” to connect to the server. During Ciaran’s research, he discovered that without a valid pair key, if we launched an instance we would not be able to connect successfully to it. Once our instance was complete, when then had to connect to it.

Connecting To Our Instance:

We connected to the instance using Putty as again each group member has had experience working with it throughout our time at college. We then used Putty Gen to convert our key pair into a private key.

Above is a screenshot we took to monitor our progress and show how we used Putty to generate our key pair into a private key. Again this stage was completed at the first meeting with the attention of each group member.

Below is another screenshot this time of where we saved our file key which later was uploaded to Putty Gen to allow for the convert of our key file to a private one.

Once the file had been converted and saved, we could then go onto the Putty configuration to connect to the instance. We enter both username (ec2-user) followed by @ and our public DNS (ec2-52-50-174-82.eu-west-1.compute.amazonaws.com) into the host name field. The port must be set at 22 and we also have to upload the key file into the SSH authentication section. Similarly each group member was present for this part of the deployment

Above is a screenshot which displays our Putty configuration screen which allowed us to view our host name inputted it its required field, the port number inputted and set to 22 and the upload of our project.pem private key. The image below represents the SSH authentication section where we had to upload our private key file (project.ppk) for authentication.

After this phase was successfully completed, a window popped up representing a successful connection to our instance. This verified that we had completed the cloud deployment successfully and resulted in allowing us to begin to developing our event application. After we connected to our instance we divided into two groups and research the different options available to us in relation to our instance before we began moving onto to the application development. We looked at terminating our instance if it was necessary which involved choosing “instances”, “actions”, “instance state” and then choosing “terminate”. A verification prompt message will be displayed requested you to choose “yes”. The image below displays us successfully connected to our instance along with the Instance ID, Instance Type, Availability Zone, Instance State, Status Check, Alarm Status and Public DNS.

Conclusion:

This completed our cloud deployment activity. We achieved the entire process over a meeting which each group member was present and contributed evenly. Most of the tasks were performed together as it involved a step by step guide to successfully create and connect to an instance as part of the cloud deployment. We each research different aspects of the Amazon cloud deployment which involved Shane and Ciaran researching the launch of the instance and Kevin and Conor focusing on connecting to the instance. To ensure we all had an understanding of each part of the deployment, during the meeting we had a quick discussion about our research again to ensure each team member had a wide understand of each aspect. We also attached various screenshots to record our progress throughout the deployment phase.