SlideShare ist ein Scribd-Unternehmen logo
1 von 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.

Weitere Àhnliche Inhalte

Was ist angesagt?

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
 

Was ist angesagt? (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
 

Andere mochten auch (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
 

Ähnlich wie 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
 

Ähnlich wie 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
 

KĂŒrzlich hochgeladen

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎+971_581248768%)**%*]'#abortion pills for sale in dubai@
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 

KĂŒrzlich hochgeladen (20)

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...
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source Milvus
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
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
 
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 Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
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, ...
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 

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.