unit-1.pdf

School of Science & Technology M.Sc.IT Cloud & Application Development (5 years integrated) Subject Name: Web Technology Unit 1: Introduction of Web  COURSE NAME: WEB TECHNOLOGY-I COURSE CODE: BSCCAD05...

School of Science & Technology M.Sc.IT Cloud & Application Development (5 years integrated) Subject Name: Web Technology Unit 1: Introduction of Web  COURSE NAME: WEB TECHNOLOGY-I COURSE CODE: BSCCAD05 BLOCK : 01 WHAT IS WEB, WHAT IS WWW, WEB PAGE, WEB SITE - STATIC AND DYNAMIC WEBSITE, WEB APPLICATION - CLIENT-SERVER, WEB DEVELOPMENT TECHNOLOGIES- HTML, CSS, JS, XML, SERVLET & JSP, PHP AND AJAX, DATABASE, FRONT END, BACK END. INTRODUCTION OF WEB A COMPLEX SYSTEM OF INTERCONNECTED ELEMENTS OR USER. THE COMMON NAME OF WEB IS WWW (WORLD WIDE WEB). THIS IS HELPFUL TO ACCESS AND INTERACT WITH INFORMATION AND SERVICES OVER THE INTERNET.  HISTORY OF WWW WWW STANDS FOR WORLD WIDE WEB. THIS IS THE REFERENCE OF ‘THE WEB’ AND SYSTEM OF INTERLINKED HYPERTEXT DOCUMENT AND MULTIMEDIA CONTENT THAT CAN BE ACCESSED VIA THE INTERNET. IT WAS DEVELOPED BY SIR TIM BERNERS-LEE IN 1989. COMPONENTS OF WWW - WEB PAGES: WEB PAGE IS NOTHING BUT THE HYPERTEXT DOCUMENT ON THE WORLD WIDE WEB - WEB BROWSERS: THIS IS AN APPLICATION SOFTWARE THAT ACCEPT REQUEST AND PROVIDE INFORMATION ON WWW. LIKE CHROME, MOZILLA FIREFOX, OPERA ETC. - WEB SERVERS: THIS IS A SOFTWARE AND HARDWARE SYSTEM THAT DELIVERS. IT IS HELPFUL TO DELIVER WEB CONTENT AND SERVICES TO USERS OVER THE INTERNET - HTTP/HTTPS: HTTP (HYPERTEXT TRANSFER PROTOCOL) AND HTTPS (HTTP SECURE) THIS IS A COMMUNICATION METHOD BETWEEN BROWSER AND THE SITE WE VISIT (WEB SERVER) WORKING OF WWW STEP 1: ENTER URL’S AT WEB BROWSER. User Request STEP 2: THE BOWSER SENDS AN HTTP REQUEST TO WEB SERVER. STEP3: THE WEB SERVER PROCESSES THE REQUEST AND SENDS BACK THE REQUESTED WWW WEB PAGE OR RESOURCE Response www STEP 4: THE BROWSER RENDERS THE HTML, CSS, AND JAVASCRIPT TO DISPLAY THE WEB PAGE TO THE USER Server WHAT IS WEB PAGE? THIS IS A DOCUMENT THAT IS ACCESSIBLE WITH THE HELP OF WORLD WIDE WEB (WWW). USER CAN VIEW THE WEB PAGE BY WEB BROWSER. THESE ARE THE BUILDING BLOCKS OR PAGES OF WEBSITE AND EACH PAGE IS IDENTIFIED BY A UNIQUE URL (UNIFORM RESOURCE LOCATOR). COMPONENTS: - HTML STRUCTURE: - CSS STYLING - JAVASCRIPT INTERACTIVITY - MULTIMEDIA CONTENT (VIDEO, AUDIO, IMAGE) - HYPERLINKS WHAT IS WEB SITE? THIS IS THE COLLECTION OF WEB PAGES AND OTHER DIGITAL ASSETS THAT ARE HOSTED ON WEN SERVER. WEBSITES SERVE A WIDE RANGE OF PURPOSES, INCLUDING SHARING INFORMATION, PROMOTING PRODUCTS OR SERVICES, PROVIDING ENTERTAINMENT, AND FACILITATING COMMUNICATION. TYPES OF WEB SITES: STATIC WEBSITE: A STATIC WEBSITE IS A TYPE OF WEBSITE THAT CONTAIN WEB PAGES WITH FIXED CONTENT THAT REMAINS THE SAME EACH TIME IT IS VIEWED. THE CONTENT OF A STATIC WEBSITE IS TYPICALLY WRITTEN IN HTML (HYPERTEXT MARKUP LANGUAGE), CSS (CASCADING STYLE SHEETS) FOR STYLE AND JS (JAVASCRIPT) FOR INTERACTIVITY. DYNAMIC WEBSITE: A DYNAMIC WEBSITE IS A TYPE OF WEBSITE THAT GENERATE CONTENT IN REAL-TIME OFTEN BASED ON USER INTERACTION, PREFERENCE, OR DATA FROM A DATABASE. DYNAMIC WEBSITES CAN PROVIDE PERSONALIZED AND INTERACTIVE EXPERIENCE BY USING SERVER-SIDE SCRIPTING LANGUAGE AND CLIENT-SIDE TECHNOLOGY. WHAT IS WEB APPLICATION? WEB APPLICATION IS A SOFTWARE APPLICATION THAT RUNS ON WEB SERVER AND ACCESSIBLE BY WEB BROWSER OVER THE INTERNET. USER DOESN’T NEED TO INSTALLED ON THE USER DEVICE LIKE MOBILE OR DESKTOP APPLICATION. WE CAN USE IT BY ANY DEVICE WITH AN INTERNET CONNECTION AND A COMPATIBLE WEB BROWSER. EMAIL SERVICES SOCIAL MEDIA PLATFORMS ONLINE BANKING WEB APPLICATION TECHNOLOGY 1. FRONTEND TECHNOLOGY 1. HTML 2. CSS 3. JS 2. FRONTEND FRAMEWORKS OR LIBRARIES a. REACT b. ANGULAR 3. BACKEND TECHNOLOGIES a. SERVER-SIDE LANGUAGES (PYTHON, RUBY, PHP, JAVA, NODE.JS) b. DATABASES (MYSQL, POSTGRESQL, MONGODB, SQLITE) 4. BACKEND FRAMEWORKS a. DJANGO (PYTHON) b. RUBY ON RAILS (RUBY) c. SPRING (JAVA) d. EXPRESS (NODE.JS) 5. API’S: WEB APPLICATIONS OFTEN USE APIS (APPLICATION PROGRAMMING INTERFACES) TO COMMUNICATE WITH OTHER SERVICES AND INTEGRATE EXTERNAL DATA. CLIENT-SERVER CLIENT-SERVER MODEL IS A NETWORK ARCHITECTURE THAT DIVIDE TASKS BETWEEN SERVICE PROVIDERS (SERVERS) AND SERVICE PROVIDERS THAT IS SERVER AND SERVICE REQUESTERS (CLIENTS). THIS IS A STRUCTURED WAY TO HANDLE REQUEST AND RESPONSE.  CLIENT: A CLIENT IS A DEVICE APPLICATION OR USER THAT REQUESTS FOR SERVICES FROM SERVER.  SERVER: A SERVER IS A POWERFUL COMPUTER OR APPLICATION THAT PROVIDES SERVICES, RESOURCES OR DATA TO CLIENT. HOW THE CLIENT-SERVER MODEL WORKS: - CLIENT REQUEST - SERVER PROCESSING - SERVER RESPONSE - CLIENT RENDERING CLIENT-SERVER APPLICATION  TWO TIER ARCHITECTURE: CLIENT COMMUNICATE DIRECTLY WITH THE SERVER.  THREE TIER ARCHITECTURE: ADDS A MIDDLE LAYER (APPLICATION SERVER) BETWEEN CLIENT AND THE DATABASE SERVER.  N-TIER ARCHITECTURE: ADDS MORE THAN ONE LAYER BETWEEN CLIENT AND SERVER. WEB DEVELOPMENT WEB DEVELOPMENT IS THE PROCESS TO CREATE BUILD AND MAINTAIN OF WEBSITE. IT INCLUDES ASPECTS LIKE WEB DESIGN, WEB PUBLISH, WEB PROGRAMMING AND DATABASE MANAGEMENT. WE CAN CLASSIFIED WEB DEVELOPMENT INTO TWO PART: FRONTEND DEVELOPMENT: THE PART OF WEBSITE ,THE USER INTERACTS DIRECTLY IS CALLED FRONTEND. WITH THE HELP OF SOME TECHNOLOGY DEVELOPER DEVELOP FRONTEND. BACKEND DEVELOPMENT : BACKEND IS THE SERVER SIDE OF A WEBSITE. IT IS PART OF THE WEBSITE THAT USERS CANNOT SEE AND INTERACT WITH. IT IS THE PORTION OF SOFTWARE THAT DOES NOT COME IN DIRECT CONTACT WITH THE USERS. WEB DEVELOPMENT TECHNOLOGY HTML : (HYPERTEXT MARKUP LANGUAGE). IT IS THE STANDARD MARKUP DESCRIBES THE STRUCTURE OF A WEB PAGE. CSS : LANGUAGE CSS STANDS FOR CASCADING STYLE SHEET ,IT DESCRIBES HOW HTML ELEMENTS ARE TO BE DISPLAYED ON SCREEN. JS: JAVASCRIPT IS A SCRIPTING OR PROGRAMMING LANGUAGE T HAT ALLOWS YOU TO IMPLEMENT COMPLEX FEATURES ON WEB PAGES XML: XMT STANDS FOR EXTENSIBLE MARKUP LANGUAGE.XML IS A SELF-DESCRIBING LANGUAGE THAT STORES AND TRANSPORTS DATA. SERVLET: A SERVLET IS A JAVA CLASS THAT EXTENDS THE CAPABILITIES OF SERVERS THAT HOST REQUEST- RESPONSE APPLICATIONS. JSP: JSP STANDS FOR JAVA SERVER PAGES. IT IS A TECHNOLOGY TO CREATE DYNAMIC WEB PAGES USING HTML, XML, AND JAVA CODE PHP: PHP IS A SERVER-SIDE AND GENERAL-PURPOSE SCRIPTING LANGUAGE FOR WEB DEVELOPMENT. IT IS USED TO CREATE DYNAMIC PAGE. AJAX: AJAX IS A WEB DEVELOPMENT TECHNIQUE THAT ALLOWS WEB PAGES TO COMMUNICATE WITH A WEB SERVER ASYNCHRONOUSLY, WITHOUT REFRESHING THE WHOLE PAGE. DATABASE: A DATABASE IS AN ORGANIZED COLLECTION OF DATA STORED IN A COMPUTER SYSTEM AND USUALLY CONTROLLED BY A DATABASE MANAGEMENT SYSTEM