Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying Web Development with Jade
  • Table Of Contents Toc
Web Development with Jade

Web Development with Jade

By : Sean Lang
4.3 (4)
Buy this Book
close
close
Web Development with Jade

Web Development with Jade

4.3 (4)
By: Sean Lang
Buy this Book

Overview of this book

Table of Contents (16 chapters)
close
close
close
Web Development with Jade
Icon
Web Development with Jade
Credits
Icon
Credits
About the Author
Icon
About the Author
About the Reviewers
Icon
About the Reviewers
www.PacktPub.com
Icon
www.PacktPub.com
Preface
Icon
Preface
Lock Free Chapter
1
What is Jade?
Icon
What is Jade?
Icon
Markup like poetry
Icon
Compiling Jade
Icon
Summary
2
Basic Syntax
chevron up
Icon
Basic Syntax
Icon
Significance of whitespace
Icon
Tags
Icon
Inline HTML
Icon
Attributes
Icon
Shorthands
Icon
Comments
Icon
Block expansion
Icon
Doctypes
Icon
Summary
3
Feeding Data into Templates
Icon
Feeding Data into Templates
Icon
Syntax
Icon
Defining variables
Icon
Interpolation everywhere!
Icon
Using variables without interpolation
Icon
Escaping
Icon
Sending the variables to the compiler
Icon
Summary
4
Logic in Templates
Icon
Logic in Templates
Icon
Adding logic with JavaScript
Icon
Built-in logical operators
Icon
A warning about interpolation
Icon
Summary
5
Filters
Icon
Filters
Icon
The full list
Icon
Examples
Icon
Passing arguments
Icon
Summary
6
Mixins
Icon
Mixins
Icon
Syntax and mechanics
Icon
Another warning about interpolation
Icon
The arguments object
Icon
Summary
7
Template Inheritance
Icon
Template Inheritance
Icon
Blocks
Icon
Extends
Icon
Includes
Icon
Summary
8
Organizing Jade Projects
Icon
Organizing Jade Projects
Icon
General best practices
Icon
Summary
1
A Closing Note – Contributing Back to Jade
Icon
A Closing Note – Contributing Back to Jade
2
Index
Icon
Index

Tags

Since Jade is indentation-based, there are no end tags, and there are no angle brackets (<, >) to surround tags, because those are lame and ugly. The name of the tag is all that you need, and it is the first text on the line. Consider the following example:

Jade

HTML

p
<p></p>

If we add another tag within the <p> block (as explained earlier), we can create a nested tag as follows:

Jade

HTML

p
  span
<p>
  <span></span>
</p>

Alternatively, without putting it in the <p> block, we can just create it in a way that it acts as a sibling, as follows:

Jade

HTML

p
span
<p></p>
<span></span>

Text and blocks of text

Tags are pretty boring if they don't have any content, so Jade gives us three ways of putting text in tags.

Text on the same line

You can put the text directly after the tag name (separated by a space) as follows:

Jade

HTML

p Hello Word!
<p>Hello Word!</p>

Text blocks

For large bodies of text, putting...

CONTINUE READING
83
Tech Concepts
36
Programming languages
73
Tech Tools
Icon Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.
Icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Icon 50+ new titles added per month and exclusive early access to books as they are being written.
Web Development with Jade
End of Section 2
Next Section
notes
bookmark Notes and Bookmarks search Search in title playlist Add to playlist font-size Font size

Change the font size

margin-width Margin width

Change margin width

day-mode Day/Sepia/Night Modes

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY

Submit Your Feedback

Modal Close icon
Modal Close icon
Modal Close icon