Lib for CSS Rendering

I am pretty much new to Elixir, but watched several yt videos and currently reading Elixir in Action. As a good first starting project i thought about building a CSS rendering library, because I need one anyway in the future and I couldn’t find one on Hex, also it seems like a good first way to see if Elixir can even fulfill the needs of my future projects.

(What I mean with “CSS rendering”: Define an AST of CSS and render it to fully compatible css) Example of such a project in node: Click here

Anyway I am here to see if anyone of you, (especially Full stack Devs) is interested in such a lib for elixir. And if so: what the “bare”, technical requirements for your usage would look like. As an example: do you (like me) only need a way to render css or do you need a way to parse css into an AST?

2 Likes

It would be amazing if such a library would exist! Some applications I can think of:

  • Building a SASS/SCSS/LESS to CSS compiler.
  • Creating a library that can take an HTML-file and a CSS file, and apply all styles in the CSS to the elements inline, so it will be rendered properly in email clients. Similar to this Ruby gem
  • Creating highly customizeable templating-engines, where users can change settings that will produce a CSS AST.

So, ‘bare’ requirements would be:

  • Convert plain CSS to CSS-AST
  • Convert CSS-AST to plain CSS.
  • Allow other libraries to create/modify (part of an) AST in a relatively straightforward way.

(What I mean with “CSS rendering”: Define an AST

https://en.wikipedia.org/wiki/Abstract_syntax_tree of CSS and render it
to fully compatible css) Example of such a project in
​​
node: Click here https://www.npmjs.com/package/css

​Can you explain more why you want this and what it actually does?

You’re going to take CSS
and turn it into - CSS? ​

I’m totally missing the point here…​

Hassan Schroeder ------------------------ hassan.schroeder@gmail.com
Hassan Schroeder | about.me
twitter: @hassan
Consulting Availability : Silicon Valley or remote

Hey Hassan

Did you use an css compiler, didnt you? If not, it would be best for you to try one out, as an example Stylus, Less or SASS. To answer your question CSS is a syntax, but ASTs are trees of syntax and therefore a pretty different beast, they are a more abstract way to structure data and processes. If you are interested in ASTs you really should read the wiki article.

But i didnt create this thread to teach peeps the basics about ASTs :).

At the end, if you don’t see the use case anyway, you maybe shouldnt even bother about this thread :smiley:

Sass, Less and large Libs which already exists somewhere:
I am not sure about the Sass, Less, Compilers as a real application: the problem I see here is that we would create redundance, and a really large one. Behind SASS, Less and all of those larger libs lies a lot of work. Porting those to Elixir should be done as direct as possible - maybe theres a good way with Nexe:


When we can get the ok of the devs of those libs we could create binaries and use them in Hex modules for mix.

Inliners:
An inliner would be really handy, and I see potential for a separate module.

Thank you a lot for your input! Oh and of course, I will try to make it in a straightforward way :smiley:

Do you know Elixir well? Would you be interested to try my module out when its ready :)?

But i didnt create this thread to teach peeps the basics about ASTs :).

At the end, if you don’t see the use case anyway, you maybe shouldnt even
bother about this thread [image: :smiley:]

​My question wasn’t about ASTs, it was trying to understand the use
case to start with. ​

​And apparently the goal is to take something that is not strictly
speaking CSS and turn it into CSS, so no, I don’t really care much
about that, regardless of intermediate form :-)​

Hassan Schroeder ------------------------ hassan.schroeder@gmail.com
Hassan Schroeder | about.me
twitter: @hassan
Consulting Availability : Silicon Valley or remote