YT YouTube2Text

YouTube2Text → Transcripts → Application Design and Development/1

Application Design and Development/1 — Transcript

by Data Base Management System - IITKGP · 5,004 words · 819 segments · language en · Watch on YouTube

Open in transcriber Summarize with AI Download SRT/VTT

Full transcript

0:00[Music]
0:16welcome to module 21 of database
0:20management systems
0:22in this module and the next two we will
0:24discuss about
0:25application design and development
0:29in the last week
0:31we have
0:32for the whole week in the five modules
0:34we have discussed about relational
0:36database design
0:38in depth we have looked into what are
0:40the different aspects of that
0:42and now we get into the core issue of if
0:46i have a relational database design
0:49existing and that is populated with the
0:51data
0:52then based on that how do we
0:54develop how do we create an application
0:58where the user can interact and actually
1:01ah get answers to the questions that the
1:04user has or the user can actually update
1:08ah the data create new data remove old
1:11data and so on
1:13so we would in that process like to
1:15familiarize with the fundamental notions
1:19of
1:20notions and technologies of
1:22web applications
1:24and
1:25specifically we would learn about
1:27servlets and java server pages
1:31so these are the three topics to be
1:33covered
1:34so we first start with application
1:36programs and user interfaces
1:39so the situation is where we do have a
1:43relational database design its populated
1:46with
1:47the required data but
1:50how about the interaction with the user
1:54incidentally most of the you database
1:56users do not
1:58interact
1:59with the database or query the database
2:02using language like sql because as you
2:05have seen it is not a very friendly
2:08language
2:09and it is not presentable in a way which
2:12i would we would
2:14always expect or we would like
2:16so
2:19usually an application program acts as a
2:22as we say as an intermediary between the
2:24user and the database and
2:27it is often split into
2:29three
2:30layers as we will say front end middle
2:32layer and back end
2:34so on the right i have shown these three
2:37layers we will talk more about that this
2:39is just a representative diagram
2:41so the front end is
2:44the user interface it is also called the
2:46presentation layer so it is the
2:49the layer where it is a part of the
2:52application where there are forms guis
2:56and different
2:58ways to
3:00input as well as get output of the data
3:03which is directly interacting with the
3:05user
3:06then we have a middle layer or it is
3:09also called
3:10the business logic layer or the
3:12application layer where the
3:15functionality of the application the
3:16required the operations of the or
3:19desired behavior of the application are
3:22coded and its kind of acts as a link
3:24between the front end
3:26and the back end
3:28and what is the back end back end is the
3:30actual data access layer or it is where
3:34the persistent data the database that we
3:36have created ah exist it is typically
3:40large in volume needs efficient access
3:42and so on
3:43so in this module we will try to
3:46understand as to how such what are the
3:49different requirements and what are the
3:50different technologies involved in
3:52creating such a layered application
3:56now if we historically look at so here
3:58we are just showing ah three phases
4:02initially 60s and 70s where the first
4:05data based application started
4:07then the
4:09interaction used to be text based from
4:11the terminal and
4:13those used to directly connect to the
4:16mainframe computer where the data
4:18existed through either a direct
4:20connection dialogue phone or proprietary
4:23network and as we moved to the 80s then
4:26we saw the advent of ah local area
4:28network so application programs or
4:30desktop
4:31would interact with the database through
4:33these
4:34local area networks
4:36and
4:38beyond that we have the what we call the
4:40web era which is nineteen ninety nine
4:43nineteen ninety onwards when the that's
4:45that's about roughly the last thirty
4:47years where typically the applications
4:50are now based on
4:52web browsers so the front end where we
4:55actually interact our web browsers and
4:58that connect to the web application
5:01server the database everything through
5:02an internet
5:04and i must
5:06tell you at this point that
5:08when you say this is the architecture it
5:10does not necessarily mean
5:12that the cloud shown as internet will
5:14have to be the web
5:16it could be an internet which is created
5:19with a set of systems within your
5:22organization which we typically call is
5:24an intranet or couple of
5:27organizations across which you say are
5:29extranet or it could even be a set of
5:32systems which are connected through the
5:35internet protocol within your lab or it
5:38could even be a
5:40single computer in which all these
5:43layers are integrated together but by
5:46internet we mean this is a internet
5:48protocol and technologies will be used
5:50for doing this interaction
5:53so web interface has become the de facto
5:56standard which gives a very distributed
5:59access to the database enables large
6:01number of users to access together and
6:05it avoids the requirement of downloading
6:08or installing specialized code into that
6:11all that we need is just a web browser
6:14and
6:15we have
6:16seen we are living through a variety of
6:19applications which are of this kind
6:22the banking applications the airline and
6:24railway reservations car rental hotel
6:26booking our web mail systems we
6:31check
6:32mail in gmail or yahoo those are all
6:36different web interfaces through which
6:38we actually access a the required set of
6:41databases
6:43and every even even every ah enterprise
6:47operations the erp
6:50are now web based and that is become the
6:52de facto standard
6:54so in the web interface ah along with
6:57the web interface which has been
6:59emerging of let of the last about 10
7:02years are mobile interfaces that we are
7:05getting used to using such applications
7:08from our mobile phone or tablet
7:10and these are similar in architecture
7:13and workflow as of the web application
7:16but there are significant differences
7:18too and at a later point
7:20in the next module we will discuss about
7:23the specific requirements of mobile apps
7:25in this context as well
7:28so before we move forward in terms of
7:30the details of how to build these
7:33applications we need to familiarize
7:35ourselves with the ah basic notions of
7:38the
7:38web as such so we call them as web
7:41fundamentals
7:43so web is a distributed information
7:44system which is based on hypertext hyper
7:47text is one where you have a part of the
7:50text available to you and then you have
7:52links we say are hyperlinks which can
7:55connect to the different documents
7:57contents which are located at other
8:00places at other servers
8:02and typically most web documents are
8:05hyper text documents which are formatted
8:08in terms of what we know as html hyper
8:11text markup language you will be
8:14familiar with that i am sure
8:16so they contain text and along with that
8:18they can have
8:20other
8:21components like images video the text
8:24has specifications for font color style
8:27all that and in addition there are forms
8:29which can be used to enter data
8:32and send them back to the web server
8:36now naturally when we operate on the web
8:39we need to ah
8:41have the functionality of pointing to
8:44different resources and this is done by
8:46what is known as url or uniform resource
8:49locator so that is a url is a procedure
8:52through which you can identify and point
8:55to a certain
8:56ah specific location of content so here
8:59i am showing an example of
9:02such a url all of you would be familiar
9:04with urls but just to look into the
9:06different components the first component
9:08http colon
9:10this http is actually a
9:13ah tells us the way the content would be
9:16accessed and this is typically called a
9:18protocol http stands for hyper text
9:22transfer protocol which allows you
9:24different text to be accessed
9:26the second component
9:28in this url which is between the two
9:30forward slash and the next slash
9:33www.acm.word.js
9:36identifies uniquely identifies a machine
9:39on the internet ah you will understand
9:42this is a symbolic name and the actual
9:44machine has what is known as an ip
9:46address
9:47and we will not go into those details
9:50but for us it is enough to understand
9:52that
9:54www.acm.org here is uniquely
9:59relatable to a particular machine on the
10:02internet and the last part which is
10:04remaining sigmoid and if there are more
10:07and more and more parts then it
10:09identifies the document inside within
10:11that machine
10:13so url can be used in
10:16multiple other ways also for example i
10:19can use a url locator to specify a file
10:22in my machine for example i have shown
10:25an example of an avi file in my ah c
10:28drive
10:29in windows and that is done through a
10:32similar url where the protocol is not
10:34http the protocol is file telling me
10:37that it is actually residing in my local
10:40machine so i have shown two ways to
10:43ah to look at that and you will see that
10:47between the two forms if you look at the
10:49second form you can easily
10:51understand that the machine to be
10:54identified is called the local host
10:57and in the first form that part is
11:00missing because it is by default the
11:03machine where i am running this code and
11:05rest of it is same which is basically
11:07the i identifying the document to be ah
11:12to be located in that machine similar ah
11:15this such url can also in the last
11:18example you can see that
11:20www.google.com is the
11:23basic machine where i am putting the
11:27url
11:28and then the rest of it is search so
11:31which actually takes it to a document
11:33where where i tell
11:35the search to be performed and then
11:36there are parameters to this
11:38form
11:39the parameter is q is equal to salvage
11:42search which is equivalent to
11:44saying that i am asking google.com to
11:47search for contents which have silvered
11:49such in it
11:50so this is a basic purpose of the
11:53uniform resource locator or url
11:56incidentally you may have heard the
11:58names like uri
12:00and urn in addition to url
12:03so they are related but they mean little
12:06bit different things as this venn
12:08diagram shows so a uri can be either a
12:12url or a urn or it could be both so urn
12:17functions like a person's name so you
12:19can consider it that way universal
12:22resource name and url resembles that of
12:25a
12:26person's street address so url says what
12:28is the name of the content and url says
12:31where that can be found and
12:34uri in general could be either the name
12:36or the address or both of them
12:39ah you we in this context of our
12:42discussion we will continue to use the
12:44term url only but i just wanted you to
12:47be aware of the other two terms in case
12:50you come across them in the text
12:54so
12:55we know by now that http
12:57html provides the formatting the
12:59hypertext links images and so on and
13:02http provides the protocol through which
13:05the contents are exchanged between
13:08ah different machines in the internet
13:11so you can select from a set of options
13:15in terms of html
13:18pop-up menus radio buttons ah check
13:20boxes and so on you can enter values
13:23through text box and once a form has
13:25been filled up that form will be sent
13:28back to the server from where it came
13:31and will be acted upon by the server
13:36http helps in that transfer mechanism
13:39so here is a sample html code let me ah
13:43show you the effect of this in the next
13:45slide so if you
13:47look in here then you can see that
13:50these are this is what
13:52is known as a tag
13:54and it kind of the tags are kind of
13:57given in the form of parenthesis
13:59notation so it has a has a opening and a
14:02closing and these have to have to
14:05actually match and you can see that the
14:08ah
14:09opening is written within the corner
14:11brackets and the closing you cite the
14:13same tag name
14:14but you put a forward slash before the
14:16name
14:18and then
14:19between the closing
14:22opening and the closing you can write
14:23more
14:24tabs in a nested manner so here it says
14:27that i have html which has a body
14:30and that body spans ah this much
14:33and then we are saying that there is a
14:35table so this is the table that you can
14:37get to see
14:38and
14:39then it also says that there is a form
14:42and this is a form that you get to see
14:45within the table you can see so it is
14:48saying that
14:49this is an id
14:51there is a name so it is describing the
14:53first row the department so you can see
14:56each one of them the the id is here
15:00the name is here
15:01the department is here
15:03similarly this is a next row where it is
15:06saying it is 0 1 0 0 1 to 8 zhang
15:10computer science so this is how you can
15:12you actually in an html in a text form
15:15all these details will be given and when
15:18it is
15:19ah rendered by the web browser then you
15:22will see a table like this
15:24similarly here we are
15:26i am showing a an instance of a form
15:29which is used to input data so we are
15:33saying that here is a is a drop down and
15:36its written out here in terms of options
15:39so the first option student is is
15:41visible here if you drop down you will
15:44actually see another option instructor
15:46here you will not see that because it is
15:48a frozen image
15:49so and then
15:51i i have a qualifier name and there is a
15:54input text box where you can input any
15:59string up to size 20 and once this has
16:02been done then you have a
16:05input which is submit which is the
16:07submit button here which shows that you
16:10can now submit and then this form filled
16:12up form will be sent back to the web
16:15browser from where it originally came
16:17so this is the basic
16:19mechanism of html ah you can
16:23learn little bit more about that and get
16:26familiar with it
16:27so a document name in a url may identify
16:31a a program that is written that
16:34generates so html could be either
16:36at the url in the web server you can
16:38either have html which we say is a
16:40static html
16:42or
16:43you could actually have a program which
16:46when you send the request it actually
16:49for example when you are doing google
16:51you said
16:52www.google.com
16:55search question mark q
16:58is has a value silver search then
17:00actually at that location there is no
17:04html currently existing which contains
17:07the search result but instead there is a
17:11program
17:12which will be executed based on the
17:15submission of this form and when run
17:17that will generate a html document
17:20and once that is generated then this
17:23will be
17:24passed back to the ah to your web
17:27browser so that is the basic mechanism
17:29so
17:30if you want a new service on the web
17:32then all that you simply need to do is
17:34to create and install a new program that
17:38will provide that service and through
17:39this process will see how easily this
17:42can be done
17:43and how web browser provides a graphical
17:45interface to this information service
17:48there is
17:49there has been another other other
17:51mechanisms of doing similar things also
17:54which was particularly popular earlier
17:56called the common
17:57gateway interface or cgi but now we have
18:00various other ways of doing the same
18:02thing
18:04so in this context then the basic three
18:08layers that we started discussing with
18:10are here so this is the most common way
18:13an application is
18:14so this is where your
18:16your
18:17front end is where you have the browser
18:19where you see that this is the network
18:21we are just in general writing network
18:23it could be internet it could be
18:24internet
18:26and a web server so when you send a
18:28request it is received by the web server
18:31web server somehow
18:33computes a result html and that sent
18:36back to the browser and that is how the
18:38interaction keeps on happening
18:40so the browser
18:41and the web server together often would
18:44be referred to as a front end because
18:46that gives a presentation that presents
18:49the results the interaction to you
18:52the next is the application layer which
18:54is the business logic where you write
18:56and then you have the data access layer
18:58or the database server and these are the
19:00actual disks where the data exist so
19:02this is a tier one this is tier two and
19:05this is tier three which is a very
19:07typical ah way a web
19:11application will be architected and
19:14these are the three layers or three
19:16tiers that we will usually find
19:19so
19:21often
19:22actually 3 is not a very magical number
19:25in terms of tiers it is possible that
19:27you could have
19:28more some applications have more tiers
19:31and some applications may choose to have
19:34multiple functionality in the same layer
19:36for example web server and application
19:38server functionality could be clubbed
19:39together and when this is done we say
19:42that we then have only two layers so the
19:44front end and the middle layer are
19:46merged together and the back end or the
19:48database server becomes a second layer
19:51so we would often might want to do that
19:54the reason we do that
19:56and i will just take you back to the ah
19:58three layer view so if ah
20:01the question is naturally if we have
20:04the web server and we have this
20:05connection this is clear now the
20:07question is what is this connection and
20:09what is this connection
20:11is it necessary that they will have to
20:13be on the same server physically
20:16or will they be on can be on different
20:18server and servers could be connected
20:20through a lan
20:21or they themselves could be on
20:24different
20:25servers over the internet and may they
20:27may be connected to internet so all of
20:29these are possibilities
20:31and the way we connect is the way we
20:35will write the application will be will
20:38not depend on the way these servers are
20:40connected between each other we will
20:42often assume that as if they are
20:45connected over a net
20:47and write it in a way so that even when
20:49they may be connected over a land or
20:52even when they may actually be on the
20:54same machine things will work in the
20:56same way
20:58now one point that
21:00should be born in mind in terms of the
21:02http protocol is it is connectionless so
21:05this is a very very critical concept and
21:08it means that once i start the process i
21:13have an url i
21:14submit that and that goes to the server
21:16the server runs an application or it is
21:19a static page server picks up and
21:21returns me that html
21:22the http loop is closed so that is all
21:26that happens and when i submit again
21:29something based on that so i have gone
21:32to gmailmail.google.com
21:34i submit that and i get back a
21:38form
21:39ah which tells me to put my user id and
21:42login i do that i submit and that when
21:45that goes then there is no memory about
21:48the earlier
21:50interaction that has happened
21:51so when my login submission goes it is
21:54authenticated in the back end i am able
21:57to login and i am given back
22:00the first screen of my mailbox which is
22:03the inbox screen and as soon as i get
22:06that inbox
22:08the html containing the inbox on my
22:11browser that transaction has also been
22:13over
22:15so if i now want to look at a specific
22:17mail it has to be a new query and it
22:20does not remember anything from the
22:21previous query
22:23so this connectionless property
22:25naturally makes it
22:27make certain things more difficult you
22:30will you will
22:32realize that many of the other
22:34connections that we do for example if we
22:36login to unix
22:38system or to a windows system if we use
22:40some database connections they are
22:43connected till the cl we disconnect them
22:46but in http it is not so it is
22:48connectionless every time you do you you
22:50have a separate
22:52session
22:53so naturally the question ah this was i
22:56mean there are there are reasons of why
22:58it is done this way it is to reduce load
23:00on the server and so on but naturally
23:02the consequences therefore we cannot
23:05remember information from one request
23:07response
23:09loop to the next so
23:12if i have logged in to my mail
23:14gmail account and i have seen the i have
23:17got the inbox
23:18then when i want to check my first mail
23:21the system does not
23:22know anymore that i am logged in because
23:25that session risk based response has is
23:27over and now i am making a new request
23:29that show me the first mail and i expect
23:32to see the whole body
23:33so there is no information that is
23:35carried from one request to the other
23:37which makes
23:39http difficult to work with so the
23:42solution for that is something which is
23:45known as a cookie
23:47so a cookie is a small piece of text
23:49which contain information ah which is
23:53identifying and which can go back and
23:56forth between the browser and the server
23:59so
24:00first it is sent by the server to the
24:02browser and the what the browser does so
24:04this happens the first time so when we
24:06have logged in my browser has got it got
24:08some cooking from the
24:10mail
24:11gmail server
24:13then
24:14the browser can send it back to the
24:16server when it is doing the next
24:19request so that i can be identified as
24:22the logged in person
24:24and so the browser can keep it
24:27as a i mean locally in in its memory or
24:30locally here and thats a part of the
24:33http protocol so this keeps on this
24:36cookie keeps on going back and forth
24:38back and forth so every time i send a
24:40request the cookie actually has to go to
24:42tell the server that yes this is part of
24:45pratim dash who is already logged in and
24:48authenticated himself for checking his
24:50mails
24:51so cookies are a big convenience and
24:55they are a very important factor of the
24:57web application so they can be stored
25:00permanently or for a limited period of
25:03time
25:05ah next
25:07let us look into some of the core
25:09technologies that are involved the first
25:12technology is
25:13is called a servlet servlet is nothing
25:15but as you can understand from the name
25:17itself is as we have book booklet
25:19booklet is a small very small book
25:21servlet is a very small server so it is
25:23a java application which can do certain
25:25tasks so it is a kind of an application
25:27program
25:28and ah every time we request then the
25:31server actually spawns a new thread
25:34and
25:35in that thread this
25:37servlet would be running and once the
25:40request is serviced the thread will be
25:42closed so this is a typical ah
25:44server servlet view so which shows that
25:48in the servlet you are creating actually
25:50creating the requested i mean possible
25:53html response that you would like to
25:54have so there are ah so there are
25:58different details you can read through
26:00that so this is a typical servlet code
26:02so it actually is a is a java code which
26:05it through print line will generate
26:08different lines of the html
26:11now naturally sublets maintain sessions
26:14the way we talked about
26:17so that through an interaction i can
26:19continue to be identified and the
26:22servlet can check whether the session is
26:24on or the session is already over
26:28so these are these are the different
26:30ways of doing that in terms of checking
26:32the user id and several web servers
26:36application servers have support for
26:38servlet apache tomcat is one of the very
26:41popular ones which you must have heard
26:43the name of
26:44and there but there are several other
26:46servers as well
26:49now
26:50along with the servlet there is another
26:52concept which is called server side
26:54scripting
26:55surface scripting is a is a mechanism
26:58where you define an html document and
27:02within that
27:03html document
27:05ah can be used so you may have some
27:08inputs to that and they can be used to
27:12directly fire embedded sql queries so we
27:15talked about embedding of sql query in
27:18while we discussed about the basic
27:20mechanism of host language and query
27:23language so here the html kind of a
27:26language is a host and you can embed the
27:29query right in a as a part of that
27:33and so that query goes to the database
27:36query server and you get the answer and
27:38that answer is
27:40placed where your original query was
27:44there so that you continue to get very
27:47easily a complete html as a response
27:50so this kind of a mechanism it makes it
27:53very easy because it is quite easy to ah
27:56conceive of the html and fill in so if i
28:00have asked for say
28:02logged in to the my mail
28:05gmail service then i have given the
28:07input as my username password and when
28:09that got gets authenticated then i get a
28:12response which is
28:14select
28:16mail from different respective tables
28:19where my authentication is there the
28:22user name is ppd and so on
28:24so it becomes quite easy to
28:27actually create the html and there are
28:30several such scripting languages jsp and
28:32php are the most popular ones
28:36so this is how a a typical
28:39jsp will look like so you can see that
28:41this actually looks like html but inside
28:44that you have a you have some part of a
28:46java code so what will happen the body
28:48will get replaced
28:50when the ah
28:52when the
28:53response has come for example here the
28:55response is ah doing a hello world so
28:58when this is executed then whatever is
29:01the result will replace the body in the
29:03html here and the resultant html will
29:05get generated
29:11there is another mechanism of scripting
29:14which is also very popular called php
29:17so this is how it is done
29:19similarly you could have
29:21scripts at the client side also for
29:23example if you are entering data for say
29:26a month
29:27and in numeric and you happen to enter
29:3014 then in most cases the page will
29:34immediately give you an error saying
29:36that 14 cannot be a valid month so there
29:38is a validation involved so in the
29:41client side in the browser there are
29:43some small scripts that can run is most
29:45typically it is a javascript which can
29:48do different authentication which is
29:50possible without actually accessing the
29:53data in the database you cannot for
29:54example validate a mail data based on
29:57the client side scripting sitting on the
29:59browser but you can
30:02validate small things like
30:04valid data forms range of data and so on
30:07and it is it is very important because
30:09if you could not do that then all you
30:11have required is you would have sent
30:13that faulty month numbered 14 to the to
30:17this back end server and got an error
30:19and you would have come back and then
30:21had to correct it but you can do this
30:23locally at the browser itself
30:26so client side scripting has a lot of
30:28value but you will have to have to
30:29remember that if you are doing client
30:32side scripting then there are security
30:34issues because
30:36it is
30:37quite possible that if we are doing
30:40things on the client side that is on the
30:42browser then we might also inadvertently
30:45or by a malicious intent actually make
30:48damages to the machine on which the
30:50browser is running so there are
30:52different kinds of care that is to be
30:53taken for example java applet which is
30:56another way of doing
30:58client side computation disallows file
31:01rights and so on
31:03and javascript as i have said is widely
31:06used and it can function to check for
31:08input validity which i gave an example
31:10of it can modify the displayed web page
31:13it can communicate with the web server
31:14to fetch data and so on and its you
31:17should familiarize yourself with
31:18javascript more it is a very powerful
31:20mechanism to ah do compute the simple
31:24things at the client side this is an
31:25example that i have given so you can
31:27read through and you will be able to if
31:29you know java you will be able to
31:30understand javascript very easily you
31:33could get through that
31:34and ah
31:36so there are multiple options of doing
31:38such things but ah
31:40jsp has a has a unique position because
31:43it is very useful in many context so i
31:46say the jsp has certain usb like
31:50active server page which is used in
31:53terms of the microsoft platform
31:55ah is also another mechanism of doing
31:59server side scripting but jsp is better
32:01because it is portable
32:03in with respect to pure servlets which
32:06we showed you in the beginning jsp
32:08performs
32:09is easier to use because jsp
32:12has the structure of the html page
32:14whereas in a pure servlet you will have
32:15to use print line to print every tag of
32:19the html which is cumbersome
32:21jsp
32:22in contrast to javascript
32:24is certainly a different thing because
32:26javascript runs on the browser on the
32:28client side jsp runs on the server side
32:31and certainly jsp is
32:33compared to static html is more powerful
32:36because it can handle dynamic
32:38information
32:39so
32:40in this ah that brings us to the end of
32:42this current module so what we have done
32:45we have understood the basic
32:46requirements of database application
32:48programs and user interfaces understood
32:51the basic terminology of the web and
32:54took a look into the core notion core
32:57technologies of
32:59application development which is in
33:01terms of the servlets and java server
33:04pages

About this transcript

This page contains the full transcript of Application Design and Development/1 by Data Base Management System - IITKGP, generated from the public captions YouTube serves with the video. The transcript has 5,004 words across 819 segments, with the original timestamps preserved so you can click any line to jump to that moment in the embedded player.

What you can do with it

Use the transcript to take notes, quote the speaker, build a study guide, generate a summary with ChatGPT or Claude via the YouTube Summary tool, or export it as a timed subtitle file with YouTube to SRT. You can also re-open it in the transcriber to translate the transcript into 100+ languages.

Free YouTube transcript tool

YouTube2Text is a free YouTube transcript generator — no signup, no daily limit. Paste any YouTube link and get the full transcript instantly, with timestamps, click-to-jump, translation to 100+ languages, AI prompts for ChatGPT, Claude, and Gemini, and exports to TXT, SRT, VTT, or Markdown.