SMS Manager: A Multi-Tier Web Application For Saving And Sharing Messages, Essay.

Note: for guidelines what to hand in and what the marker will be looking for, see the marking scheme.

Working INDIVIDUALLY:

1. Web portal: The architecture of the assignment needs to be strictly three tiers based. This means web portal is only used for rendering contents, taking inputs from users and feeding back results. The portal is not supposed to handle any business logics (PHP, Ruby on Rails, JSP style portal and things similar will not be accepted and marked). You will need to use javascript+HTML 5+CSS for your web portal development. Necessary third party libraries are allowed in the implementation. It should not point any specific backend server (bound with specific IP/hostname or etc.) but needs to be configurable using some configuration files
2. Middle Layer: A middle layer that talks to both database and web portal through message exchange. It should handle all business logics (how SMS should be manipulated, how transaction is supported, authorisation and authentication and etc.). The middle layer needs to be implemented conforming to Java Servlet standard. It needs to be done in JAVA rather than any other programming languages. It should not point any specific backend database, but is configurable using web.xml configure file.
3. Database: MySQL database will be used to store data. You will need to define your database schema that support your application. For this assignment, you don’t need to worry too much about the DB normalisation rules and etc. You can use one table even as long as it satisfies your needs.
4. Message Exchange: The messages that are exchanged between the portal and middle layer need to be JSON. This leads the whole system to a completely decoupled manner. No portal will be relying on any specific middle layer’s implementation and vice versa. Both of them are only dependent on the contents of the messages exchanged and interpretations of those messages.

Learning Outcomes assessed
1. Understanding of multi-tier web application architecture and corresponded infrastructure setup.
2. Use of Servlets as a middle layer technology for web application development
3. Use of JavaScript and AJAX for web front development.
4. Use of JSON/XML as for exchanging messages between web portal and server application
5. Use of HTML/HTML 5 and CSS for web portal rendering.
6. Use of JDBC/Hibernate to operate Database (MySQL).
7. Understanding of how authorisations and authentications of web applications are conducted and are able to implement them for the web application.

Technologies used in this project

SMS Manager is web application for saving and sharing our messages to the other users available on the server, in short you can say it is an social application where you can write your messages and share them to the world or you can use it like draft whatever is on your mind just write and save it as private. Only you will be able to see those messages. On other hand you can see and read their thoughts by the public messages from them.

For that just register yourself to the application and login to the application later, now you will be able to see others public messages and you can add your own messages as private or public. You can edit or delete your own messages but not others.

Technologies used in this project

MySQL Database:-

MySQL is the database which supports SQL Structured Query Language to perform queries related to DDA and DMA.

DDA stands for Data Definition Language and used for defining the schema of our database. where DMA stands for Data Manipulation Language and used for our data retrieval, insertion, updation or deletion queries.

In SMS Manager Project MySQL database is used for providing the data to the user and storing the data from user end. In this project there are used two tables

User table is used for storing the details of all the users who will register in the app through registration module. Later we use their details to provide the appropriate data related to specifically that user.

Massages Table is used for storing the details of all the messages which are stored by the different users of the App.

Servlet:-

Servlet is used for creating the web apps which generates the dynamic web pages at server side and then response. Servlet resides at server side. Servlet is a part of java technology and is robust and secure because of it. Servlet is an API it provides many interfaces, classes. When a user hits any URL, a servlet is called mapped to that Url it is called servlet mapping and then servlet is called which generates the response according to the request by the user.

A web application is an application open from the web. A web application is made out of web parts like Servlet, JSP, Filter, and so forth and different components, for example, HTML, CSS, and JavaScript. The web parts normally execute in Web Server and react to the HTTP ask.

MySQL Database

Ajax:-

AJAX stays for Asynchronous JavaScript and XML. AJAX is another technique for upgrading, speedier, and more instinctive web applications with the help of XML, HTML, CSS, and Java Script. Standard web applications transmit data to and from the distinctive utilizing synchronous asking. It proposes you round out a shape, hit submit, and get encouraged to another page with new data from the server.

JSON:-

JSON or JavaScript Object Notation is a lightweight content based open standard intended for comprehensible information exchange. JSON is used to transfer data from server to client  or from client to server, JSON is the convenient way to transfer data over the network. It is lightweight and easy to read and parseable, JSON is used to communicate between two different technologies like java to .net or java to php. Almost every server side language supports JSON like java, .net , php, python, perl and so on.

JavaScript:-

JavaScript is a lightweight, deciphered programming vernacular. Foreseen making structure driven applications. Relating to and made with Java. Relating to and empowered with HTML. Open and cross-deal with. Client side JavaScript is the most in actuality understood kind of the tongue. The substance should be merged into or referenced by a HTML record for the code to be interpreted by the program.

It instigates that a site page require not be a static HTML, yet rather can join meanders that orchestrate with the customer, control the program, and feasibly make HTML content. The JavaScript client side part gives diverse propensities over standard CGI server-side substance. For example, you may use JavaScript to check if the customer has entered a genuine email address in an edge field. The JavaScript code is executed when the customer shows the shape, and just if each and every one of the sections are critical, they would be submitted to the Web Server.

HTML 5:-

Hypertext Markup Language (HTML) is the standard markup dialect for making site pages and web applications. With Cascading Style Sheets (CSS) and JavaScript, it frames a ternion of foundation innovations for the World Wide Web.

Html provide the structure for the web app page, everything user see on the page is structured by the html.Internet browsers get HTML records from a web server or from neighborhood stockpiling and render the archives into media website pages. HTML portrays the structure of a page semantically and initially included signs for the presence of the report.

Servlet

CSS 3:-

Cascading Style Sheets (CSS) is used for styling the html elements of the web pages of any web application. Css can be added in three ways.

Inline Css

Internal Css

External Css

Inline css is added direct to the html element  where as internal css is added inside the html page head or body within style tag and external css is a seperate file with css extention and all the css related to the element is written over that file and at last we add that external file into our html file.

CSS is responsible for styling the Web Page it makes page look more pretty and beautiful.css can be added dynamically to the elements by the scripting languages like js.Css makes web page more user friendly and interactive.

Servlet API’s Description:-

In this web app servlet is used as the middle layer hence app needs some Api related to the app functions are written below..

LoginServlet:-

When the web app launches and the user see the first screen of the app that is the login screen, if the user is already registered then he can enter the credentials and simply he can just logged in to his account, if he is not already registered to the app then he must register first yourself to the app first.

User enters the credentials related to his account from the front end of the login page and when he hits the login button over the web page an Api (POST request) is called to the middle layer that is LoginServlet. Inside this Servlet dopost method is called which has HttpServlet Request and HttpServlet Response arguments. From the request we get the parameters which are send to the servlet with the request from the login page. After that a method is called to get the user details of the entered emailId from the database, it returns the user, if user is null then it means there is no user in our database having emailId with the entered one. If user is not null it means we have a user with emailId entered one, then we match the password from the database and the user entered one if they match then we create a session for the user and send him to the home page if password mismatch then we show him a message that the username or password are wrong.

SignupServlet:-

Ajax

User launches the app very first time and sees the login screen and he haven’t register himself to the app. He can simply register himself to the app by the registration portal by filling the details which are required from the user. User can simply click on the create one button to navigate to the signup page and then he can easily fill the details which are asked him to fill there when user hits the signup button after filling the details a POST request is called to SignupServlet where dopost method is called which has HttpServlet request and HttpServler response as arguments, from which we get the request parameters from the httpservlet request, from the request parameters we get the email id and call a method to check whether any user has already registered with that email id previously. Method returns the user if the user is null it means there is no user in our database with such email id and we call another method to register the user details to our database and send him to the login page to login to the app. If user returned from the method is not null it means there is a user in our database with that email id and we can’t let multiple user having the same email id, in this case we show him a message that “this email id already exist in our records”.

AllMessageServlet:-

Now user has successfully logged in to the application and now he is on home screen, while he logged in to the home page an method is called from the javascript file to get the all messages for his account which includes the messages saved by him and the public messages saved by another users, javascript method calls Ajax to get the data, ajax calls the servlet AllMessageServlet and in the servlet doGet method is called in order to get the list of messages, from the session we get the userId of the logged in user to app and we call a method to get the list of the messages from the database and pass the userid as the argument, in the backend an sql query is called to fetch the message list from the db, query gets all the messages which are saved or added by the logged in user apart from the type/mode (public/private) & all the public messages added or saved by the other users, not in the servlet we parse this list to the json using the Gson and send back to the ajax, here in javascript file we get the json of the messagelist, we parse it and and populate it to the table on the home page.

JSON

SaveMessageServlet:-

On home page user can add message by clicking the New Message button on the left side of the header, when he clicks the button a modal opens to write the message he wants to save and can set the mode/type (private) by checking the check box by default all post will be public and when he hits the save button ajax is called which calls the SaveMessageServlet we get the parameters from the HttpServlet Request and then call the method to save the message in to the database passing the message details and the userId got from the session `to identify the which message belongs to him later he can edit the messages to by clicking the button in the table in action column. Same servlet is called in updating a message, it is handled with the message id.

DeleteServlet:-

User can delete the messages from the home page by clicking the delete button but he can only be able to delete or update only those messages which are added by him only he can not delete or update messages added by another users. When user clicks the delete button in javascript file an ajax is called in order to delete the particular message from the database. DeleteServlet is called to delete the message in its dopost method another method is called to delete the message from the database, we pass the message id as argument.

Every application needs data to view to their user and to store that data app needs the Databases, there are many types of databases. But in this SMS Manager web app MySQL database is used to store the data related to users and their messages. Creating a database is not enough it has to be normalised and efficient to get easily data. Database schema related queries are written below.

//query for creation of database

create database sms_manager;

//using the created database

use sms_manager;

// creation of users table which contain details of all the users

create table users

( id int not null auto_increment,

name text not null,

email text not null,

password text not null,

primary key (id)

// creation of messages table which contain details of all the messages

create table messages

( id int not null auto_increment,

msg text not null,

author int not null,

mode int,

primary key (id)

Problems & Experiences:-

=> If you are new to Servlet, there are more chances that you may stuck on many points very easily. In servlet HttpServlet Request and HttpServlet Response are things needs to understand first.

=> If you are not familiar to the request types you may have problem in understanding the working of api’s and send data with them.

=> You need to understand the difference between GET and POST request and the way the data sends with each one.

=> Servlet life cycle need to be very clear to you to understand the working of servlet.

=>  Tomcat server and external jars can take some time

=>  You should be aware of how to establish a JDBC connection using the jar file

=> You may have problem in  sending data from servlet to the html page

=> Getting the session attributes in the html file.

These are some problems, that i or anyone can face during creating a servlet project, but at the end you will get know how to deal with these problems and you will be able to find the solution of these kind of problems by yourself.

An application can never be perfect, it needs enhancement all the time and new features to be added to it. Similar is with this one SMS Manager, it is not a perfect application in many ways.

It also needs some enhancement and improvements in order more user friendly and and catchy.

There are some improvements that can be added to the current application.

=> User can like and share the messages that he likes with others.

=> User can able to upload picture as profile and other details.

=> Email verification should be introduced.

=> Public/ Private is cool but can introduce some other type like Friends, Family etc.

=> User can comment on the messages like any other social sites.

=> Message types should be introduced.

=> Some other features should be added in order to make application more attractive and catchy