BSc (Hons) Computing
Advanced Server-side Technologies
Londontec – Colombo
Submitted By:
Student Name:
Student ID:
Module Leader:
Module Code:
Cohort:
Content
Part I – Deployment Report | Page No: 08 – 16 | |||||
Part II – Reflective Essay |
Page No: 17 – 29 | |||||
Appendix | Page No: 32 – 48 |
Login Details
Administrator
Username: [Write Username]
Password: [Write Password]
Student
Username: [Write Username]
Password: [Write Password]
TEESSIDE UNIVERSITY
SCHOOL OF COMPUTING
ICA SPECIFICATION |
-
Module Title: Advanced Server-side Technologies
Module Leader: Andrew Bingham
Module Code: MUL3055-N
Assignment Title: OLV Website and Documentation
Deadline Date: 31st December 2016
Deadline Time: 3.00 PM
Submission Method:
Should be Handed over to Londontec
1 Hard Copy
2 Soft Copies
-
-
Central Assignments Office (Middlesbrough Tower M2.08) Notes:
All work (including CDs etc) needs to be secured in a plastic envelope or a directory and clearly marked with the student name, number and module title.
An Assignment Front Sheet should be fully completed before the work is submitted.
When an extension has been granted, a fully completed and signed Extension form must be submitted to the SCM Reception.
-
FULL DETAILS OF THE ASSIGNMENT ARE ATTACHED INCLUDING MARKING & GRADING CRITERIA |
OVERVIEW
Online Learning Video Repository (OLV) is a web based platform developed for the betterment of the students of Teesside University. Using this platform, students can contribute in uploading the video links (and some other details about the video, basically the meta-data) they find are really helpful for them as well as others and thus helping to develop an effective learning environment among the students. Students can create their own accounts by registering them with OLV. After that, they are liable to upload the video links which they find suitable to view. There is also an Admin Panel using which, the assigned Admin can keep a check on the video links being shared. The Admin has authority to remove a video link which is found to be inappropriate.
Once the students sign up for OLV, they land to the home page which actually contains a list of courses available on the platform. They can choose the courses they want to look for. Upon selecting a course, they land to the video-repository page. This page contains the videos associated with the selected course. Upon selecting the video of their choice, students can view that video.
[Write this yourself thanking people…]
Table of Contents
4.2 Non-functional Requirements 8
4.3 Key Framework Technologies 8
4.4.2 Which server we used? 10
4.4.3 Web Server Environment 11
4.6.2 Responsive Pages Error! Bookmark not defined.
4.7.1 Setup Database on remote server 18
4.7.2 Upload webApp Files to remote server Error! Bookmark not defined.
5.1 Development Methodology Error! Bookmark not defined.
3 SCENARIO
You are required to build a prototype Web Application called: Online Learning Video Repository (OLV) a crowd based application that allows the curation of online learning videos aimed at students at Teesside University. The idea is that students are increasingly using online videos to learn, but often keep these to themselves and/or store the URL’s in YouTube etc… It is expected that the OLV will be used as a standalone web application, and students would need to register. Students would be able to view, search, leave comments and rate learning videos. The latter is important to ensure students know that what they are viewing has endorsement and therefore recognition as a useful learning resource.
It is expected that there will be a basic system of being able to add a video, such as the YouTube ‘shortened URL’ or full URL to other resources (there is no need to upload the actual video file). There would also be an existing list of modules that students could attach the video too. We are looking for ideas in terms of enhanced features, so if you have your own ideas – we would want to hear about them and explore them in the prototype.
4 DEPLOYMENT DOCUMENTATION
4.1 and 4.2 Required Functional and non-functional requirements:
Must allow a student user to register using their email address. The User Password must be encrypted using an appropriate built in Yii crypt() method.
admin users can be hard coded into the DB, and can have a separate login area.
Must include students first and last name and student id
Must allow user to login with their email address
Must allow the user to create a new video reference, with appropriate data such as title, URL, metadata etc..
Must allow the users to view details about the video.
Must allow an admin user to edit the data for a video entry.
Must allow an admin user to delete a video.
User dashboard should include functionality associated with the functions.
4.3 Key Framework Technologies
4.3.1 PHP Development
PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML.
Instead of lots of commands to output HTML (as seen in C or Perl), PHP pages contain HTML with embedded code that does “something” (in this case, output “Hi, I’m a PHP script!”). The PHP code is enclosed in special that allow you to jump into and out of “PHP mode.”
What distinguishes PHP from something like client-side JavaScript is that the code is executed on the server, generating HTML which is then sent to the client. The client would receive the results of running that script, but would not know what the underlying code was. You can even configure your web server to process all your HTML files with PHP, and then there’s really no way that users can tell what you have up your sleeve.
The best things in using PHP are that it is extremely simple for a newcomer, but offers many advanced features for a professional programmer. Don’t be afraid reading the long list of PHP’s features. You can jump in, in a short time, and start writing simple scripts in a few hours.
Although PHP’s development is focused on server-side scripting, you can do much more with it. Read on, and see more in the What can PHP do? section, or go right to the introductory tutorial if you are only interested in web programming.
4.3.2 PHP Frameworks
A PHP Framework is a collection of classes which help you develop a web application.
The popular PHP frameworks of Today are:
Yii
Think PHP
CakePHP
Codeigniter – CI
YII Framework
Yii is a high-performance, component-based PHP framework for developing large-scale Web applications rapidly. It enables maximum reusability in Web programming and can significantly accelerate your Web application development process. The name Yii is an acroynym for “Yes It Is!“.
To run a Yii-powered Web application, you need a Web server that supports PHP 5.1.0. For developers who want to use Yii, understanding object-oriented programming (OOP) is very helpful, because Yii is a pure OOP framework.
Yii is a generic Web programming framework that can be used for developing virtually any type of Web application. Because it is light-weight and equipped with sophisticated caching mechanisms, it is especially suited to high-traffic applications, such as portals, forums, content management systems (CMS), e-commerce systems, etc.
4.4 Server Environment
4.4.1 What is Server?
A computer or device on a network that manages network resources. There are many different types of servers. For example:
File server: a computer and storage device dedicated to storingfiles. Any user on the network can store files on the server.
Print server: a computer that manages one or more printers, and a network server is a computer that manages network traffic.
Database server: a computer system that processes databasequeries.
Servers are often dedicated, meaning that they perform no other tasks besides their server tasks. On multiprocessing operating systems, however, a single computer can execute several programs at once. A server in this case could refer to the program that is managing resources rather than the entire compute
4.4.2 Which server we used?
For our project we used localhost as a web server (Using WAMP running Apache Server). It used HTTP protocol (Hyper Text Transfer Protocol) to deliver the webpages to the browser (we used Chrome and Mozilla Firefox (latest)).
4.4.3 Web Server Environment
The following table shows the server-sided process taking place in a Web Server and Application server:
4.5 Server Requirements
Online Learning Video Platform (OLV) server has the following requirements:
Information |
Minimum Value |
Recommended Value |
Web Space |
1 GB |
5 GB |
Bandwidth |
1 MBps |
Unlimited |
Server | Linux with apache 2.4.x /
PHP 5.2.x |
Linux with apache 2.4.9 / PHP 5.5.x |
Databases |
MySQL 5.2.x Greater |
MySQL5.6.x |
FTP Accounts |
1 |
5 |
Subdomains |
3 |
5 |
Services |
phpmyAdmin 4.1.x |
phpmyAdmin 4.5.x |
4.6 User Interface
4.6.1 Justification
While talking about the interface designing of the portal, we focused on minimalism and Google Material Design. We used flat buttons and icons.
We used the color code # 2EA5F5 (HEX Value) blue and white base. This shade of blue is complementary color of the theme color (orange) of Teesside University. Blue represents harmony and collaboration. It is also the color of trust.
Hence, our design and theme color shows simplicity with trust and harmony of the university.
Our page is divided into the following structure:
Figure(1)
Index Page: Welcoming user to the portal. On the right hand of it has two buttons for Log In and Sign Up
Figure(2)
Index page also shows the user on how to proceed.
Figure(3)
Login Page: It allows users to login into the portal
Figure(4)
Sign Up page: Allows users to sign up into the portal
Figure(5)
Home Page: It shows all courses available on the portal. On the left side of the page, there is a filter area for sorting them.
Figure(6)
Home page also has section for commenting and sending of message by the user
Figure(7)
Video List page: This page shows all the videos associated with the particular course
Figure(8)
Video Player page: This page plays the video associated with the link/
Responsiveness:
We used CSS3 media query to make the page fully responsive for all devices
4.7 Deployment
4.7.1 Setup Database on remote server
We have created a template SQL file, open the PhpMyAdmin of the localhost or the server you are using. This setups the database required for the portal and the portal can be run by signing in up and then logging in to run.
4.8 Load Balancing
Load Balancing on Web application server clusters. A cluster is a gathering of servers running a Web application at the same time, appearing to the world as though it were a solitary server.
High availability can be defined as redundancy. If one server cannot handle a request, can other servers in the cluster handle it? In a highly available system, if a single Web server fails, then another server takes over, as transparently as possible, to process the request.
5 REFLECTIVE ESSAY
Online Learning Video Repository (OLV) is a crowd based web-application, a platform to provide free access to the quality education material and videos aimed for students at Teesside University. Any student who has interesting videos or playlist that can benefit other students can use this portal to share his/her videos to everyone in the university.
While making this portal I needed to first identify the main problem and what possible solution is required to solve it. As mentioned in the assignment, students in the university are increasingly using online videos to learn, but they keep those with themselves. So, mentioned solution was to make an online learning video portal where students can register and able to view videos shared by other students. Also, they had to be able to search through the videos, comment and rate them. So, keeping these points in mind, I made a structured outline and identified the page structured. I aimed that my portal should consist of the following pages:
Welcome page: Provide users with a welcome message as well as a quick glimpse of the features of the portal.
Login/Signup pages: For the users to sign up for the portal and sign in to view and upload the videos.
Dashboard for admin and students: To provide quick glimpse to the admin of the number of videos uploaded by the students, able to modify their information etc. And for students to upload videos.
Course selection page: That shall show users of what course videos are available and also allow them to sort them by various parameters.
Video display page: A page where the users can view and play the videos.
I structured my pages and code using the MVC framework. MVC stands for Model, View and Controller which classifies function of each component, such that, model contain all components which directly manages the data, logic and rules of the application, view contains those which out puts the information to the user and the controller accepts input and converts it to command of the model. By using it I classified my work very efficiently into parts and concentrate on them separately, I first, worked on the design part using HTML 5, CSS3 and JS. Next I worked on the controller part and made controller.php, this page controls the link sent by index.php and re-directs into destination class and methods. And last I worked on the model, where I worked on the SQL database and PhpMyAdmin to create tables required for the portal and made the connection using php connect function.
The problems I encountered during my project were:
To decide a theme for the website and the layout which I made using Adobe Experience Design. Adobe Experience Design is a new tool from Adobe (currently in beta version) which allows a person to make design very easily. So I first made my design on it, and then coded after finalizing.
To make a logo for the website. I had to think of the logo accordingly the theme of the website. So, I thought of thinking of the name of the website. I thought of map pointer in google maps, I used its bottom pointer as V and circular head as O and put an L in between and come up with the logo. I created the logo using Adobe Illustrator which is very popular for vector graphics designing.
To make the page fully responsive. So, to make this, I used media query property in CSS3. I identified which section of the pages are crossing over whom or the structured is not being properly aligned; I tried to decrease the width of the window of the browser and noted the width. Then I made separate media query for each width: 500px, 600px and 700px. Then I put separate properties for the elements in each media queries till the elements get properly aligned. Next Problem I got was in making the slider of the sorting video section.
To make the business-logic work as intended. To make this possible I went through various tutorials online. I went through UDEMY’s tutorial on MVC framework to have a stronger theoretical knowledge of it.
I tried my best to come up with all the user’s functional requirements. Requirements such as registration via email, separate login area for users and admin, upload of video and allowance of admin to edit data, delete video and user’s dashboard are very functional.
5.2 Model-View-Controller
Models
Models represent knowledge. A model could be a single object (rather uninteresting), or it could be some structure of objects.
There should be a one-to-one correspondence between the model and its parts on the one hand, and the represented world as perceived by the owner of the model on the other hand.
Views
A view is a (visual) representation of its model. It would ordinarily highlight certain attributes of the model and suppress others. It is thus acting as a presentation filter.
A view is attached to its model (or model part) and gets the data necessary for the presentation from the model by asking questions. It may also update the model by sending appropriate messages. All these questions and messages have to be in the terminology of the model, the view will therefore have to know the semantics of the attributes of the model it represents.
Controllers
A controller is the link between a user and the system. It provides the user with input by arranging for relevant views to present themselves in appropriate places on the screen. It provides means for user output by presenting the user with menus or other means of giving commands and data. The controller receives such user output, translates it into the appropriate messages and pass these messages on to one or more of the views.
REFERENCES
PHP frameworks (2016). Available:
http://www.phpframeworks.com/. Last accessed Dec2016.
YII framework official website (2016). Introduction to YII. Available:
http://www.yiiframework.com/doc/guide/1.1/en/quickstart.what-is-yii. Last accessed Dec-2016.
Coding Horror (2016). Understanding Model View Controller. Available:
https://blog.codinghorror.com/understanding-model-view-controller/. Last accessed Dec2016.
Webopedia (2016). Introduction to Server. Available:
http://www.webopedia.com/TERM/S/server.html Last accessed Dec2016.
w3care. (2015). YII Framework. Available:
https://www.w3care.com/technologies/php–frameworks/yii–framework/. Last accessed Dec-2016.
W3Cschools (2016). Display Flex, HTML attributes, CSS selectors, PHP. Available
https://www.w3cschools.com. Last accessed Dec 2016
Tags: Assignment Help for Students, Assignment Help Free, Assignment Help Online Free, Assignment Help Websites, assignmenthelp, AssignmentHelpOnline, BestAssignmentHelp, myassignmenthelp, OnlineAssignmentHelp, Student Assignment Help, University Assignment Help