A Search Engine in CSS

[pixelastic]

Main programming language

CSS

Tutorial title

A Search Engine in CSS

Tutorial URL

https://stories.algolia.com/a-search-engine-in-css-b5ec4e902e97

I also did a talk on the same subject, walking the audience through the various steps: https://www.youtube.com/watch?v=NFeRlR9dOwY (and slides available at http://talks.pixelastic.com/slides/hacking-css-dotcss-2017/#/)

Category

• 3D Renderer
• Blockchain / Cryptocurrency
• Bot
• Database
• Docker
• Emulator
• Front-end Framework / Library
• Game
• Git
• Network Stack
• Neural Network
• Operating System
• Programming Language
• Regex Engine
• Shell
• Template Engine
• Web Server
• Uncategorized
• Search Engine

[bruceblore]

I am not sure if a search engine written in CSS is very useful. It is designed to define how webpages look and does an awesome job at it, but it is simply not designed to perform actual computations like searches.

Also, I have heard that HTML5+CSS3 is turing complete, but a quick internet search reveals that there is in fact a lot of debate about this. Enjoy your eight megabyte CSS file, though.

I think this is good to add as long as you point out that this is NOT FOR PRODUCTION USE.

[pixelastic]

Sure, this was mostly a training exercise, to see how far one could go with CSS, while also understanding what are the building blocks of a search engine.

I think the article clearly explain that this was an April Fool's joke and not to be taken seriously. I also clearly state in the video that this should not be used in production.

The performance is actually pretty good (much better than what I would have expected at first). I mean, once you've downloaded the huge CSS file. Once again, this is a proof of concept and CSS has clearly not been designed for this. But I don't think JavaScript has been designed for creating a git clone to be used in production either :)

In the end that's your call, I'm happy either way; just thought it could have its place in the list.

[bruceblore]

Honestly, I have nothing to do with this project. I am just a random teenager that saw it in my GitHub Explore email. I kinda just skimmed over the article, but I think I should actually read it. I guess that Linux was not "meant" to be portable either, and look what it has become. I vote for adding this tutorial with a clear disclaimer that it is not really for production.

[danistefanovic]

Tutorials in this list are primarily meant for educational purposes to show how some common concepts and technologies work behind the scenes. "A Search Engine in CSS" may not completely fit with that, but in the end, it's a fun experiment that results in a working search functionality. Thanks!

[pixelastic]

@0100001001000010 Thanks for the feedback and @danistefanovic thanks for adding it :)