SlideShare a Scribd company logo
Presentation #1
Basics - Overview
Topics
•
•
•
•
•
•

HTML vs CSS
DOM trees
JavaScript
PHP
Frameworks
Templates
HTML vs CSS
HTML
• Content, content, content!
• Tags, elements that form a
DOM (Document Object
Model) tree

CSS
• Presentation of a page
• Select elements and choose
how you want them to look
DOM trees
• The Document Object Model (DOM) is a cross-platform and languageindependent convention for representing and interacting with objects in
X|HTML.
JavaScript
• You add action to your page.
• It’s an OOP client side language.
•

 add a trim function to String
sssssssssssssssssssssssssss
class

•

 use it and add action to
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
your page!
Adding life to static pages
• You’ve been creating great web pages with HTML, and a bit of
CSS.

• But you’ve noticed that visitors to your site can’t do much
other than passively look at the content on the pages. The
communication’s one-way, and you’d like to change that!
• With pure HTML web pages,
the server simply serves up
static HTML that only displays
content
PHP – Brings pages to life!
• PHP allows you to manipulate web page content on the server
just before a page is delivered to the client browser.
1. A PHP script runs on the server
2. This script can alter or generate HTML code at will
3. HTML page is delivered to the browser which does not know
that PHP was involved
• With PHP in the mix, the web server is able to dynamically
generate HTML web pages on the fly.
PHP – All the action
PHP - continued
What the server ran

What the client received
Frameworks
• A software framework is an abstraction in which software
providing generic functionality can be selectively changed by
additional user-written code, thus providing applicationspecific software. A software framework is a universal,
reusable software platform to develop applications, products
and solutions.
• Software frameworks include support programs, compilers,
code libraries, tool sets, and application programming
interfaces (APIs) that bring together all the different
components to enable development of a project or solution.
Frameworks – Why use one?
• If you look at PHP Job listings, you will often see “MVC Framework
Experience” as one of their requirements. It is becoming one of
those must-have skill sets for web developers.
1.
2.
3.
4.
5.
6.
7.

Code and File Organization
Utilities and Libraries
The MVC Pattern
Security
Less Code & Faster Development
Community Support
Suitable for Teamwork
Frameworks – Code and File Organization
• When you setup a PHP Framework, it already has a certain
folder structure. It is expected from you to follow the same
standards and keep everything organized in a certain way.
• Once you get used to this model, you will never want to go
back!
Frameworks – Utilities and Libraries
• if you ever try to build a whole website with PHP alone, you will
find yourself either hunting down a lot of 3rd party code and
libraries, or have to write them yourself.
• All top PHP frameworks come with certain Libraries and Helpers,
that help you with:
1.
2.
3.
4.
5.

Form Validation
Input/Output filtering
Database Abstraction
Session/Cookie Handling
Email, Calendar, Pagination etc…
Frameworks - The MVC Pattern
PHP itself works like a template
engine. However, when used
irresponsibly, it leads to very ugly and
unmaintainable code.
The way the MVC Pattern applies to
PHP applications:
-

-

Models represent your data
structures, usually by interfacing
with the database.
Views contain page templates and
output.
Controllers handle page requests
and bind everything together.

This kind of separation leads to
cleaner and more maintainable
code.
Frameworks - Security
• In PHP you can already find many input and output filtering
functions to protect your website against certain attacks.
• However, manually using these functions can get tiring and
you may forget about them every once in a while.
• With a framework, most of the work can be done for you
automatically. For example in CodeIgniter:
1. Any value passed to database object gets filtered against
SQL injection attacks.
2. All html generating functions, such as form helpers and url
helpers filter the output automatically.
3. All user input can be filtered against XSS attacks.
4. Encrypting cookies automatically is only a matter of
changing a config option.
Frameworks – Less Code & Faster
Development
• There is of course a learning curve for all PHP
Frameworks. But once you get over this hump, you will
enjoy the benefits of rapid application development.
• You will write less code, which means less time spent
typing. You will not have to chase down 3rd party
libraries all the time for every new project because
most of them will come with the default framework
install.
• Also, since you are being more organized, it will be
much faster to chase down bugs, maintain code, and
make changes to existing code.
Frameworks – Community Support
• All popular PHP Frameworks have great active
communities behind them. You can talk to
other developers, get help, feedback and also
give back to the community yourself.
• There are message boards and mailing lists…
You can also learn a lot by just browsing the
forums and look at what other people are
talking about.
Frameworks - Suitable for Teamwork
• The way your project is organized in a PHP
Framework also helps you create a suitable
environment for teamwork.
• You can let your designers work on the Views,
database guru work on the Models, let the
smart programmer build reusable Libraries
and Plugins etc…
• Also you can have someone build unit tests,
because they come with tools for that too.
Frameworks – Which one?
1.
2.
3.
4.
5.
6.

Laravel
Phalcon
Symfony
CodeIgniter
CakePHP
Zend

• There are also JavaScript frameworks which you
normally put them together alongside your PHP
framework to be more productive!
Templates
• A template is a set of HTML as well as CSS files
that organize the look and feel of your page.
• They basically make up the Views you will use
in your framework.
• Thus, your only job is to use the MVC
framework to fill the appropriate content on
each of your pages.
Templates - Bracket
Templates - Simplicity
Templates
• And the list goes on and on…
• We will have to choose one of the ones
listed in the .doc file
The End
• Questions?

More Related Content

PPTX
Back to the Basics - 1 - Introduction to Web Development
Clint LaForest
 
PPTX
Php Indonesia x Bliblidotcom - Architecting Scalable CSS
Irfan Maulana
 
PDF
WordPress as a CMS - Case Study of an Organizational Intranet
Tech Liminal
 
PPTX
Web development using html and wordpress
Dakshata Gavand
 
PDF
Front-End Frameworks: a quick overview
Diacode
 
PDF
What is front-end development ?
Mahmoud Shaker
 
PPTX
WordPress Architecture For Beginners
Tortoise and Hare Software
 
PPTX
Gettings started with Web development
Ujjwal Ojha
 
Back to the Basics - 1 - Introduction to Web Development
Clint LaForest
 
Php Indonesia x Bliblidotcom - Architecting Scalable CSS
Irfan Maulana
 
WordPress as a CMS - Case Study of an Organizational Intranet
Tech Liminal
 
Web development using html and wordpress
Dakshata Gavand
 
Front-End Frameworks: a quick overview
Diacode
 
What is front-end development ?
Mahmoud Shaker
 
WordPress Architecture For Beginners
Tortoise and Hare Software
 
Gettings started with Web development
Ujjwal Ojha
 

What's hot (20)

PPT
Joomla! theming
Russell Searle
 
KEY
WordPress & Other Content Management Systems
Emily Lewis
 
PDF
Modern UI Architecture_ Trends and Technologies in Web Development
Suresh Patidar
 
PPTX
11 Live Node.js CMS Frameworks
iScripts
 
PPTX
Edy Dawson Notes on SF HTML5 Dev Conf
Edy Dawson
 
PPT
EPUB for Website Producers
waldoj
 
PPTX
Week01 jan19 introductionto_php
Jeanho Chu
 
PDF
CUST-3 Document Management with Share
Alfresco Software
 
PPT
Concrete5 workshop
Russell Searle
 
PPTX
concrete5 from developer perspective
mainio
 
PPT
Web 2.0
TSUBHASHRI
 
PPTX
Web dev#1
Richard Bao
 
PPTX
Week01 jan19
Jeanho Chu
 
PDF
Introduction to web development
Mohammed Safwat
 
ODP
Framework
Deepan Sivasankar
 
PPTX
WebNetConf 2012 - Single Page Apps
Pop Apps
 
PPTX
Advanced php code igniter framework
Fahim Faysal Kabir
 
PPTX
BackboneJS
Artemii Kravtsov
 
PPT
Php Frameworks
Ryan Davis
 
PPTX
Single page application and Framework
Chandrasekar G
 
Joomla! theming
Russell Searle
 
WordPress & Other Content Management Systems
Emily Lewis
 
Modern UI Architecture_ Trends and Technologies in Web Development
Suresh Patidar
 
11 Live Node.js CMS Frameworks
iScripts
 
Edy Dawson Notes on SF HTML5 Dev Conf
Edy Dawson
 
EPUB for Website Producers
waldoj
 
Week01 jan19 introductionto_php
Jeanho Chu
 
CUST-3 Document Management with Share
Alfresco Software
 
Concrete5 workshop
Russell Searle
 
concrete5 from developer perspective
mainio
 
Web 2.0
TSUBHASHRI
 
Web dev#1
Richard Bao
 
Week01 jan19
Jeanho Chu
 
Introduction to web development
Mohammed Safwat
 
WebNetConf 2012 - Single Page Apps
Pop Apps
 
Advanced php code igniter framework
Fahim Faysal Kabir
 
BackboneJS
Artemii Kravtsov
 
Php Frameworks
Ryan Davis
 
Single page application and Framework
Chandrasekar G
 
Ad

Viewers also liked (20)

PPTX
Avoiding conflict and litigation with hmrc
India inc
 
PDF
Consultation with Regional Rural and Isolated People 2014
Elizabeth Kerry
 
PPTX
Gta 5
Brandon Aaron
 
DOC
ΚΟΙΝΩΝΙΚΗ & ΠΟΛΙΤΙΚΗ ΑΓΩΓΗ Γ' ΓΥΜΝΑΣΙΟΥ ΑΠΟΛΥΤΗΡΙΕΣ ΕΞΕΤΑΣΕΙΣ 2015
Anastasia Petraki
 
PPT
Kbm 1 fiqh bab 12
putraisya
 
PPTX
Panel discussion-what are indian family offices doing globally? Managing Indi...
India inc
 
PDF
RTB для недвижимости и авто
Valentin El'tsov
 
PPTX
Wee cig presentation
dennislzf
 
PPT
Foreign exchange-management-act-1999
Abhishek Bharati
 
PDF
Hi-Lok Installation
Gary Tomkinson
 
PPTX
The Water Cycle
mailyn_14
 
PPTX
Recce
StaceyDube
 
DOC
ΙΣΤΟΡΙΑ Α' ΕΠΑΛ ΠΡΟΑΓΩΓΙΚΕΣ 2016
Anastasia Petraki
 
PDF
Results Rule: How to Sell Anything to Anyone in Oil & Gas - James Hahn [Energ...
Energy Digital Summit
 
PPTX
Types of drugs ict
NathanICT
 
PPT
Oprezni online josip šimun kuči, 4.c
Marijana Ivosevic
 
PPTX
Evan Shegog Slide Presentation Sigma Xi Research Showcase 2014
evanshegog
 
PDF
Measuring What Really Matters: Search Engine Metrics & Tracking Tips - David ...
Energy Digital Summit
 
DOCX
Kd3.2
Ratih Habibi
 
Avoiding conflict and litigation with hmrc
India inc
 
Consultation with Regional Rural and Isolated People 2014
Elizabeth Kerry
 
ΚΟΙΝΩΝΙΚΗ & ΠΟΛΙΤΙΚΗ ΑΓΩΓΗ Γ' ΓΥΜΝΑΣΙΟΥ ΑΠΟΛΥΤΗΡΙΕΣ ΕΞΕΤΑΣΕΙΣ 2015
Anastasia Petraki
 
Kbm 1 fiqh bab 12
putraisya
 
Panel discussion-what are indian family offices doing globally? Managing Indi...
India inc
 
RTB для недвижимости и авто
Valentin El'tsov
 
Wee cig presentation
dennislzf
 
Foreign exchange-management-act-1999
Abhishek Bharati
 
Hi-Lok Installation
Gary Tomkinson
 
The Water Cycle
mailyn_14
 
Recce
StaceyDube
 
ΙΣΤΟΡΙΑ Α' ΕΠΑΛ ΠΡΟΑΓΩΓΙΚΕΣ 2016
Anastasia Petraki
 
Results Rule: How to Sell Anything to Anyone in Oil & Gas - James Hahn [Energ...
Energy Digital Summit
 
Types of drugs ict
NathanICT
 
Oprezni online josip šimun kuči, 4.c
Marijana Ivosevic
 
Evan Shegog Slide Presentation Sigma Xi Research Showcase 2014
evanshegog
 
Measuring What Really Matters: Search Engine Metrics & Tracking Tips - David ...
Energy Digital Summit
 
Ad

Similar to Presentation 1 Web--dev (20)

PPTX
SPS Monaco 2017 - The Lay of the Land of Client-Side Development circa 2017
Marc D Anderson
 
PPTX
Frameworks Galore: A Pragmatic Review
netc2012
 
PPTX
MWLUG 2015 - An Introduction to MVC
Ulrich Krause
 
PPTX
An Introduction To Model  View  Controller In XPages
Ulrich Krause
 
PDF
PHP Frameworks Review - Mar 19 2015
kyphpug
 
PPTX
Ps02 cint24 mvc in php
Conestoga Collage
 
PPT
My cool new Slideshow!
netzwelt12345
 
PDF
Week01 jan19 introductionto_php
Jeanho Chu
 
PPTX
Entity Framework Core 1.0
Senthil Kumar
 
PDF
Which are the best PHP frameworks for web development that have a good future...
Moon Technolabs Pvt. Ltd.
 
PPTX
Seminar.pptx
Akshay Bhujbal
 
PDF
Prominent Back-end frameworks to consider in 2022!
Shelly Megan
 
PPTX
Learn from my Mistakes - Building Better Solutions in SPFx
Thomas Daly
 
PDF
Tutorial Módulo 1 de Introdução com Flask
Vinícius Marques
 
PDF
Drupal 7
Soni Amit K
 
PPT
1_Intro_toHTML.ppt
benjaminonum1
 
PPTX
What-is-Laravel and introduciton to Laravel
PraveenHegde20
 
DOCX
Codeigniter
Chirag Parmar
 
PPT
Tech talk php_cms
Shehrevar Davierwala
 
PPTX
After the LAMP, it's time to get MEAN
Jeff Fox
 
SPS Monaco 2017 - The Lay of the Land of Client-Side Development circa 2017
Marc D Anderson
 
Frameworks Galore: A Pragmatic Review
netc2012
 
MWLUG 2015 - An Introduction to MVC
Ulrich Krause
 
An Introduction To Model  View  Controller In XPages
Ulrich Krause
 
PHP Frameworks Review - Mar 19 2015
kyphpug
 
Ps02 cint24 mvc in php
Conestoga Collage
 
My cool new Slideshow!
netzwelt12345
 
Week01 jan19 introductionto_php
Jeanho Chu
 
Entity Framework Core 1.0
Senthil Kumar
 
Which are the best PHP frameworks for web development that have a good future...
Moon Technolabs Pvt. Ltd.
 
Seminar.pptx
Akshay Bhujbal
 
Prominent Back-end frameworks to consider in 2022!
Shelly Megan
 
Learn from my Mistakes - Building Better Solutions in SPFx
Thomas Daly
 
Tutorial Módulo 1 de Introdução com Flask
Vinícius Marques
 
Drupal 7
Soni Amit K
 
1_Intro_toHTML.ppt
benjaminonum1
 
What-is-Laravel and introduciton to Laravel
PraveenHegde20
 
Codeigniter
Chirag Parmar
 
Tech talk php_cms
Shehrevar Davierwala
 
After the LAMP, it's time to get MEAN
Jeff Fox
 

Recently uploaded (20)

PDF
Oracle AI Vector Search- Getting Started and what's new in 2025- AIOUG Yatra ...
Sandesh Rao
 
PDF
The Evolution of KM Roles (Presented at Knowledge Summit Dublin 2025)
Enterprise Knowledge
 
PDF
Automating ArcGIS Content Discovery with FME: A Real World Use Case
Safe Software
 
PPT
L2 Rules of Netiquette in Empowerment technology
Archibal2
 
PDF
Building High-Performance Oracle Teams: Strategic Staffing for Database Manag...
SMACT Works
 
PPTX
cloud computing vai.pptx for the project
vaibhavdobariyal79
 
PDF
Chapter 1 Introduction to CV and IP Lecture Note.pdf
Getnet Tigabie Askale -(GM)
 
PDF
Unlocking the Future- AI Agents Meet Oracle Database 23ai - AIOUG Yatra 2025.pdf
Sandesh Rao
 
PDF
A Day in the Life of Location Data - Turning Where into How.pdf
Precisely
 
PDF
CIFDAQ'S Market Insight: BTC to ETH money in motion
CIFDAQ
 
PPT
Coupa-Kickoff-Meeting-Template presentai
annapureddyn
 
PPTX
Comunidade Salesforce São Paulo - Desmistificando o Omnistudio (Vlocity)
Francisco Vieira Júnior
 
PDF
Why Your AI & Cybersecurity Hiring Still Misses the Mark in 2025
Virtual Employee Pvt. Ltd.
 
PDF
Security features in Dell, HP, and Lenovo PC systems: A research-based compar...
Principled Technologies
 
PPTX
AI and Robotics for Human Well-being.pptx
JAYMIN SUTHAR
 
PDF
Orbitly Pitch Deck|A Mission-Driven Platform for Side Project Collaboration (...
zz41354899
 
PDF
This slide provides an overview Technology
mineshkharadi333
 
PDF
Accelerating Oracle Database 23ai Troubleshooting with Oracle AHF Fleet Insig...
Sandesh Rao
 
PPTX
New ThousandEyes Product Innovations: Cisco Live June 2025
ThousandEyes
 
PDF
Presentation about Hardware and Software in Computer
snehamodhawadiya
 
Oracle AI Vector Search- Getting Started and what's new in 2025- AIOUG Yatra ...
Sandesh Rao
 
The Evolution of KM Roles (Presented at Knowledge Summit Dublin 2025)
Enterprise Knowledge
 
Automating ArcGIS Content Discovery with FME: A Real World Use Case
Safe Software
 
L2 Rules of Netiquette in Empowerment technology
Archibal2
 
Building High-Performance Oracle Teams: Strategic Staffing for Database Manag...
SMACT Works
 
cloud computing vai.pptx for the project
vaibhavdobariyal79
 
Chapter 1 Introduction to CV and IP Lecture Note.pdf
Getnet Tigabie Askale -(GM)
 
Unlocking the Future- AI Agents Meet Oracle Database 23ai - AIOUG Yatra 2025.pdf
Sandesh Rao
 
A Day in the Life of Location Data - Turning Where into How.pdf
Precisely
 
CIFDAQ'S Market Insight: BTC to ETH money in motion
CIFDAQ
 
Coupa-Kickoff-Meeting-Template presentai
annapureddyn
 
Comunidade Salesforce São Paulo - Desmistificando o Omnistudio (Vlocity)
Francisco Vieira Júnior
 
Why Your AI & Cybersecurity Hiring Still Misses the Mark in 2025
Virtual Employee Pvt. Ltd.
 
Security features in Dell, HP, and Lenovo PC systems: A research-based compar...
Principled Technologies
 
AI and Robotics for Human Well-being.pptx
JAYMIN SUTHAR
 
Orbitly Pitch Deck|A Mission-Driven Platform for Side Project Collaboration (...
zz41354899
 
This slide provides an overview Technology
mineshkharadi333
 
Accelerating Oracle Database 23ai Troubleshooting with Oracle AHF Fleet Insig...
Sandesh Rao
 
New ThousandEyes Product Innovations: Cisco Live June 2025
ThousandEyes
 
Presentation about Hardware and Software in Computer
snehamodhawadiya
 

Presentation 1 Web--dev

  • 2. Topics • • • • • • HTML vs CSS DOM trees JavaScript PHP Frameworks Templates
  • 3. HTML vs CSS HTML • Content, content, content! • Tags, elements that form a DOM (Document Object Model) tree CSS • Presentation of a page • Select elements and choose how you want them to look
  • 4. DOM trees • The Document Object Model (DOM) is a cross-platform and languageindependent convention for representing and interacting with objects in X|HTML.
  • 5. JavaScript • You add action to your page. • It’s an OOP client side language. •  add a trim function to String sssssssssssssssssssssssssss class •  use it and add action to aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa your page!
  • 6. Adding life to static pages • You’ve been creating great web pages with HTML, and a bit of CSS. • But you’ve noticed that visitors to your site can’t do much other than passively look at the content on the pages. The communication’s one-way, and you’d like to change that! • With pure HTML web pages, the server simply serves up static HTML that only displays content
  • 7. PHP – Brings pages to life! • PHP allows you to manipulate web page content on the server just before a page is delivered to the client browser. 1. A PHP script runs on the server 2. This script can alter or generate HTML code at will 3. HTML page is delivered to the browser which does not know that PHP was involved • With PHP in the mix, the web server is able to dynamically generate HTML web pages on the fly.
  • 8. PHP – All the action
  • 9. PHP - continued What the server ran What the client received
  • 10. Frameworks • A software framework is an abstraction in which software providing generic functionality can be selectively changed by additional user-written code, thus providing applicationspecific software. A software framework is a universal, reusable software platform to develop applications, products and solutions. • Software frameworks include support programs, compilers, code libraries, tool sets, and application programming interfaces (APIs) that bring together all the different components to enable development of a project or solution.
  • 11. Frameworks – Why use one? • If you look at PHP Job listings, you will often see “MVC Framework Experience” as one of their requirements. It is becoming one of those must-have skill sets for web developers. 1. 2. 3. 4. 5. 6. 7. Code and File Organization Utilities and Libraries The MVC Pattern Security Less Code & Faster Development Community Support Suitable for Teamwork
  • 12. Frameworks – Code and File Organization • When you setup a PHP Framework, it already has a certain folder structure. It is expected from you to follow the same standards and keep everything organized in a certain way. • Once you get used to this model, you will never want to go back!
  • 13. Frameworks – Utilities and Libraries • if you ever try to build a whole website with PHP alone, you will find yourself either hunting down a lot of 3rd party code and libraries, or have to write them yourself. • All top PHP frameworks come with certain Libraries and Helpers, that help you with: 1. 2. 3. 4. 5. Form Validation Input/Output filtering Database Abstraction Session/Cookie Handling Email, Calendar, Pagination etc…
  • 14. Frameworks - The MVC Pattern PHP itself works like a template engine. However, when used irresponsibly, it leads to very ugly and unmaintainable code. The way the MVC Pattern applies to PHP applications: - - Models represent your data structures, usually by interfacing with the database. Views contain page templates and output. Controllers handle page requests and bind everything together. This kind of separation leads to cleaner and more maintainable code.
  • 15. Frameworks - Security • In PHP you can already find many input and output filtering functions to protect your website against certain attacks. • However, manually using these functions can get tiring and you may forget about them every once in a while. • With a framework, most of the work can be done for you automatically. For example in CodeIgniter: 1. Any value passed to database object gets filtered against SQL injection attacks. 2. All html generating functions, such as form helpers and url helpers filter the output automatically. 3. All user input can be filtered against XSS attacks. 4. Encrypting cookies automatically is only a matter of changing a config option.
  • 16. Frameworks – Less Code & Faster Development • There is of course a learning curve for all PHP Frameworks. But once you get over this hump, you will enjoy the benefits of rapid application development. • You will write less code, which means less time spent typing. You will not have to chase down 3rd party libraries all the time for every new project because most of them will come with the default framework install. • Also, since you are being more organized, it will be much faster to chase down bugs, maintain code, and make changes to existing code.
  • 17. Frameworks – Community Support • All popular PHP Frameworks have great active communities behind them. You can talk to other developers, get help, feedback and also give back to the community yourself. • There are message boards and mailing lists… You can also learn a lot by just browsing the forums and look at what other people are talking about.
  • 18. Frameworks - Suitable for Teamwork • The way your project is organized in a PHP Framework also helps you create a suitable environment for teamwork. • You can let your designers work on the Views, database guru work on the Models, let the smart programmer build reusable Libraries and Plugins etc… • Also you can have someone build unit tests, because they come with tools for that too.
  • 19. Frameworks – Which one? 1. 2. 3. 4. 5. 6. Laravel Phalcon Symfony CodeIgniter CakePHP Zend • There are also JavaScript frameworks which you normally put them together alongside your PHP framework to be more productive!
  • 20. Templates • A template is a set of HTML as well as CSS files that organize the look and feel of your page. • They basically make up the Views you will use in your framework. • Thus, your only job is to use the MVC framework to fill the appropriate content on each of your pages.
  • 23. Templates • And the list goes on and on… • We will have to choose one of the ones listed in the .doc file