Basic Example of JSS

I have just started reading into JSS .
In my project I have added MeteorHacks NPM , and I have added the JSS npm package.

For some reason I cannot seem to get an example working.

Could someone provide an example on how to do a simple stylesheet ?

Thank you in advance .


just curious, can you tell me why you want to use JSS? Defining your styles in JSON.

Why not use Stylus (great lib) or LESS or SASS?

@mspi I was only interested in JSS because I original asked questions about Stylus and it seemed to be a stand off in the community JSS vs. Stylus. I liked the idea of just writing my css in javascript. However I am starting to lean back towards stylus and possibly wanting to further my knowledge there.

On the contrary , in terms of stylus I have heard a lot of people mention nib. Are you familiar with nib and what it brings to stylus ? If i can get an understanding of that I may just as well keep things in stylus.

Aren’t JSS and Stylus completely different things? Stylus is like LESS or SASS where you can use mixins, variables, conditions but you still write you code in CSS kind of fashion.
While JSS (don’t know it, but had a quick look) you write it in JSON style.
I would rather se a stand against people choosing LESS over SASS or SASS over Stylus or any other variation.

To answer you question about NIB, yes I uses it.
It will provide out of the box mixins for you to use. Check the github page for reference:

You will also be interested in Rupture for Media Queries:

Yes they are completely different , but they are the two that I have been bouncing back and forth in terms of where I should spend my energy. Because they are so different this is why i’m asking questions in terms on what is best.

I’m finding that just about anything you can do in less , sass, and scss you can pretty much do in stylus. Stylus accepts syntax for the coffescript type syntax as well as native css , and using or not using brackets. It even allows you to mix in directly in the same file.

My reason for wanting to know about JSS is because I like the idea that it is all javascript, and it seems appealing , but I have not been able to get it working in Meteor.

Yes, Stylus is a fine library.
Personally I like to stick to CSS for styles. JS for client and server makes sense to me, but Styling is a whole different category in my opinion and I prefer to stick to css or a preprocessor.
I mean we also still use HTML or JADE in my case, which is still a markup language. I am not going to use JS to create my markup :), well at least not today :smile:

:slight_smile: I definitely understand your point there.

+1 for Stylus, highly recommend.

1 Like

I believe I will be using stylus . It is easy to convert bootstrap themes using .less to stylus , if I need to.