SlideShare uma empresa Scribd logo
1 de 13
Extension Development Starter
JIIT OSDC OSDC – Open Source Developers Club OSDC, formerly known as Linux User Group (LUG), is a students initiated and maintained body which promotes and encourages the use of Free and Open Source Software (FOSS) amongst students in JIIT. Open for anyone to join. Links: Wiki - http://opensource.jiitu.org/wiki/ IRC - #jiit-lug on irc.freenode.net Google Groups (Mailing List) - http://groups.google.com/group/jiitlug/
Knowledge Requirement Minimum requirement is basic knowledge and understanding of the following: HTML (not necessary, but knowledge of HTML really helps with understanding other languages used). Markup Languages XML CSS (basic) Javascript (basic)
HTML Brief on HTML: Stands for HyperText Markup Language. The predominant markup language that is used for web pages. You can use any text editor to write HTML code (example: notepad in Windows, gedit and vim in Linux).
HTML (Example) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">  	<head>  		<title>HTML - Wikipedia, the free encyclopedia</title>  	</head> 	<body> 		<h1>Sample HTML Page</h1> 		<hr size=1 /> 		<p>Loremipsum...</p> 		<p>Donecdapibus...</p> 	</body> </html> File name: sample.html
Markup Languages A markup language is a modern a way that is synsystem for annotating a text in tactically distinguishable from that text. So, a piece of text enclosed within some kind of markup has some meaning and the meaning is related to the markup. Examples of markup languages: HTML, XML
Markup Languages Example: <html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">  	<head><title>HTML - Wikipedia, the free encyclopedia</title></head> 	<body> 		<h1>Sample HTML Page</h1> 		<hr size=1 /> 		<p>Loremipsum...</p> 		<p>Donecdapibus...</p> 	</body> </html> <title> tag defines the title of the webpage that is shown in the browser window’s title bar. <h1> stands for Heading 1, which basically means heading of a particular size. Similarly, <p> stands for paragraph. All these tags surround a piece of text and each tag has a meaning. And that’s how browsers interpret web pages.
XML Stands for Extensible Markup Language. XML is designed to store and transport data. XML code itself is stored in simple text files with a .xml extension. HTML (and XHTML) is a type (or form) of XML. Just like HTML, you can use any editor you want to code XML. XML is important to know and is very easy to learn.
XML So, an XML file without any context has no meaning. For example, if we treat HTML files as XML code, then they make sense as the information stored in HTML files is used to render web pages in web browsers. This makes XML very powerful as any developer can define a standard form of XML code which can be used for a particular application. Other famous forms of XML – XUL, SVG, etc.
XML (Example) <?xml version="1.0"?> <name>Message</name> <note> 	<to>Tove</to> 	<from>Jani</from> 	<heading>Reminder</heading> 	<body>Don't forget me this weekend!</body> </note> <note> 	<to>JIIT</to> 	<from>JUIT</from> 	<heading>Fest Invitation</heading> 	<body>Invitation for sports fest!</body> 	<file location="http://www.abc.com/invitation.jpg" /> </note> Isn’t this very similar to HTML? As I mentioned before, HTML is a form of XML or we can say that it has evolved from HTML. File name: sample.xml
CSS Stands for Cascading Style Sheets. CSS is a style sheet language used to describe the look and formatting of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML. But, the language can also be applied to any kind of XML document, including plain XML, SVG and XUL.
CSS (Example) <html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">  	<head>  		<title>HTML - Wikipedia, the free encyclopedia</title>  <link rel="stylesheet" type="text/css" href="css.css" /> 	</head> 	... 	... </html> <link> tag is used to create links (not hyperlinks) between HTML pages and other types of files like CSS files. It is also used for a lot of other purposes. The type attribute specifies the type of file that is being linked to the HTML file. The href attribute specifies the path of file that is going to be linked. File name: css.html, css.css
Further Reading Refer to the following links: Don’t study HTML right now. Study XML, CSS and Javascript from W3schools.com.

Mais conteúdo relacionado

Mais procurados

Open Hardware Repository
Open Hardware RepositoryOpen Hardware Repository
Open Hardware Repository
FSCONS
 
Word to WordPerfect Conversion: How to Strip Formatting
Word to WordPerfect Conversion: How to Strip FormattingWord to WordPerfect Conversion: How to Strip Formatting
Word to WordPerfect Conversion: How to Strip Formatting
Oregon Law Practice Management
 
HTML Tutorial: Chapters 1 & 2
HTML Tutorial: Chapters 1 & 2HTML Tutorial: Chapters 1 & 2
HTML Tutorial: Chapters 1 & 2
michaeljm007
 
Working with External CSS
Working with External CSSWorking with External CSS
Working with External CSS
davereece
 
HTML Tutorial: Chapter 3
HTML Tutorial: Chapter 3HTML Tutorial: Chapter 3
HTML Tutorial: Chapter 3
michaeljm007
 
Web Fundamentals And Html Chapter 1
Web Fundamentals And Html Chapter 1Web Fundamentals And Html Chapter 1
Web Fundamentals And Html Chapter 1
raileeanne
 

Mais procurados (20)

HTML (Hyper Text Markup Language)
HTML (Hyper Text Markup Language)HTML (Hyper Text Markup Language)
HTML (Hyper Text Markup Language)
 
Open Hardware Repository
Open Hardware RepositoryOpen Hardware Repository
Open Hardware Repository
 
Intro to HTML
Intro to HTMLIntro to HTML
Intro to HTML
 
3. Web Technology Advanced HTML
3. Web Technology Advanced HTML3. Web Technology Advanced HTML
3. Web Technology Advanced HTML
 
Hyper Text Mark-up Language
Hyper Text Mark-up Language Hyper Text Mark-up Language
Hyper Text Mark-up Language
 
HTML BASIC BY SHASHI KANT SINGH HAJIPUR
HTML BASIC BY SHASHI KANT SINGH HAJIPUR HTML BASIC BY SHASHI KANT SINGH HAJIPUR
HTML BASIC BY SHASHI KANT SINGH HAJIPUR
 
Word to WordPerfect Conversion: How to Strip Formatting
Word to WordPerfect Conversion: How to Strip FormattingWord to WordPerfect Conversion: How to Strip Formatting
Word to WordPerfect Conversion: How to Strip Formatting
 
Html1
Html1Html1
Html1
 
HTML Tutorial: Chapters 1 & 2
HTML Tutorial: Chapters 1 & 2HTML Tutorial: Chapters 1 & 2
HTML Tutorial: Chapters 1 & 2
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Working with External CSS
Working with External CSSWorking with External CSS
Working with External CSS
 
Hypertext markup language (html)
Hypertext markup language (html)Hypertext markup language (html)
Hypertext markup language (html)
 
Html
HtmlHtml
Html
 
HTML Tutorial: Chapter 3
HTML Tutorial: Chapter 3HTML Tutorial: Chapter 3
HTML Tutorial: Chapter 3
 
Html
HtmlHtml
Html
 
Web Fundamentals And Html Chapter 1
Web Fundamentals And Html Chapter 1Web Fundamentals And Html Chapter 1
Web Fundamentals And Html Chapter 1
 
Xml ppt
Xml pptXml ppt
Xml ppt
 
Simple blogging
Simple bloggingSimple blogging
Simple blogging
 
Intro To HTML
Intro To HTMLIntro To HTML
Intro To HTML
 
HTML5 & CSS3 -- UPA Iowa
HTML5 & CSS3 -- UPA IowaHTML5 & CSS3 -- UPA Iowa
HTML5 & CSS3 -- UPA Iowa
 

Destaque (7)

Reinventing Marketing For The Small Business
Reinventing Marketing For The Small BusinessReinventing Marketing For The Small Business
Reinventing Marketing For The Small Business
 
Version Controlling
Version ControllingVersion Controlling
Version Controlling
 
Email marketing terms
Email marketing termsEmail marketing terms
Email marketing terms
 
Mobile Marketing to Youth - Mobile Monday
Mobile Marketing to Youth - Mobile MondayMobile Marketing to Youth - Mobile Monday
Mobile Marketing to Youth - Mobile Monday
 
Institucional Inmuner
Institucional InmunerInstitucional Inmuner
Institucional Inmuner
 
การแลกเปลี่ยนก๊าซ
การแลกเปลี่ยนก๊าซการแลกเปลี่ยนก๊าซ
การแลกเปลี่ยนก๊าซ
 
DataSift September '12 Release Overview
DataSift September '12 Release OverviewDataSift September '12 Release Overview
DataSift September '12 Release Overview
 

Semelhante a Firefox Extension Development | By JIIT OSDC

Html guide
Html guideHtml guide
Html guide
Dileysi
 
Html Intro2
Html Intro2Html Intro2
Html Intro2
mlackner
 
introdution-to-html.pptx
introdution-to-html.pptxintrodution-to-html.pptx
introdution-to-html.pptx
datapro2
 

Semelhante a Firefox Extension Development | By JIIT OSDC (20)

Html For Beginners 2
Html For Beginners 2Html For Beginners 2
Html For Beginners 2
 
Design Tools Html Xhtml
Design Tools Html XhtmlDesign Tools Html Xhtml
Design Tools Html Xhtml
 
Html basic
Html basicHtml basic
Html basic
 
Xml Zoe
Xml ZoeXml Zoe
Xml Zoe
 
Xml Zoe
Xml ZoeXml Zoe
Xml Zoe
 
Web designing using html
Web designing using htmlWeb designing using html
Web designing using html
 
Pmm05 16
Pmm05 16Pmm05 16
Pmm05 16
 
HTML
HTMLHTML
HTML
 
Web1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSSWeb1O1 - Intro to HTML/CSS
Web1O1 - Intro to HTML/CSS
 
Introduction to XML
Introduction to XMLIntroduction to XML
Introduction to XML
 
HTML
HTMLHTML
HTML
 
Html
HtmlHtml
Html
 
Class2
Class2Class2
Class2
 
Html guide
Html guideHtml guide
Html guide
 
HTML & CSS
HTML & CSSHTML & CSS
HTML & CSS
 
HTML element is everything between the start tag and the end tag
HTML element is everything between the start tag and the end tagHTML element is everything between the start tag and the end tag
HTML element is everything between the start tag and the end tag
 
Block2 Session2 Presentation
Block2 Session2 PresentationBlock2 Session2 Presentation
Block2 Session2 Presentation
 
Html Intro2
Html Intro2Html Intro2
Html Intro2
 
XHTML and CSS
XHTML and CSS XHTML and CSS
XHTML and CSS
 
introdution-to-html.pptx
introdution-to-html.pptxintrodution-to-html.pptx
introdution-to-html.pptx
 

Último

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Último (20)

DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 

Firefox Extension Development | By JIIT OSDC

  • 2. JIIT OSDC OSDC – Open Source Developers Club OSDC, formerly known as Linux User Group (LUG), is a students initiated and maintained body which promotes and encourages the use of Free and Open Source Software (FOSS) amongst students in JIIT. Open for anyone to join. Links: Wiki - http://opensource.jiitu.org/wiki/ IRC - #jiit-lug on irc.freenode.net Google Groups (Mailing List) - http://groups.google.com/group/jiitlug/
  • 3. Knowledge Requirement Minimum requirement is basic knowledge and understanding of the following: HTML (not necessary, but knowledge of HTML really helps with understanding other languages used). Markup Languages XML CSS (basic) Javascript (basic)
  • 4. HTML Brief on HTML: Stands for HyperText Markup Language. The predominant markup language that is used for web pages. You can use any text editor to write HTML code (example: notepad in Windows, gedit and vim in Linux).
  • 5. HTML (Example) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml"> <head> <title>HTML - Wikipedia, the free encyclopedia</title> </head> <body> <h1>Sample HTML Page</h1> <hr size=1 /> <p>Loremipsum...</p> <p>Donecdapibus...</p> </body> </html> File name: sample.html
  • 6. Markup Languages A markup language is a modern a way that is synsystem for annotating a text in tactically distinguishable from that text. So, a piece of text enclosed within some kind of markup has some meaning and the meaning is related to the markup. Examples of markup languages: HTML, XML
  • 7. Markup Languages Example: <html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml"> <head><title>HTML - Wikipedia, the free encyclopedia</title></head> <body> <h1>Sample HTML Page</h1> <hr size=1 /> <p>Loremipsum...</p> <p>Donecdapibus...</p> </body> </html> <title> tag defines the title of the webpage that is shown in the browser window’s title bar. <h1> stands for Heading 1, which basically means heading of a particular size. Similarly, <p> stands for paragraph. All these tags surround a piece of text and each tag has a meaning. And that’s how browsers interpret web pages.
  • 8. XML Stands for Extensible Markup Language. XML is designed to store and transport data. XML code itself is stored in simple text files with a .xml extension. HTML (and XHTML) is a type (or form) of XML. Just like HTML, you can use any editor you want to code XML. XML is important to know and is very easy to learn.
  • 9. XML So, an XML file without any context has no meaning. For example, if we treat HTML files as XML code, then they make sense as the information stored in HTML files is used to render web pages in web browsers. This makes XML very powerful as any developer can define a standard form of XML code which can be used for a particular application. Other famous forms of XML – XUL, SVG, etc.
  • 10. XML (Example) <?xml version="1.0"?> <name>Message</name> <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Don't forget me this weekend!</body> </note> <note> <to>JIIT</to> <from>JUIT</from> <heading>Fest Invitation</heading> <body>Invitation for sports fest!</body> <file location="http://www.abc.com/invitation.jpg" /> </note> Isn’t this very similar to HTML? As I mentioned before, HTML is a form of XML or we can say that it has evolved from HTML. File name: sample.xml
  • 11. CSS Stands for Cascading Style Sheets. CSS is a style sheet language used to describe the look and formatting of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML. But, the language can also be applied to any kind of XML document, including plain XML, SVG and XUL.
  • 12. CSS (Example) <html lang="en" dir="ltr" xmlns="http://www.w3.org/1999/xhtml"> <head> <title>HTML - Wikipedia, the free encyclopedia</title> <link rel="stylesheet" type="text/css" href="css.css" /> </head> ... ... </html> <link> tag is used to create links (not hyperlinks) between HTML pages and other types of files like CSS files. It is also used for a lot of other purposes. The type attribute specifies the type of file that is being linked to the HTML file. The href attribute specifies the path of file that is going to be linked. File name: css.html, css.css
  • 13. Further Reading Refer to the following links: Don’t study HTML right now. Study XML, CSS and Javascript from W3schools.com.