Liyas Thomas

Posted on Jul 12, 2019 • Edited on Dec 11, 2020

I created an easy way to browse & find Google books (today is my birthday 🎈)

#javascript #showdev #webdev

Books 📚

Find books from Google Play Books

Feel free to contribute on GitHub

I was casually surfing online and saw an article about Google Books API. I read the docs, and decided to create a minimal, lightweight and beautiful web app to browse & find books using Google Books API.

That's why I created Books 📚.

Books is an open-source project which make use of Google Books API.

Some of its features are:

Search book by title, author, category, genre etc.
Minimal and elegant UI.
PWA support.
Dark mode. Can't live without it!

Bonus: 🌗 I also added dark mode so that your eyes won't hurt during night!

Demo 🚀

Feel free to contribute on GitHub

I'm writing a book: De-Coding The Passion Project 📘

Liyas Thomas ・ May 24 '20

#books #productivity #startup #watercooler

If you want a heads up on my next projects, or just want to chat about the web, life and happiness make sure to follow me @liyasthomas on Twitter 💙. If any of my projects helped you please consider making a donation.

Top comments (51)

Ahmed Musallam • Jul 12 '19

That's Awesome!

I got lost here as well: liyasthomas.github.io
Really cool work!

Could not help but notice a lot of UI similarities in your projects, do you use a certain UI library? or just re-use your own styles?

Liyas Thomas • Jul 12 '19

I currently don't use any 3rd party libraries. Just pure JavaScript, HTML & CSS. Of course I reuse most of my components, especially light/dark mode toggle, font stylings etc.

Ahmed Musallam • Jul 12 '19

I was looking at github.com/liyasthomas/books/blob/...

A lot of awesome things in there. and only 8KB unzipped or minified!

While inspecting the source I saw that

.category {
      height: 25vh;
}

Curious why you picked vh vs other units in this case?

I know users wont do this, but when shrinking the view-port height the title inside .category pops out :)

Liyas Thomas • Jul 12 '19

Nice you noticed that. What you explained is a bug/issue for sure.

But, sometimes some bugs are beautiful. At some use cases most of my apps would fail. But I don't mind that. Nothing is perfect. I'll certainly look into it and make it more better. Will add more bugs to fix later 🤪

Ahmed Musallam • Jul 12 '19

hahaha. I was more curious about the vh and the use-case for using it than to report a bug that almost no one will notice.. lol 😁

Liyas Thomas • Jul 12 '19 • Edited

As vh and vw changes with viewports, I like the ratio or say the proportion of UI more than giving a fixed unit. That's why I did that.

Ahmed Musallam • Jul 12 '19

I see, makes sense. thanks and keep on rockin' !

Priyanka Kore • Jul 12 '19

Hey Liyas,

A very happy birthday! Amazing app 👏🏻 looks wise and also functionally, all the book worms of the world thank you.

I see that you have chosen one of the most amazing color schemes. Is there any specific way you do that? any place you can check which colors look good together something like that?

Liyas Thomas • Jul 12 '19

Thanks for the appreciation ✨

Thanks for this question. See, I'm a self learnt and self sustaining developer. If I couldn't find a tool for my needs, I would make one. Which makes me a better learner.

Regarding color scheme:

I use a tool called Colorbook which I made myself for creating color combination schemes for UI. I wrote about it on DEV.to here. Colorbook is an easy & great tool for playing around different color combos and copying color codes for development. GitHub link. Check out my GitHub profile for more tools and resources.

Bill • Jul 12 '19

Hey Liyas,

Happy birthday, have an awesome day!

I really like your project. Great design, performant, and user friendly. I'd love to try and contribute and I may do soon. Nice work on the banner generator too!

Liyas Thomas • Jul 12 '19

Thanks. I'm rocking. Follow my other projects on GitHub
You drink water, keep hydrated and stay healthy 🤸‍♀️

Wiktor Olejniczak • Jul 12 '19

Wow, The UI is really awesome! Everything feels so smooth and well-animated 👏 I took a look at your other projects, and wow, they're really inspiring 🤩

The only thing that slightly falls behind here is the shadow animation, a bit laggy 🙁

Oh, and happy birthday!

Liyas Thomas • Jul 12 '19

Thanks for the appreciation ✨
I'll fix all issues you've faced in next commit.

Kevin G. Kayisire • Jul 12 '19

Happy birthday, Unicorn.

Nice UI also, keep it up!

Liyas Thomas • Jul 12 '19

Always be yourself unless you can be an unicorn 🦄
Then always be an unicorn 🦄

Abhi • Jul 12 '19

Wow! such a beautiful UI. What was the inspiration behind the UI design?

Liyas Thomas • Jul 12 '19

Maybe I spent so much time on Dribbble & Behance? Maybe I like minimalistic UI. Maybe I'm too lazy to come up with a new design at all. 💁‍♂️ who knows?