Web Engineering
•Download as PPTX, PDF•
0 likes•94 views
Web engineering focuses on the methodologies, techniques, and tools that are the foundation of Web application development and which support their design, development, evolution, and evaluation.
Recommended
More Related Content
What's hot
What's hot (20)
Similar to Web Engineering
Similar to Web Engineering (20)
More from Al Mamun
Recently uploaded
Recently uploaded (20)
Web Engineering
- 1. Web Engineering By Al Mamun Khan
- 2. Contents WWW, Web browser & Websites Web Languages & Categories Front-end Languages Html CSS JS Responsive Design Frameworks Back-end Languages PHP MySQL
- 3. WWW, Web browser & Websites WWW Also Called World Wide Web or W3 Locator of Websites All the computer in the web can communicate with each other. Invented 1990 Web browser Is a computer program that’s displays web pages and sites Default browser : IE Or Edge for Windows, Safari for Mac Web Sites Locate Webpages Need Web hosting
- 4. Web Languages Front-end Languages Back-end Languages HTML CSS JavaScript PHP MySQL Types of Web Languages
- 5. Front-end Language HTML Hypertext markup language Base languages of web Write Between <html></html> Tag of HTML Two Types of Tag o Opening and Closing : • Html Tag - <html></html> • Body Tag - <body></body> • Heading Tag <h></h> • Paragraph Tag <p></p> o Only Opening : • Break Tag <br> • Image Tag- <img> • Input Tag <input> • Horizontal Tag<hr>
- 6. Front-end Language CSS Cascading stylesheet Makeup / Beautifier of html Write Between <Style></Style> With CSSWith Out CSS
- 7. Front-end Language JavaScript Scripting Language Programming Language A Client-side Language Write Between <Script></Script>
- 8. Responsive Design Every Device Supported Creating a catalog of multi device layout patterns. Desktop, Laptop, Smartphone Supported Large , medium or small, every scene supported Write Using CSS media query Responsive Websites Offers Smooth Navigation Easy Reading Reduce Scrolling and Zoom Excellent User Experience Front-end Language
- 9. Responsive Design Layout Device Size Phones 480px and below Phones to Tablets 767px and below Portrait Tablets 768px and above Netbook 990px to 1024px Monitor 1024px and above Front-end Language
- 10. Example: @media screen{ body {width 75%;}} @media print{ body {width 100%;}} @media screen and {min-height:768 and max-height 900px} { .container{padding:20px;}} Advantage to users: Flexible to use Automatically Scuffles Content, resizes Adjust font-size Save time when browsing sites Helps to load fast Increasing user experience Responsive Design
- 11. Framework: Write less do more Everything's is ready for use Store of library function Less work and flexibility Do not write same code again & again Responsive Design
- 12. o Responsive Framework (Front-end) Bootstrap Uikit Less responsive Semantic Foundation oJS Framework Angular JS React JS Node JS (Back-end) Framework
- 14. Back-end Language PHP Server sites Language Programming Language Run only on server Write inside <?php ?> MySQL Standard Query Language Work only on database Write with PHP
- 15. Thanks All